客户服务

2025-07-23 15:23:57 +08:00 · 2025-07-23 15:23:57 +08:00 · 187f10bdc0
commit 187f10bdc0
parent 34d50c58af
7 changed files with 287 additions and 41 deletions
--- a/apps/web-antd/src/api/property/customerService/centerConsole/index.ts
+++ b/apps/web-antd/src/api/property/customerService/centerConsole/index.ts
@ -0,0 +1,11 @@
+import { requestClient } from '#/api/request';
+
+/**
+* 查询客户服务工单看板统计
+* @param params
+* @returns
+*/
+export function countsList(params?:any) {
+  return requestClient.get('/property/customerServece/counts', { params });
+}
+
--- a/apps/web-antd/src/views/property/businessManagement/workOrderPending/data.ts
+++ b/apps/web-antd/src/views/property/businessManagement/workOrderPending/data.ts
@ -1,6 +1,7 @@
 import type {FormSchemaGetter} from '#/adapter/form';
 import type {VxeGridProps} from '#/adapter/vxe-table';
 import {renderDict} from "#/utils/render";
+import {getDictOptions} from "#/utils/dict";

 export const querySchema: FormSchemaGetter = () => [
  {
@ -62,4 +63,37 @@ export const columns: VxeGridProps['columns'] = [
  },
 ];

+export const ordersModalSchema: FormSchemaGetter = () => [
+  {
+    label: 'id',
+    fieldName: 'id',
+    component: 'Input',
+    dependencies: {
+      show: () => false,
+      triggerFields: [''],
+    },
+  },
+  {
+    label: '状态',
+    fieldName: 'status',
+    component: 'Select',
+    componentProps: {
+      options: getDictOptions('wy_gdclzt'),
+    },
+    rules: 'selectRequired',
+    disabled: true
+  },
+  {
+    label: '处理人',
+    fieldName: 'handler',
+    component: 'ApiSelect',
+    formItemClass: 'col-span-2',
+    rules: 'selectRequired',
+    dependencies: {
+      disabled: (formValue) =>formValue.status === '2' ,
+      triggerFields: ['status'],
+    },
+  },
+]
+

--- a/apps/web-antd/src/views/property/businessManagement/workOrderPending/orders-modal.vue
+++ b/apps/web-antd/src/views/property/businessManagement/workOrderPending/orders-modal.vue
@ -10,7 +10,7 @@ import {defaultFormValueGetter, useBeforeCloseDiff} from '#/utils/popup';
 import {ordersModalSchema} from './data';
 import {personList} from "#/api/property/resident/person";
 import {renderDictValue} from "#/utils/render";
-import {onMounted, ref} from "vue";
+import {ref} from "vue";
 import { useUserStore } from '@vben/stores';

 const userStore = useUserStore();
--- a/apps/web-antd/src/views/property/businessManagement/workOrderProcessed/data.ts
+++ b/apps/web-antd/src/views/property/businessManagement/workOrderProcessed/data.ts
@ -3,6 +3,7 @@ import type {VxeGridProps} from '#/adapter/vxe-table';
 import {renderDict} from "#/utils/render";
 import {h} from "vue";
 import {Rate} from "ant-design-vue";
+import {getDictOptions} from "#/utils/dict";

 export const querySchema: FormSchemaGetter = () => [
  {
@ -103,3 +104,36 @@ export const columns: VxeGridProps['columns'] = [
    width: 120,
  },
 ];
+
+export const ordersModalSchema: FormSchemaGetter = () => [
+  {
+    label: 'id',
+    fieldName: 'id',
+    component: 'Input',
+    dependencies: {
+      show: () => false,
+      triggerFields: [''],
+    },
+  },
+  {
+    label: '状态',
+    fieldName: 'status',
+    component: 'Select',
+    componentProps: {
+      options: getDictOptions('wy_gdclzt'),
+    },
+    rules: 'selectRequired',
+    disabled: true
+  },
+  {
+    label: '处理人',
+    fieldName: 'handler',
+    component: 'ApiSelect',
+    formItemClass: 'col-span-2',
+    rules: 'selectRequired',
+    dependencies: {
+      disabled: (formValue) =>formValue.status === '2' ,
+      triggerFields: ['status'],
+    },
+  },
+]
--- a/apps/web-antd/src/views/property/customerService/centerConsole/index.vue
+++ b/apps/web-antd/src/views/property/customerService/centerConsole/index.vue
@ -2,37 +2,158 @@
 import { EditOutlined } from '@ant-design/icons-vue';
 import {EchartsUI, type EchartsUIType, useEcharts} from "@vben/plugins/echarts";
 import {onMounted, ref} from "vue";
-import {statisticsByTime} from "#/api/property/reportStatistics";
+import {countsList} from '#/api/property/customerService/centerConsole'

-const orderLineRef = ref<EchartsUIType>();
-const { renderEcharts } = useEcharts(orderLineRef);
+const board = ref ({})
+const getBoard = async () => {
+  board.value = await countsList();
+}
 const xAxisData = ref<any[]>([]);
 const seriesData = ref<any[]>([]);
-async function fetchOrderTrend() {
-  const res = await statisticsByTime({ timeUnit: 1 });
-  xAxisData.value = res?.time ?? [];
-  seriesData.value = res?.counts ?? [];
-  renderEcharts({
-    title: { text: '客户续租率趋势' },
+
+// 工单计数
+const workOrderCount = ref<EchartsUIType>();
+const { renderEcharts: renderWorkOrderCount } = useEcharts(workOrderCount);
+async function fetchWorkOrderCount() {
+  xAxisData.value = board.value.recentWeekWorkOrders
+  console.log(xAxisData.value)
+  renderWorkOrderCount({
    tooltip: { trigger: 'axis' },
    xAxis: {
      type: 'category',
-      data: xAxisData.value,
      boundaryGap: false,
+      data: ['06-17周二', '06-17周二', '06-17周二', '06-17周二', '06-17周二', '06-17周二', '06-17周二']
+    },
+    yAxis: {
+      type: 'value',
+      name: '近一周工单数',
    },
-    yAxis: { type: 'value', axisLabel: { formatter: (value) => `${value * 100}%` } },
    series: [
      {
-        name: '订单趋势',
+        data: [6, 2, 0, 1, 0, 0, 1],
        type: 'line',
-        data: seriesData.value || [],
+        areaStyle: {},
        smooth: true,
-      },
-    ],
+      }
+    ]
  });
 }
+
+// 满意度指数
+const satisfactionLevel = ref<EchartsUIType>();
+const { renderEcharts: renderSatisfactionLevel } = useEcharts(satisfactionLevel);
+async function fetchSatisfactionLevel() {
+  renderSatisfactionLevel({
+    title: {text: '满意度指数',left: '18px'},
+    tooltip: { trigger: 'item'},
+    radar: {
+      indicator: [
+        {name: '1星', max: 1000},
+        {name: '2星', max: 1000},
+        {name: '3星', max: 1000},
+        {name: '4星', max: 1000},
+        {name: '5星', max: 1000},
+      ]
+    },
+    series: [
+      {
+        type: 'radar',
+        name: '满意度指数',
+        data: [
+          {
+            value: [500, 400, 800, 600, 400],
+          }
+        ]
+      }
+    ]
+  })
+}
+
+// 近半年工单数
+const orderNumber = ref<EchartsUIType>();
+const { renderEcharts: renderOrderNumber } = useEcharts(orderNumber);
+async function fetchOrderNumber() {
+  renderOrderNumber({
+    title: {text: '近半年工单数',left: '18px'},
+    legend: {},
+    tooltip: { trigger: 'axis' },
+    dataset: {
+      source: [
+        ['product', '物业', '入驻员工'],
+        ['2025-01', 2, 5.8],
+        ['2025-02', 10.1, 7.4],
+        ['2025-03', 6.4, 5.2],
+        ['2025-04', 3.3, 5.8],
+        ['2025-05', 8.1, 7.4],
+        ['2025-06', 6.4, 5.2],
+      ]
+    },
+    xAxis: { type: 'category' },
+    yAxis: {},
+    series: [{ type: 'bar' }, { type: 'bar' }]
+  })
+}
+
+// 工单类型分类占比
+const orderTyper = ref<EchartsUIType>();
+const { renderEcharts: renderOrderTyper } = useEcharts(orderTyper);
+async function fetchOrderTyper() {
+  renderOrderTyper({
+    title: {text: '工单类型分类占比',left: '18px',top: '18px'},
+    tooltip: {
+      trigger: 'item'
+    },
+    legend: {
+      top: '40%',
+      right: '10%',
+      orient: 'vertical',
+      icon: 'circle',
+      itemWidth: 8,
+      itemHeight: 8
+    },
+    series: [
+      {
+        type: 'pie',
+        center: ['40%', '55%'],
+        radius: ['40%', '70%'],
+        label: {
+          show: true,
+          position: 'center',
+          formatter: '员工单数量\n{num|56个}',
+          fontSize: 14,
+          fontWeight: 'bold',
+          color: 'gray',
+          rich: {
+            num: {
+              fontSize: 18,
+              fontWeight: 'bolder',
+              color:'black',
+              padding: [10, 0, 0, 0],
+            }
+          }
+        },
+        avoidLabelOverlap: false,
+        labelLine: {
+          show: false
+        },
+        data: [
+          { value: 1048, name: 'Search Engine' },
+          { value: 735, name: 'Direct' },
+          { value: 580, name: 'Email' },
+          { value: 484, name: 'Union Ads' },
+          { value: 300, name: 'Video Ads' }
+        ]
+      }
+    ]
+  })
+}
+
 onMounted(async () => {
-  await fetchOrderTrend();
+  await getBoard()
+  await fetchWorkOrderCount()
+  await fetchSatisfactionLevel()
+  await fetchOrderNumber()
+  await fetchOrderTyper()
 })
 </script>

@ -45,7 +166,7 @@ onMounted(async () => {
      <div>
        <div>
          <div>工单总数：</div>
-          <div>56</div>
+          <div>{{ board.workOrdersTotal }}</div>
          <div style="color: #1890FF">点击前往工单池</div>
        </div>
        <div class="icon-edit"><EditOutlined /></div>
@ -53,7 +174,7 @@ onMounted(async () => {
      <div>
        <div>
          <div>待派工单数：</div>
-          <div>56</div>
+          <div>{{ board.notWorkOrdersTotal }}</div>
          <div style="color: #1890FF">点击前往工单待办</div>
        </div>
        <div class="icon-edit"><EditOutlined /></div>
@ -61,24 +182,24 @@ onMounted(async () => {
      <div>
        <div>
          <div>未办结超时工单：</div>
-          <div>56</div>
-          <div>处理中的工单数：<span style="color: green">5</span></div>
+          <div>{{ board.novertimeOrdersTotal }}</div>
+          <div>处理中的工单数：<span style="color: green">{{ board.inHandOrdersTotal }}</span></div>
        </div>
        <div class="icon-edit"><EditOutlined /></div>
      </div>
      <div>
        <div>
          <div>当月工单超时率：</div>
-          <div>56</div>
-          <div>超时工单数：<span style="color: red">0</span></div>
+          <div>{{ board.novertimeOrdersRate }}%</div>
+          <div>超时工单数：<span style="color: red">{{ board.outTimeOrdersTotal }}</span></div>
        </div>
        <div class="icon-edit"><EditOutlined /></div>
      </div>
      <div>
        <div>
          <div>当月满意度：</div>
-          <div>100%</div>
-          <div>满意度：5</div>
+          <div>{{ board.monthoSatisfaction }}%</div>
+          <div>满意度：{{ board.satisfaction }}</div>
        </div>
        <div class="icon-edit"><EditOutlined /></div>
      </div>
@ -87,25 +208,48 @@ onMounted(async () => {
  <div class="chart">
    <div class="chart-one">
      <div>
+        <div>
+          <div style="font-size: 20px;font-weight: bold;margin-bottom: 20px;color: #464646">工单计数</div>
+          <div style="margin-left: 20px;line-height: 30px">
+            <div>累计处理工单数</div>
+            <div>12</div>
+            <div>累计回复数</div>
+            <div>2</div>
+          </div>
+        </div>
        <EchartsUI
-          ref="orderLineRef"
-          height="350px"
+          ref="workOrderCount"
+          height="400px"
          width="100%"
-          style="background: #fff; border-radius: 8px"
+          style="background: #fff; border-radius: 8px;padding-top: 30px"
+        />
+      </div>
+      <div>
+        <EchartsUI
+          ref="satisfactionLevel"
+          height="400px"
+          width="100%"
+          style="background: #fff; border-radius: 8px;padding-top: 18px"
        />
      </div>
-      <div style="background-color: red"></div>
    </div>
    <div class="chart-two">
      <div>
        <EchartsUI
-          ref="orderLineRef"
-          height="350px"
+          ref="orderNumber"
+          height="400px"
+          width="100%"
+          style="background: #fff; border-radius: 8px;padding-top: 18px"
+        />
+      </div>
+      <div>
+        <EchartsUI
+          ref="orderTyper"
+          height="400px"
          width="100%"
          style="background: #fff; border-radius: 8px"
        />
      </div>
-      <div style="background-color: red"></div>
    </div>
  </div>
 </div>
@ -158,6 +302,17 @@ onMounted(async () => {
      display: grid;
      grid-template-columns: 2fr 1fr;
      gap: 40px;
+
+      >div:first-child{
+        background-color: #FFFFFF;
+        border-radius: 8px;
+        display: grid;
+        grid-template-columns: 1fr 6fr;
+
+        >div:first-child{
+          padding: 18px 0 0 18px;
+        }
+      }
    }
    .chart-two{
      margin-top:40px;
--- a/apps/web-antd/src/views/property/customerService/contingenPlan/contingenPlan-detail.vue
+++ b/apps/web-antd/src/views/property/customerService/contingenPlan/contingenPlan-detail.vue
@ -2,7 +2,7 @@
 import type {ContingenPlanVO} from '#/api/property/customerService/contingenPlan/model';
 import {shallowRef} from 'vue';
 import {useVbenModal} from '@vben/common-ui';
-import {Descriptions, DescriptionsItem} from 'ant-design-vue';
+import {Descriptions, DescriptionsItem, Rate} from 'ant-design-vue';
 import {contingenPlanInfo} from '#/api/property/customerService/contingenPlan';
 import {renderDict} from "#/utils/render";

@ -29,29 +29,41 @@ async function handleOpenChange(open: boolean) {

 <template>
  <BasicModal :footer="false" :fullscreen-button="false" title="详情" class="w-[70%]">
-    <Descriptions v-if="contingenPlanIDetail" size="small" :column="2" bordered :labelStyle="{width:'100px'}">
+    <Descriptions v-if="contingenPlanIDetail" size="small" :column="2" bordered :labelStyle="{width:'120px'}">
      <DescriptionsItem label="预案名称">
        {{ contingenPlanIDetail.contingenPlanName }}
      </DescriptionsItem>
+      <DescriptionsItem label="创建时间">
+        {{ contingenPlanIDetail.createTime }}
+      </DescriptionsItem>
      <DescriptionsItem label="预案类型" v-if="contingenPlanIDetail.contingenPlanType!=null">
        <component
          :is="renderDict(contingenPlanIDetail.contingenPlanType,'type_contingency_plan')"
        />
      </DescriptionsItem>
-      <DescriptionsItem label="发起人">
-        {{ contingenPlanIDetail.initiat }}
+      <DescriptionsItem label="最后更新时间">
+        {{ contingenPlanIDetail.updateTime }}
      </DescriptionsItem>
      <DescriptionsItem label="演练状态" v-if="contingenPlanIDetail.status!=null">
        <component
          :is="renderDict(contingenPlanIDetail.status,'pro_exercise_status')"
        />
      </DescriptionsItem>
-      <DescriptionsItem label="责任人">
-        {{ contingenPlanIDetail.dutyPersion}}
-      </DescriptionsItem>
      <DescriptionsItem label="完成时间">
        {{ contingenPlanIDetail.compleTimes }}
      </DescriptionsItem>
+      <DescriptionsItem label="发起人">
+        {{ contingenPlanIDetail.initiatName }}
+      </DescriptionsItem>
+      <DescriptionsItem label="责任人">
+        {{ contingenPlanIDetail.dutyPersionName}}
+      </DescriptionsItem>
+      <DescriptionsItem label="预案内容" :span="2">
+        <div v-html="contingenPlanIDetail.contingenPlanContent"></div>
+      </DescriptionsItem>
+      <DescriptionsItem label="风险等级">
+        <Rate :value="contingenPlanIDetail.grade" disabled />
+      </DescriptionsItem>
    </Descriptions>
  </BasicModal>
 </template>
--- a/apps/web-antd/src/views/property/customerService/contingenPlan/data.ts
+++ b/apps/web-antd/src/views/property/customerService/contingenPlan/data.ts
@ -68,7 +68,7 @@ export const columns: VxeGridProps['columns'] = [
  },
  {
    title: '发起人',
-    field: 'initiat',
+    field: 'initiatName',
  },
  {
    title: '演练状态',
@ -81,7 +81,7 @@ export const columns: VxeGridProps['columns'] = [
  },
  {
    title: '责任人',
-    field: 'dutyPersion',
+    field: 'dutyPersionName',
  },
  {
    title: '完成时间',