Parcourir la source

reactor:关于省件在本地系统的各项功能;

zhangchong il y a 9 mois
Parent
commit
e561a18d00
1 fichiers modifiés avec 214 ajouts et 208 suppressions
  1. 214 208
      src/views/business/visit/index.vue

+ 214 - 208
src/views/business/visit/index.vue

@@ -1,107 +1,114 @@
 <template>
-	<div class="business-visit-container layout-pd">
-		<!-- 搜索  -->
-		<el-card shadow="never">
-			<el-form :model="state.queryParams" ref="ruleFormRef" @submit.native.prevent>
-				<el-row :gutter="20">
-					<el-col :xs="24" :sm="12" :md="12" :lg="6" :xl="6">
-						<el-form-item label="工单标题" prop="Keyword">
-							<el-input v-model="state.queryParams.Keyword" placeholder="工单标题" clearable @keyup.enter="handleQuery" />
-						</el-form-item>
-					</el-col>
-					<el-col :xs="24" :sm="12" :md="12" :lg="6" :xl="6">
-						<el-form-item label="工单编码" prop="No">
-							<el-input v-model="state.queryParams.No" placeholder="工单编码" clearable @keyup.enter="handleQuery" />
-						</el-form-item>
-					</el-col>
-					<el-col :xs="24" :sm="12" :md="12" :lg="6" :xl="6">
-						<el-form-item label="归档类型" prop="FiledType">
-							<el-select v-model="state.queryParams.FiledType" placeholder="请选择归档类型" @change="handleQuery" class="w100">
-								<el-option label="中心归档" value="10" />
-								<el-option label="部门归档" value="20" />
-							</el-select>
-						</el-form-item>
-					</el-col>
+  <div class="business-visit-container layout-pd">
+    <el-card shadow="never">
+      <div class="flex-center-align mb20">
+        <span class="fast-search-label">工单类型</span>
+        <el-radio-group v-model="state.queryParams.IsProvince" @change="handleQuery">
+          <el-radio-button label="">我的</el-radio-button>
+          <el-radio-button label="false">市工单</el-radio-button>
+          <el-radio-button label="true">省工单</el-radio-button>
+        </el-radio-group>
+      </div>
+      <el-form :model="state.queryParams" ref="ruleFormRef" @submit.native.prevent label-width="100px">
+        <el-row :gutter="20">
+          <el-col :xs="24" :sm="12" :md="12" :lg="6" :xl="6">
+            <el-form-item label="工单标题" prop="Keyword">
+              <el-input v-model="state.queryParams.Keyword" placeholder="工单标题" clearable @keyup.enter="handleQuery" />
+            </el-form-item>
+          </el-col>
+          <el-col :xs="24" :sm="12" :md="12" :lg="6" :xl="6">
+            <el-form-item label="工单编码" prop="No">
+              <el-input v-model="state.queryParams.No" placeholder="工单编码" clearable @keyup.enter="handleQuery" />
+            </el-form-item>
+          </el-col>
+          <el-col :xs="24" :sm="12" :md="12" :lg="6" :xl="6">
+            <el-form-item label="归档类型" prop="FiledType">
+              <el-select v-model="state.queryParams.FiledType" placeholder="请选择归档类型" @change="handleQuery" class="w100">
+                <el-option label="中心归档" value="10" />
+                <el-option label="部门归档" value="20" />
+              </el-select>
+            </el-form-item>
+          </el-col>
           <transition name="el-zoom-in-top">
-					<el-col :xs="24" :sm="12" :md="12" :lg="6" :xl="6" v-show="!searchCol">
-						<el-form-item label="是否会签" prop="IsCountersign">
-							<el-select v-model="state.queryParams.IsCountersign" placeholder="请选择是否会签" @change="handleQuery" class="w100">
-								<el-option label="是" value="true" />
-								<el-option label="否" value="false" />
-							</el-select>
-						</el-form-item>
-					</el-col>
+            <el-col :xs="24" :sm="12" :md="12" :lg="6" :xl="6" v-show="!searchCol">
+              <el-form-item label="是否会签" prop="IsCountersign">
+                <el-select v-model="state.queryParams.IsCountersign" placeholder="请选择是否会签" @change="handleQuery" class="w100">
+                  <el-option label="是" value="true" />
+                  <el-option label="否" value="false" />
+                </el-select>
+              </el-form-item>
+            </el-col>
           </transition>
