feat: 服务管理

src/api/serv.js

+import {axios} from '@/util/axios/request'
+
+const BASE_URL = '/service'
+
+
+export function getCategoryList(data) {
+  return axios({
+    url: `${BASE_URL}/category-list`,
+    method: 'post',
+    data
+  })
+}
+
+
+export function getDetails(id) {
+  return axios({
+    url: `${BASE_URL}/${id}`,
+    method: 'get',
+  })
+}
+
+
+export function getSubDetails(id) {
+  return axios({
+    url: `${BASE_URL}/sub-class/${id}`,
+    method: 'get',
+  })
+}
+
+
+export function updateCategory(data) {
+  return axios({
+    url: `${BASE_URL}/category`,
+    method: 'post',
+    data
+  })
+}
+
+export function saveOrUpdateSubClass(data) {
+  return axios({
+    url: `${BASE_URL}/subclass`,
+    method: 'post',
+    data
+  })
+}
\ No newline at end of file

src/api/user.js

 import {axios} from '@/util/axios/request'
 
-const BANNER_URL = '/user'
+const BASE_URL = '/user'
 
 export function getPage(data) {
   return axios({
-    url: `${BANNER_URL}/page`,
+    url: `${BASE_URL}/page`,
     method: 'post',
     data
   })
@@ -13,7 +13,7 @@ export function getPage(data) {
 
 export function save(data) {
   return axios({
-    url: BANNER_URL,
+    url: BASE_URL,
     method: 'put',
     data,
   })

src/components/table/TableScript.vue

@@ -48,7 +48,8 @@ export default {
       expandedRowKeys: [],
       bordered: false,
       childrenColumnName: 'children',
-      searchHeight: 0 // 搜索框高度
+      searchHeight: 0, // 搜索框高度
+      defaultExpandAllRows: false
     }
   },
   computed: {
@@ -133,6 +134,9 @@ export default {
           }
         }
         this.loading = false
+        if(this.loadSuccess) {
+          this.loadSuccess()
+        }
       })
     },
     search() {

src/components/table/TableTemplate.vue

@@ -32,6 +32,7 @@
       :bordered="soul.bordered"
       :expandedRowKeys.sync="soul.expandedRowKeys"
       :pagination="soul.paginationConfig"
+      :defaultExpandAllRows="soul.defaultExpandAllRows"
     >
       <div slot="title" v-if="soul.useTitle">
         <span class="cust-title">

src/views/banner/BannerList.vue

@@ -116,7 +116,6 @@ export default {
           }
         })
         .finally(() => {
-          console.info(this.loadingKeys.includes(record.id))
           this.loadingKeys.splice(this.loadingKeys.indexOf(record.id), 1)
         })
     }

src/views/serv/ServiceList.vue

