fix: 客户管理mock数据

src/views/customer-manage/customer-management/index.vue

@@ -1,218 +1,215 @@
 <template>
-    <div class="customer-management">
-        <a-tabs v-model:activeKey="activeKey" class="tabs">
-            <a-tab-pane v-for="(item, index) in tabsOptions" :key="index">
-                <template #tab>
-                    <span @click="item.onClick(item.params)">
-                        <component :is="item.icon"></component>
-                        {{ item.title }}
-                    </span>
-                </template>
-            </a-tab-pane>
-        </a-tabs>
-        <bs-table v-bind="tableOptions">
-            <template #searchRight>
-                <div>
-                    <a-button type="primary" @click="openCuleDrawer">
-                        <span>服务商入库登记</span>
-                    </a-button>
-                </div>
-            </template>
-        </bs-table>
-    </div>
+  <div class="customer-management">
+    <a-tabs v-model:activeKey="activeKey" class="tabs">
+      <a-tab-pane v-for="(item, index) in tabsOptions" :key="index">
+        <template #tab>
+          <span @click="item.onClick(item.params)">
+            <component :is="item.icon"></component>
+            {{ item.title }}
+          </span>
+        </template>
+      </a-tab-pane>
+    </a-tabs>
+    <bs-table v-bind="tableOptions">
+      <template #searchRight>
+        <div>
+          <a-button type="primary" @click="openCuleDrawer">
+            <span>服务商入库登记</span>
+          </a-button>
+        </div>
+      </template>
+    </bs-table>
+  </div>
 </template>
 <script setup lang="jsx">