-					<transition name="el-zoom-in-top">
-						<el-col :xs="24" :sm="12" :md="12" :lg="6" :xl="6" v-show="!searchCol">
-							<el-form-item label="回访状态" prop="VisitState">
-								<el-select v-model="state.queryParams.VisitState" placeholder="请选择回访状态" @change="handleQuery" class="w100">
-									<el-option v-for="item in state.visitStateOptions" :value="item.value" :key="item.value" :label="item.label" />
-								</el-select>
-							</el-form-item>
-						</el-col>
-					</transition>
-					<transition name="el-zoom-in-top">
-						<el-col :xs="24" :sm="12" :md="12" :lg="6" :xl="6" v-show="!searchCol">
-							<el-form-item label="回访方式" prop="VisitType">
-								<el-select v-model="state.queryParams.VisitType" placeholder="请选择回访方式" @change="handleQuery" class="w100">
-									<el-option v-for="item in state.visitTypeOptions" :value="item.key" :key="item.key" :label="item.value" />
-								</el-select>
-							</el-form-item>
-						</el-col>
-					</transition>
-					<el-col :xs="24" :sm="12" :md="12" :lg="6" :xl="6">
-						<el-form-item label="">
-							<div class="flex-end w100">
-								<el-button type="primary" @click="handleQuery" :loading="state.loading"> <SvgIcon name="ele-Search" class="mr5" />查询 </el-button>
-								<el-button @click="resetQuery(ruleFormRef)" class="default-button" :loading="state.loading">
-									<SvgIcon name="ele-Refresh" class="mr5" />重置
-								</el-button>
-								<el-button link type="primary" @click="closeSearch" :loading="state.loading">
-									{{ searchCol ? '展开' : '收起' }}
-									<SvgIcon :class="{ 'is-reverse': searchCol }" name="ele-ArrowUp" class="mr5 arrow" size="18px" />
-								</el-button>
-							</div>
-						</el-form-item>
-					</el-col>
-				</el-row>
-			</el-form>
-		</el-card>
-		<el-card shadow="never">
-			<ProTable
-				ref="proTableRef"
-				:columns="columns"
-				:data="state.tableData"
-				@updateTable="queryList"
-				:loading="state.loading"
-				:total="state.total"
-				v-model:page-index="state.queryParams.PageIndex"
-				v-model:page-size="state.queryParams.PageSize"
-				@exportCurrent="exportCurrent"
-			>
-				<template #title="{ row }">
-					<order-detail :order="row.order" @updateList="queryList">{{ row.order?.title }}</order-detail>
-				</template>
-				<template #voicePj="{ row }">
+          <transition name="el-zoom-in-top">
+            <el-col :xs="24" :sm="12" :md="12" :lg="6" :xl="6" v-show="!searchCol">
+              <el-form-item label="回访状态" prop="VisitState">
+                <el-select v-model="state.queryParams.VisitState" placeholder="请选择回访状态" @change="handleQuery" class="w100">
+                  <el-option v-for="item in state.visitStateOptions" :value="item.value" :key="item.value" :label="item.label" />
+                </el-select>
+              </el-form-item>
+            </el-col>
+          </transition>
+          <transition name="el-zoom-in-top">
+            <el-col :xs="24" :sm="12" :md="12" :lg="6" :xl="6" v-show="!searchCol">
+              <el-form-item label="回访方式" prop="VisitType">
+                <el-select v-model="state.queryParams.VisitType" placeholder="请选择回访方式" @change="handleQuery" class="w100">
+                  <el-option v-for="item in state.visitTypeOptions" :value="item.key" :key="item.key" :label="item.value" />
+                </el-select>
+              </el-form-item>
+            </el-col>
+          </transition>
+          <el-col :xs="24" :sm="12" :md="12" :lg="6" :xl="6">
+            <el-form-item label="">
+              <div class="flex-end w100">
+                <el-button type="primary" @click="handleQuery" :loading="state.loading"> <SvgIcon name="ele-Search" class="mr5" />查询 </el-button>
+                <el-button @click="resetQuery(ruleFormRef)" class="default-button" :loading="state.loading">
+                  <SvgIcon name="ele-Refresh" class="mr5" />重置
+                </el-button>
+                <el-button link type="primary" @click="closeSearch" :loading="state.loading">
+                  {{ searchCol ? '展开' : '收起' }}
+                  <SvgIcon :class="{ 'is-reverse': searchCol }" name="ele-ArrowUp" class="mr5 arrow" size="18px" />
+                </el-button>
+              </div>
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </el-form>
+    </el-card>
+    <el-card shadow="never">
+      <ProTable
+          ref="proTableRef"
+          :columns="columns"
+          :data="state.tableData"
+          @updateTable="queryList"
+          :loading="state.loading"
+          :total="state.total"
+          v-model:page-index="state.queryParams.PageIndex"
+          v-model:page-size="state.queryParams.PageSize"
+          @exportCurrent="exportCurrent"
+      >
+        <template #title="{ row }">
+          <order-detail :order="row.order" @updateList="queryList">{{ row.order?.title }}</order-detail>
+        </template>
+        <template #voicePj="{ row }">
 					<span v-for="item in row.orderVisitDetails">
 						<span v-if="item.visitTarget === 10">{{ item.voiceEvaluateText }}</span>
 					</span>