+<template>
+  <table-template :soul="this">
+    <template #action="{ record }">
+      <a-space>
+        <template v-if="record.type == 1">
+          <a @click="add(record)">添加服务项</a>
+        </template>
+        <template v-if="record.type == 2">
+          <a @click="edit(record)">修改信息</a>
+        </template>
+      </a-space>
+    </template>
+    <template #enable="{ record, index }">
+      <a-switch
+        v-if="record.type == 2"
+        :checked="record.enabled"
+        checked-children="启用"
+        un-checked-children="禁用"
+        :loading="loadingKeys.includes(record.id)"
+        @click="enableChange(record, index)"
+      />
+    </template>
+    <template #free>
+      <SubClassEdit ref="SubClassEdit" :success="reset" />
+    </template>
+  </table-template>
+</template>
+<script>
+import { TableTemplate, TableScript, SearchType } from '@/components/table'
+import { getCategoryList, saveOrUpdateSubClass } from '@/api/serv'
+import SubClassEdit from './SubClassEdit.vue'
+import dayjs from 'dayjs'
+
+const columns = [
+  {
+    title: '名称',
+    dataIndex: 'serviceName'
+  },
+  {
+    title: '排序号',
+    width: 130,
+    dataIndex: 'sequence'
+  },
+  {
+    title: '是否启用',
+    scopedSlots: { customRender: 'enable' },
+    enum: 'SYS0002',
+    dataIndex: 'enabled',
+    filter: { type: SearchType.ENUM }
+  },
+  {
+    title: '创建时间',
+    dataIndex: 'createTime',
+    width: 200,
+    sorter: true,
+    customRender: (text) => dayjs(text).format('YYYY-MM-DD HH:mm:ss')
+  },
+  { title: '操作', scopedSlots: { customRender: 'action' }, width: 190 }
+]
+
+export default {
+  name: 'ServiceList',
+  mixins: [TableScript, {}],
+  components: { TableTemplate, SubClassEdit },
+  data() {
+    return {
+      columns,
+      useYScroll: true,
+      title: '服务管理',
+      pagination: false,
+      codes: [['SYS0002'], []],
+      loadingKeys: [],
+      rowKey: 'key'
+    }
+  },
+  methods: {
+    queryData: getCategoryList,
+    loadSuccess() {
+      console.info('xxxxxxxxxssssssssssss')
+      this.expandedRowKeys = this.dataSource.map((d) => d.id + '')
+    },
+    enableChange(record, index) {
+      console.info('record', record)
+      if (this.loadingKeys.includes(record.id)) {
+        return
+      }
+      this.loadingKeys.push(record.id)
+      console.info('index', index)
+      saveOrUpdateSubClass({ id: record.id, enabled: !record.enabled })
+        .then(({ code }) => {
+          if (code == 200) {
+            this.$message.success('保存成功')
+            const pIndex = this.dataSource.findIndex(
+              (d) => d.id == record.categoryId
+            )
+            console.info(pIndex)
+            this.dataSource[pIndex].children[index].enabled = !record.enabled
+            console.info(this.dataSource)
+          }
+        })
+        .finally(() => {
+          this.loadingKeys.splice(this.loadingKeys.indexOf(record.id), 1)
+        })
+    },
+    edit(record) {
+      const categoryName = this.dataSource.filter(
+        (d) => d.id == record.categoryId
+      )[0].serviceName
+      this.$refs.SubClassEdit.show({
+        id: record.id,
+        categoryId: record.categoryId,
+        categoryName
+      })
+    },
+    add(record) {
+      this.$refs.SubClassEdit.show({
+        id: null,
+        categoryId: record.id,
+        categoryName: record.serviceName
+      })
+    }
+  }
+}
+</script>
\ No newline at end of file

src/views/serv/SubClassEdit.vue

+<template>
+  <a-drawer
+    :width="500"
+    :visible="visible"
+    :title="id ? '编辑服务项' : '新增服务项'"
+    @close="close"
+  >
+    <a-form :form="form" layout="vertical">
+      <a-form-item :label="`服务大类：  ${categoryName}`"> </a-form-item>
+      <a-form-item label="名称">
+        <a-input v-decorator="['serviceName']" />
+      </a-form-item>
+      <ImageUpload
+        label="图片"
+        decoration="img"
+        :formItemLayout="null"
+        :required="true"
+        ref="image"
+        :form="form"
+      />
+      <a-form-item label="排序">
+        <a-input-number v-decorator="['sequence']" />
+      </a-form-item>
+    </a-form>
+    <div class="drawer-form-bottom-toolbar">
+      <a-button :style="{ marginRight: '8px' }" @click="close"> 取消 </a-button>
+      <a-button type="primary" @click="submit"> 保存 </a-button>
+    </div>
+  </a-drawer>
+</template>
+<script>
+import ImageUpload from '@/components/image-upload/ImageUpload'
+import { saveOrUpdateSubClass, getSubDetails } from '@/api/serv'
+
+export default {
+  name: 'SubClassEdit',
+  components: { ImageUpload },
+  props: { success: Function },
+  data() {
+    return {
+      form: this.$form.createForm(this),
+      visible: false,
+      id: null,
+      categoryId: null,
+      categoryName: ''
+    }
+  },
+  methods: {
+    show({ id, categoryId, categoryName }) {
+      this.id = id
+      this.categoryId = categoryId
+      this.categoryName = categoryName
+      this.visible = true
+      if (id) {
+        getSubDetails(this.id).then(({ data }) => {
+          this.form.setFieldsValue(data)
+          this.$refs.image.setValue([data.img])
+        })
+      }
+    },
+    close() {
+      this.id = null
+      this.categoryId = null
+      this.categoryName = ''
+      this.$refs.image.reset()
+      this.form.resetFields()
+      this.visible = false
+    },
+    submit() {
+      this.form.validateFields((err, values) => {
+        if (err) {
+          return
+        }
+        const reqData = {
+          ...values,
+          img: this.$refs.image.getValue()[0],
+          id: this.id,
+          categoryId: this.categoryId
+        }
+        saveOrUpdateSubClass(reqData).then(({ code }) => {
+          if (code == 200) {
+            this.$message.success('保存成功')
+            this.close()
+            this.success()
+          }
+        })
+      })
+    }
+  }
+}
+</script>
\ No newline at end of file