修改客户资料

src/goServiceAPI/commonService/index.ts

@@ -102,6 +102,7 @@ export function QueryTableDefine(): Promise<type.TableDefineRsp[]> {
     return commonSearch_go('/Common/QueryTableDefine', param)
         .then((res) => {
             console.log('查询交易端列表头信息', res);
+            APP.set('tableHead', res)
             return res;
         })
         .catch((err: Error) => {

src/services/bus/table.ts

@@ -0,0 +1,15 @@
+import { Column, TableDefineRsp } from '@/goServiceAPI/commonService/interface';
+import APP from '@/services';
+
+interface TableKey {
+    table_pcweb_delivery: string; // 现货合同
+    table_pcweb_userinfo: string; // 客户资料
+}
+
+/**
+ * 获取动态表头
+ */
+export function getTableHead(tableKey: keyof TableKey): Column[] {
+    const result = APP.get('tableHead').find((e: TableDefineRsp) => e.tablekey === tableKey);
+    return result ? result.columns : []
+}

src/views/information/custom/compoments/filterTable/index.vue

@@ -25,7 +25,7 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, ref } from 'vue';
+import { defineComponent, ref, SetupContext } from 'vue';
 
 // 处理 客户类型
 function handleUserInfoType() {
@@ -41,16 +41,22 @@ function handleUserInfoType() {
 }
 
 // 搜索
-function handleSearch() {
+function handleSearch(context: SetupContext) {
     const nickname = ref<string>('');
     const name = ref<string>('');
     const phone = ref<string>('');
-    function search() {}
+
+    function search() {
+        const result = { nickname: [nickname.value], name: [name.value], mobile: [phone.value] };
+        context.emit('search', result);
+    }
     function reset() {
         nickname.value = '';
         name.value = '';
         phone.value = '';
+        search();
     }
+
     return { nickname, name, phone, search, reset };
 }
 
@@ -63,7 +69,7 @@ export default defineComponent({
         }
         return {
             ...handleUserInfoType(),
-            ...handleSearch(),
+            ...handleSearch(context),
             add,
         };
     },

src/views/information/custom/list/normal-use/index.vue

@@ -1,93 +1,123 @@
 <template>
   <!-- 客户信息: 正常 -->
   <div class="custom-normal">
-    <filterCustomTable @add="add" />
-    <!-- <a-table :columns="columns"
-             :data-source="data"
-             @change="handleChange" /> -->
+    <filterCustomTable @add="add"
+                       @search="search" />
+    <a-table :columns="columns"
+             :pagination="false"
+             rowKey="key"
+             :data-source="customList" />
   </div>
 </template>
 
 <script lang="ts">
 import { computed, defineComponent, ref } from 'vue';
-import { QueryTableDefine } from '@/goServiceAPI/commonService/index';
 
 import { initData } from '@/setup/methods/index';
 import { QueryCustomInfo } from '@/goServiceAPI/ermcp/customInfo/index';
 import { QueryCustomInfoType } from '@/goServiceAPI/ermcp/customInfo/interface';
 import filterCustomTable from '@/views/information/custom/compoments/filterTable/index.vue';
+import { getTableHead } from '@/services/bus/table';
+import { TableState, TableStateFilters } from 'ant-design-vue/es/table/interface';
 import { message } from 'ant-design-vue';
 
 // 查询客户资料列表
 function getCustomList() {
-    const filteredInfo = ref();
-    const sortedInfo = ref();
-    const columns = computed(() => {
-        // const filtered = filteredInfo.value || {};
-        // const sorted = sortedInfo.value || {};
-        // return [
-        //     {
-        //         title: '序号',
-        //         dataIndex: 'index',
-        //         key: 'index',
-        //         align: 'center',
-        //         width: 50,
-        //         customRender: (param: any) => `${param.index + 1}`,
-        //     },
-        //     {
-        //         title: 'Age',
-        //         dataIndex: 'age',
-        //         key: 'age',
-        //         sorter: (a: DataItem, b: DataItem) => a.age - b.age,
-        //         sortOrder: sorted.columnKey === 'age' && sorted.order,
-        //     },
-        //     {
-        //         title: 'Address',
-        //         dataIndex: 'address',
-        //         key: 'address',
-        //         filters: [
-        //             { text: 'London', value: 'London' },
-        //             { text: 'New York', value: 'New York' },
-        //         ],
-        //         filteredValue: filtered.address || null,
-        //         onFilter: (value: string, record: DataItem) => record.address.includes(value),
-        //         sorter: (a: DataItem, b: DataItem) => a.address.length - b.address.length,
-        //         sortOrder: sorted.columnKey === 'address' && sorted.order,
-        //         ellipsis: true,
-        //     },
-        // ];
-    });
+    interface ColumnType {
+        key: string;
+        dataIndex: string;
+        title: string;
+        onFilter?: Function;
+        sorter?: Function;
+    }
+
     const customList = ref<QueryCustomInfoType[]>([]);
+    const columns = ref<ColumnType[]>([]);
+    const filteredInfo = ref();
+    // 获取表头
+    function getColumns() {
+        interface ColumnType {
+            key: string;
+            dataIndex: string;
+            title: string;
+            filteredValue?: string | null;
+            onFilter?: Function;
+            sorter?: Function;
+        }
+        const list = getTableHead('table_pcweb_userinfo');
+        console.log('list', list);
+
+        const filtered = filteredInfo.value || {};
+        columns.value.length = 0;
+        list.forEach((e, i) => {
+            const { columnfield, columntitle } = e;
+            const item: ColumnType = {
+                key: String(i),
+                dataIndex: columnfield,
+                title: columntitle,
+            };
+            if (e.columntitle === '客户类型') {
+                item.onFilter = (value: string, record: QueryCustomInfoType) => record.userinfotype === value;
+                item.filteredValue = filtered.userinfotype || null;
+            }
+            if (e.columntitle === '客户简称') {
+                item.onFilter = (value: string, record: QueryCustomInfoType) => record.nickname.includes(value);
+                item.filteredValue = filtered.nickname || null;
+            }
+            if (e.columntitle === '客户名称') {
+                // 注意：这里绑定值 待确认
+                item.onFilter = (value: string, record: QueryCustomInfoType) => {
+                    // 用户信息类型 - 1:个人 2:企业
+                    const name = String(record.userinfotype) === '1' ? record.contactname : record.customername;
+                    name.includes(value);
+                    item.filteredValue = filtered.contactname || null;
+                };
+            }
+            if (e.columntitle === '手机号码') {
+                item.onFilter = (value: string, record: QueryCustomInfoType) => record.mobile.includes(value);
+                item.filteredValue = filtered.mobile || null;
+            }
+            columns.value.push(item);
+        });
+        console.log('columns', columns);
+    }
+    // 查询列表
     function actionQuery() {
         QueryCustomInfo(3)
             .then((res) => {
-                console.log('L', res);
+                customList.value = res.map((e, i) => {
+                    return { ...e, key: String(i) };
+                });
+                console.log('查询列表', customList);
             })
             .catch((err) => message.error(err));
     }
-
-    return { customList, actionQuery };
+    // 查询
+    function search(value: any) {
+        filteredInfo.value = value;
+        getColumns();
+        console.log('search', value);
+    }
+    return { customList, actionQuery, columns, filteredInfo, getColumns, search };
 }
 
 function add() {
     console.log('add');
 }
+
 export default defineComponent({
     name: 'custom-normal',
     components: {
         filterCustomTable,
     },
     setup() {
-        const { customList, actionQuery } = getCustomList();
-
+        const { customList, actionQuery, columns, getColumns, search } = getCustomList();
         initData(() => {
             actionQuery();
-            QueryTableDefine().then((res) => {
-                console.log('QueryTableDefine', res[0]);
-            });
+            getColumns();
             // 加载数据在这里
         });
-        return { customList, add };
+        return { customList, add, columns, search };
     },
 });
 </script>