-				</template>
-				<template #hwyPj="{ row }">
+        </template>
+        <template #hwyPj="{ row }">
 					<span v-for="item in row.orderVisitDetails">
 						<span v-if="item.visitTarget === 10">{{ item.seatEvaluateText }}</span>
 					</span>
-				</template>
-				<!-- 表格操作 -->
-				<template #operation="{ row }">
-					<el-button link type="primary" @click="visitDetail(row)" title="查看回访详情"> 回访详情 </el-button>
-					<order-detail :order="row.order" @updateList="queryList" />
-				</template>
-			</ProTable>
-		</el-card>
-		<!-- 回访详情 -->
-		<visit-detail-com ref="visitDetailRef" @updateList="queryList" />
-	</div>
+        </template>
+        <!-- 表格操作 -->
+        <template #operation="{ row }">
+          <el-button link type="primary" @click="visitDetail(row)" title="查看回访详情"> 回访详情 </el-button>
+          <order-detail :order="row.order" @updateList="queryList" />
+        </template>
+      </ProTable>
+    </el-card>
+    <!-- 回访详情 -->
+    <visit-detail-com ref="visitDetailRef" @updateList="queryList" />
+  </div>
 </template>
 
 <script setup lang="tsx" name="businessVisit">
@@ -122,149 +129,148 @@ const proTableRef = ref<RefType>(); // 表格ref
 const searchCol = ref(true); // 展开/收起
 // 展开/收起
 const closeSearch = () => {
-	searchCol.value = !searchCol.value;
+  searchCol.value = !searchCol.value;
 };
 // 表格配置项
 const columns = ref<any[]>([
-	{ prop: 'order.no', label: '工单编码', width: 150, fixed: 'left' },
-	{ prop: 'order.isProvinceText', label: '省/市工单', width: 100 },
-	{ prop: 'order.title', label: '工单标题', width: 300 },
-	{ prop: 'order.sourceChannel', label: '来源方式', width: 100 },
-	{ prop: 'visitStateText', label: '回访状态', width: 100 },
-	{ prop: 'visitTypeText', label: '回访方式', width: 100 },
-	{ prop: 'order.acceptType', label: '受理类型', width: 150 },
-	{ prop: 'order.hotspotName', label: '热点分类', width: 200 },
-	{ prop: 'order.acceptorName', label: '受理人', width: 170 },
-	{ prop: 'order.orgLevelOneName', label: '一级部门', width: 150 },
-	{ prop: 'order.actualHandleOrgName', label: '接办部门', width: 120 },
-	{
-		prop: 'order.startTime',
-		label: '受理时间',
-		width: 170,
-		render: (scope) => {
-			return <span>{formatDate(scope.row.order?.startTime, 'YYYY-mm-dd HH:MM:SS')}</span>;
-		},
-	},
-	{
-		prop: 'order.filedTime',
-		label: '办结时间',
-		width: 170,
-		render: (scope) => {
-			return <span>{formatDate(scope.row.order?.filedTime, 'YYYY-mm-dd HH:MM:SS')}</span>;
-		},
-	},
-	{
-		prop: 'publishTime',
-		label: '发布时间',
-		width: 170,
-		render: (scope) => {
-			return <span>{formatDate(scope.row.publishTime, 'YYYY-mm-dd HH:MM:SS')}</span>;
-		},
-	},
-	{
-		prop: 'creationTime',
-		label: '回访任务创建时间',
-		width: 170,
-		render: (scope) => {
-			return <span>{formatDate(scope.row.creationTime, 'YYYY-mm-dd HH:MM:SS')}</span>;
-		},
-	},
-	{ prop: 'employeeName', label: '回访人', width: 150 },
-	{
-		prop: 'visitTime',
-		label: '回访时间',
-		width: 170,
-		render: (scope) => {
-			return <span>{formatDate(scope.row.visitTime, 'YYYY-mm-dd HH:MM:SS')}</span>;
-		},
-	},
-	{ prop: 'order.counterSignTypeText', label: '是否会签', width: 100 },
-	// { prop: 'voicePj', label: '语音评价', width: 150 },
-	{ prop: 'hwyPj', label: '话务员满意度', width: 150 },
-	{ prop: 'operation', label: '操作', fixed: 'right', width: 170, align: 'center' },
+  { prop: 'order.no', label: '工单编码', width: 150, fixed: 'left' },
+  { prop: 'order.isProvinceText', label: '省/市工单', width: 100 },
+  { prop: 'order.title', label: '工单标题', width: 300 },
+  { prop: 'order.sourceChannel', label: '来源渠道', width: 100 },
+  { prop: 'visitStateText', label: '回访状态', width: 100 },
+  { prop: 'visitTypeText', label: '回访方式', width: 100 },
+  { prop: 'order.acceptType', label: '受理类型', width: 150 },
+  { prop: 'order.hotspotName', label: '热点分类', width: 200 },
+  { prop: 'order.acceptorName', label: '受理人', width: 170 },
+  { prop: 'order.orgLevelOneName', label: '一级部门', width: 150 },
+  { prop: 'order.actualHandleOrgName', label: '接办部门', width: 120 },
+  {
+    prop: 'order.startTime',
+    label: '受理时间',
+    width: 170,
+    render: (scope) => {
+      return <span>{formatDate(scope.row.order?.startTime, 'YYYY-mm-dd HH:MM:SS')}</span>;
+    },
+  },
+  {
+    prop: 'order.filedTime',
+    label: '办结时间',
+    width: 170,
+    render: (scope) => {
+      return <span>{formatDate(scope.row.order?.filedTime, 'YYYY-mm-dd HH:MM:SS')}</span>;
+    },
+  },
+  {
+    prop: 'publishTime',
+    label: '发布时间',
+    width: 170,
+    render: (scope) => {
+      return <span>{formatDate(scope.row.publishTime, 'YYYY-mm-dd HH:MM:SS')}</span>;
+    },
+  },
+  {
+    prop: 'creationTime',
+    label: '回访任务创建时间',
+    width: 170,
+    render: (scope) => {
+      return <span>{formatDate(scope.row.creationTime, 'YYYY-mm-dd HH:MM:SS')}</span>;
+    },
+  },
+  { prop: 'employeeName', label: '回访人', width: 150 },
+  {
+    prop: 'visitTime',
+    label: '回访时间',
+    width: 170,
+    render: (scope) => {
+      return <span>{formatDate(scope.row.visitTime, 'YYYY-mm-dd HH:MM:SS')}</span>;
+    },
+  },
+  { prop: 'order.counterSignTypeText', label: '是否会签', width: 100 },
+  // { prop: 'voicePj', label: '语音评价', width: 150 },
+  { prop: 'hwyPj', label: '话务员满意度', width: 150 },
+  { prop: 'operation', label: '操作', fixed: 'right', width: 170, align: 'center' },
 ]);
 const state = reactive({
-	queryParams: {
-		// 查询条件
-		PageIndex: 1,
-		PageSize: 10,
-		Keyword: null, // 关键字
-		VisitState: null, // 回访状态
-		VisitType: null, // 回访方式
-		No: null,
-	},
-	tableData: [], //表单
-	loading: false, // 加载
-	total: 0, // 总数
-	visitStateOptions: [
-		{
-			label: '已回访',
-			value: '1',
-		},
-		{
-			label: '待回访',
-			value: '2',
-		},
-	], // 回访状态
-	visitTypeOptions: [],
+  queryParams: {
+    // 查询条件
+    PageIndex: 1,
+    PageSize: 10,
+    Keyword: null, // 关键字
+    VisitState: null, // 回访状态
+    VisitType: null, // 回访方式
+    No: null,
+    IsCountersign:null, // 是否会签
+    FiledType:null, // 归档类型
+    IsProvince:''
+  },
+  tableData: [], //表单
+  loading: false, // 加载
+  total: 0, // 总数
+  visitStateOptions: [
+    {
+      label: '已回访',
+      value: '1',
+    },
+    {
+      label: '待回访',
+      value: '2',
+    },
+  ], // 回访状态
+  visitTypeOptions: [],
 });
 // 获取基础数据
 const getBaseData = () => {
-	visitSearchBaseData().then((res: any) => {
-		state.visitTypeOptions = res.result?.visitType ?? [];
-	});
+  visitSearchBaseData().then((res: any) => {
+    state.visitTypeOptions = res.result?.visitType ?? [];
+  });
 };
 // 手动查询,将页码设置为1
 const handleQuery = () => {
-	state.queryParams.PageIndex = 1;
-	queryList();
+  state.queryParams.PageIndex = 1;
+  queryList();
 };
 /** 获取列表 */
 const queryList = () => {
-	state.loading = true;
-	visitList(state.queryParams)
-		.then((res: any) => {
-			state.tableData = res.result?.items ?? [];
-			state.total = res.result?.total ?? 0;
-			state.loading = false;
-		})
-		.catch(() => {
-			state.loading = false;
-		});
+  state.loading = true;
+  visitList(state.queryParams)
+      .then((res: any) => {
+        state.tableData = res.result?.items ?? [];
+        state.total = res.result?.total ?? 0;
+        state.loading = false;
+      })
+      .catch(() => {
+        state.loading = false;
+      });
 };
 
 /** 重置按钮操作 */
 const resetQuery = (formEl: FormInstance | undefined) => {
-	if (!formEl) return;
-	formEl.resetFields();
-	queryList();
+  if (!formEl) return;
+  formEl.resetFields();
+  queryList();
 };
 // 回访详情
 const visitDetailRef = ref<RefType>();
 const visitDetail = (row: any) => {
-	if ([10, 20].includes(row.visitState)) {
-		visitDetailRef.value.openDialog(row, '回访');
-	} else {
-		visitDetailRef.value.openDialog(row, '回访详情');
-	}
+  visitDetailRef.value.openDialog(row, '回访详情');
 };
 // 导出
 const exportCurrent = (cloums, prop) => {
-	console.log(cloums, prop);
+  console.log(cloums, prop);
 };
 onMounted(() => {
-	getBaseData();
-	queryList();
+  getBaseData();
+  queryList();
 });
 </script>
 <style scoped lang="scss">
 .business-visit-container {
-	.arrow {
-		transition: transform var(--el-transition-duration);
-		cursor: pointer;
-	}
-	.arrow.is-reverse {
-		transform: rotateZ(-180deg);
-	}
+  .arrow {
+    transition: transform var(--el-transition-duration);
+    cursor: pointer;
+  }
+  .arrow.is-reverse {
+    transform: rotateZ(-180deg);
+  }
 }
 </style>