update

src/pages/merchant/pages/communication-center/index.vue

@@ -1,9 +1,154 @@
 <script setup>
+import Filter from "../../../../components/Filter/index.vue";
+import {reactive, computed} from "vue";
+import useTableQuery from "../../../../hooks/useTableQuery.js";
+import Api from "../../../../api/index.js";
 
+const columns = [
+    {
+        title: '任务编号',
+        dataIndex: 'name',
+    },
+    {
+        title: '任务名称',
+        dataIndex: 'name',
+    },
+    {
+        title: '子任务编号',
+        dataIndex: 'name',
+    },
+    {
+        title: '领取时间',
+        dataIndex: 'name',
+        align: 'center',
+    },
+    {
+        title: '沟通进度',
+        dataIndex: 'gtjd',
+        slotName: 'gtjd',
+        align: 'center',
+    },
+    {
+        title: '达人账号',
+        dataIndex: 'name',
+        align: 'center',
+    },
+    {
+        title: '回填数据',
+        dataIndex: 'htsj',
+        slotName: 'htsj',
+        align: 'center',
+    },
+    {
+        title: '达人反馈',
+        dataIndex: 'drfk',
+        slotName: 'drfk',
+        align: 'center',
+    },
+    {
+        title: '支付状态',
+        dataIndex: 'zfzt',
+        slotName: 'zfzt',
+        align: 'center',
+    },
+];
+const FilterConfig = computed(() => [
+    {
+        key: 'wd',
+        type: 'input',
+        label: '任务名称',
+        placeholder: '请输入任务名称'
+    },
+    {
+        key: 'wd',
+        type: 'select',
+        label: '支付状态',
+        placeholder: '请选择支付状态'
+    },
+    {   // 占位
+        key: 'wd',
+        type: 'custom',
+        label: '',
+    },
+    {
+        key: 'wd',
+        type: 'input',
+        label: '任务编号',
+        placeholder: '请输入任务编号'
+    },
+    {
+        key: 'wd',
+        type: 'input',
+        label: '子任务编号',
+        placeholder: '请输入子任务编号'
+    },
+    {
+        key: 'wd',
+        type: 'input',
+        label: '达人账号',
+        placeholder: '请输入达人账号'
+    },
+]);
+const po = reactive({
+    wd: null,
+});
+const vo = reactive({
+    page: '',
+    rows: [],
+    total: 0,
+});
+const {loading, pagination, initFetchData} = useTableQuery({
+    parameter: po,
+    api: Api.system.getData,
+    callback: (data) => {
+        Object.assign(vo, data);
+        console.log(vo);
+    }
+});
 </script>
 
 <template>
     <!-- 沟通中心 -->
+    <div id="Item-View" class="p-[20px] h-full">
+        <a-card>
+            <Filter v-model:from="po" :config="FilterConfig" @search="initFetchData"></Filter>
+
+            <div class="py-[20px]">
+                <a-tabs type="rounded">
+                    <a-tab-pane title="待回复" :key="1">
+                    </a-tab-pane>
+                    <a-tab-pane title="已完成" :key="2">
+                    </a-tab-pane>
+                </a-tabs>
+
+                <a-table
+                    @page-change="(e) => pagination.current = e"
+                    :pagination="pagination"
+                    :loading="loading"
+                    :columns="columns"
+                    :data="vo.rows">
+                    <template v-slot:gtjd>
+                        <div class="flex items-center gap-[8px] justify-center">
+                            <div class="bg-[#165DFF] w-[6px] aspect-square rounded-[50%]"></div>
+                            待回复
+                        </div>
+                    </template>
+                    <template v-slot:htsj>
+                        <a-link :hoverable="false">查看回填</a-link>
+                    </template>
+                    <template v-slot:drfk>
+                        <a-badge :count="9" dot :dotStyle="{ width: '10px', height: '10px' }">
+                            <a-link :hoverable="false">沟通记录</a-link>
+                        </a-badge>
+                    </template>
+                    <template v-slot:zfzt="{rowIndex}">
+                        <a-link v-if="rowIndex%2===0" :hoverable="false" status="success">确认结算</a-link>
+                        <a-link v-else :hoverable="false" status="success" disabled>已结算</a-link>
+                    </template>
+                </a-table>
+            </div>
+        </a-card>
+    </div>
 </template>
 
 <style scoped>

src/pages/merchant/pages/task-center/index.vue

@@ -4,7 +4,7 @@
 
 <template>
     <!-- 任务中心 -->
-    <div id="Item-View" class="p-[20px]">
+    <div id="Item-View" class="p-[20px] h-full">
         <a-card>
             <router-view></router-view>
         </a-card>

src/pages/merchant/pages/task-center/reward-mission.vue

@@ -136,7 +136,7 @@ const {loading, pagination, initFetchData} = useTableQuery({
     <!-- 悬赏任务 -->
     <Filter v-model:from="po" :config="FilterConfig" @search="initFetchData"></Filter>
 
-    <div class="my-[20px]">
+    <div class="my-[20px] flex-grow flex flex-col">
         <div class="flex gap-[16px] mb-[20px]">
             <a-button type="primary">
                 <template #icon>
@@ -153,9 +153,11 @@ const {loading, pagination, initFetchData} = useTableQuery({
         </div>
 
         <a-table
+            class="flex-grow"
             :columns="columns"
             :data="vo.rows"
             :loading="loading"
+            @page-change="(e) => pagination.current = e"
             :pagination="pagination">
             <template v-slot:status="{record}">
                 <TooltipTag v-if="record.status === 0" color="cyan">待完善</TooltipTag>