-import { ref, reactive } from "vue"
-import BsTable, { useBsTable } from '/@/components/BsUi/Table/index.js';
-import { DISPLAY_STATE } from '/@/components/BsUi/constant.js';
-const activeKey = ref(0)
-const tabsOptions = [
+  import { ref, reactive } from 'vue';
+  import BsTable, { useBsTable } from '/@/components/BsUi/Table/index.js';
+  import { DISPLAY_STATE } from '/@/components/BsUi/constant.js';
+  import { useRouter } from 'vue-router';
+
+  const router = useRouter();
+
+  const activeKey = ref(0);
+  const tabsOptions = [
     {
-        title: '全部',
-        icon: 'AppstoreOutlined',
-        params: {
-            a: 1
-        },
-        onClick: (value) => {
-            console.log(value);
-        },
+      title: '全部',
+      icon: 'AppstoreOutlined',
+      params: {
+        a: 1,
+      },
+      onClick: (value) => {
+        console.log(value);
+      },
     },
     {
-        title: '客户列表',
-        icon: 'TeamOutlined',
-        params: {
-
-        },
-        onClick: (value) => {
-
-        },
+      title: '客户列表',
+      icon: 'TeamOutlined',
+      params: {},
+      onClick: (value) => {},
     },
     {
-        title: '审核中',
-        icon: 'FileSyncOutlined',
-        params: {
-
-        },
-        onClick: (value) => {
-
-        },
+      title: '审核中',
+      icon: 'FileSyncOutlined',
+      params: {},
+      onClick: (value) => {},
     },
     {
-        title: '无效客户',
-        icon: 'UserDeleteOutlined',
-        params: {
-
-        },
-        onClick: (value) => {
-
-        },
+      title: '无效客户',
+      icon: 'UserDeleteOutlined',
+      params: {},
+      onClick: (value) => {},
     },
-]
-const {
+  ];
+  const {
     tableOptions,
     setTablePropsValue: setValue,
     getTablePropsValue: getValue,
-} = useBsTable({
+  } = useBsTable({
     tableOptions: {
-        url:'',
-        gridOptions: {
-            loading: false,
-            columns: [
-                {
-                    type: 'seq',
-                    width: 80,
-                },
-                {
-                    field: 'id',
-                    title: '状态',
-                },
-                {
-                    field: 'id',
-                    title: '流水号',
-                },
-                {
-                    field: 'id',
-                    title: '来源',
-                },
-                {
-                    field: 'name',
-                    title: '服务商名称',
-                },
-                {
-                    field: 'name1',
-                    title: '服务商ID',
-                },
-                {
-                    field: 'name2',
-                    title: '服务商地区',
-                },
-                {
-                    field: 'name',
-                    title: '服务商地址',
-                },
-                {
-                    field: 'name',
-                    title: '服务商类型',
-                },
-                {
-                    field: 'name',
-                    title: '联系人',
-                },
-                {
-                    field: 'name',
-                    title: '联系电话',
-                },
-                {
-                    field: 'name',
-                    title: '注册时间',
-                },
-                {
-                    // fixed: 'right',
-                    cellRender: {
-                        name: 'CellOption',
-                        extraProps: {
-                            buttons: [
-                                {
-                                    title: '查看详情',
-                                    code: 'view',
-                                    display: ({ row }) => {
-                                        return DISPLAY_STATE.VISIBLE;
-                                    },
-                                    disabled({ row }) {
-                                        return false;
-                                    },
-                                    onClick({ row }) { },
-                                    extraProps: {},
-                                },
-                            ],
-                        },
-                    },
-                },
-            ],
+      url: '',
+      data: [
+        {
+          sequenceNo: 'mock123',
+          state: 'mock123',
+          sourceName: 'mock123',
+          deptName: 'mock123',
         },
-        searchConfig: {
-            enabled: true,
-            fieldSpan: 4,
-            fields: [
-                {
-                    field: 'name',
-                    label: '客户名称',
-                    component: 'a-input',
-                    componentProps: {
-                        placeholder: '请输入客户名称',
+      ],
+      gridOptions: {
+        loading: false,
+        columns: [
+          {
+            type: 'seq',
+            width: 80,
+          },
+          {
+            field: 'state',
+            title: '状态',
+          },
+          {
+            field: 'sequenceNo',
+            title: '流水号',
+          },
+          {
+            field: 'sourceName',
+            title: '来源',
+          },
+          {
+            field: 'deptName',
+            title: '服务商名称',
+          },
+          {
+            field: 'name1',
+            title: '服务商ID',
+          },
+          {
+            field: 'name2',
+            title: '服务商地区',
+          },
+          {
+            field: 'name',
+            title: '服务商地址',
+          },
+          {
+            field: 'name',
+            title: '服务商类型',
+          },
+          {
+            field: 'name',
+            title: '联系人',
+          },
+          {
+            field: 'name',
+            title: '联系电话',
+          },
+          {
+            field: 'name',
+            title: '注册时间',
+          },
+          {
+            // fixed: 'right',
+            cellRender: {
+              name: 'CellOption',
+              extraProps: {
+                buttons: [
+                  {
+                    title: '查看详情',
+                    code: 'view',
+                    display: ({ row }) => {
+                      return DISPLAY_STATE.VISIBLE;
                     },
-                },
-                {
-                    field: 'name',
-                    label: '客户地址',
-                    component: 'a-input',
-                    componentProps: {
-                        placeholder: '请输入客户地址',
+                    disabled({ row }) {
+                      return false;
                     },
-                },
-                {
-                    field: 'name',
-                    label: '客户类型',
-                    component: 'a-select',
-                    componentProps: {
-                        placeholder: '请输入客户类型',
+                    onClick({ row }) {
+                      router.push({path: "/customer-manage/customer-detail"});
                     },
-                },
-            ],
-            onSearch() {
-                fetchTableData();
+                    extraProps: {},
+                  },
+                ],
+              },
             },
-            onReset() {
-                fetchTableData();
+          },
+        ],
+      },
+      searchConfig: {
+        enabled: true,
+        fieldSpan: 4,
+        fields: [
+          {
+            field: 'name',
+            label: '客户名称',
+            component: 'a-input',
+            componentProps: {
+              placeholder: '请输入客户名称',
             },
-        },
-        pagerConfig: {
-            enabled: true,
-            pageSize: 10,
-            pageNum: 1,
-            total: 0,
-            isFixed:false
-        },
-        toolbarConfig: {
-            onRefresh() {
-                fetchTableData();
+          },
+          {
+            field: 'name',
+            label: '客户地址',
+            component: 'a-input',
+            componentProps: {
+              placeholder: '请输入客户地址',
+            },
+          },
+          {
+            field: 'name',
+            label: '客户类型',
+            component: 'a-select',
+            componentProps: {
+              placeholder: '请输入客户类型',
             },
+          },
+        ],
+        onSearch() {
+          fetchTableData();
         },
+        onReset() {
+          fetchTableData();
+        },
+      },
+      pagerConfig: {
+        enabled: true,
+        pageSize: 10,
+        pageNum: 1,
+        total: 0,
+        isFixed: false,
+      },
+      toolbarConfig: {},
     },
-});
-
+  });
 </script>
 <style lang="scss" scoped>
-.customer-management {
+  .customer-management {
     background-color: #fff;
     height: 100%;
 
     .tabs {
-        padding: 0 24px;
+      padding: 0 24px;
 
-        :deep(.anticon) {
-            margin: 0;
-        }
+      :deep(.anticon) {
+        margin: 0;
+      }
     }
-}
+  }
 </style>