From acd6bbae394c997523b5051d019e584db1845c4c Mon Sep 17 00:00:00 2001
From: zhangwencui <1064582902@qq.com>
Date: 星期三, 17 六月 2026 14:29:04 +0800
Subject: [PATCH] 样式修改
---
src/views/customerService/components/viewDia.vue | 195 +++++++++++++++++++++++++++++-------------------
1 files changed, 116 insertions(+), 79 deletions(-)
diff --git a/src/views/customerService/components/viewDia.vue b/src/views/customerService/components/viewDia.vue
index 96452b4..92833de 100644
--- a/src/views/customerService/components/viewDia.vue
+++ b/src/views/customerService/components/viewDia.vue
@@ -1,44 +1,73 @@
<template>
- <el-dialog v-model="dialogVisible" title="鍞悗鍗曡鎯�" width="80%" @close="closeDia">
+ <el-dialog v-model="dialogVisible"
+ title="鍞悗鍗曡鎯�"
+ width="80%"
+ @close="closeDia">
<div v-loading="loading">
<span class="descriptions">鍩虹璧勬枡</span>
- <el-descriptions :column="4" border style="margin-top: 10px;">
+ <el-descriptions :column="4"
+ border
+ style="margin-top: 10px;">
<el-descriptions-item label="瀹㈡埛鍚嶇О">{{ detail.customerName || '-' }}</el-descriptions-item>
<el-descriptions-item label="鍞悗绫诲瀷">{{ getDictLabel(classificationOptions, detail.serviceType) }}</el-descriptions-item>
<el-descriptions-item label="鍏宠仈閿�鍞崟鍙�">{{ detail.salesContractNo || '-' }}</el-descriptions-item>
<el-descriptions-item label="绱ф�ョ▼搴�">{{ getDictLabel(degreeOfUrgencyOptions, detail.urgency) }}</el-descriptions-item>
<el-descriptions-item label="宸ュ崟缂栧彿">{{ detail.afterSalesServiceNo || '-' }}</el-descriptions-item>
<el-descriptions-item label="澶勭悊鐘舵��">
- <el-tag :type="detail.status === 1 ? 'danger' : 'success'" size="small">
+ <el-tag :type="detail.status === 1 ? 'danger' : 'success'"
+ size="small">
{{ detail.status === 1 ? '寰呭鐞�' : '宸插鐞�' }}
</el-tag>
</el-descriptions-item>
<el-descriptions-item label="鐧昏浜�">{{ detail.checkNickName || '-' }}</el-descriptions-item>
<el-descriptions-item label="鍙嶉鏃ユ湡">{{ detail.feedbackDate || '-' }}</el-descriptions-item>
- <el-descriptions-item label="瀹㈡埛璇夋眰" :span="4">{{ detail.proDesc || '-' }}</el-descriptions-item>
+ <el-descriptions-item label="瀹㈡埛璇夋眰"
+ :span="4">{{ detail.proDesc || '-' }}</el-descriptions-item>
</el-descriptions>
-
<div style="margin-top: 20px;">
<span class="descriptions">澶勭悊淇℃伅</span>
- <el-descriptions :column="3" border style="margin-top: 10px;">
+ <el-descriptions :column="3"
+ border
+ style="margin-top: 10px;">
<el-descriptions-item label="澶勭悊浜�">{{ detail.disposeNickName || '-' }}</el-descriptions-item>
<el-descriptions-item label="澶勭悊鏃ユ湡">{{ detail.disDate || '-' }}</el-descriptions-item>
- <el-descriptions-item label="澶勭悊缁撴灉" :span="3">{{ detail.disRes || '-' }}</el-descriptions-item>
+ <el-descriptions-item label="澶勭悊缁撴灉"
+ :span="3">{{ detail.disRes || '-' }}</el-descriptions-item>
</el-descriptions>
</div>
-
<div style="margin-top: 20px;">
<span class="descriptions">鍏宠仈浜у搧</span>
- <el-table :data="tableData" border style="width: 100%; margin-top: 10px;">
- <el-table-column type="index" label="搴忓彿" width="60" align="center" />
- <el-table-column prop="productCategory" label="浜у搧澶х被" align="center" />
- <el-table-column prop="specificationModel" label="瑙勬牸鍨嬪彿" align="center" />
- <el-table-column prop="unit" label="鍗曚綅" align="center" />
- <el-table-column prop="expressCompany" label="蹇�掑叕鍙�" align="center" />
- <el-table-column prop="expressNumber" label="蹇�掑崟鍙�" align="center" />
- <el-table-column prop="shippingCarNumber" label="鍙戣揣杞︾墝" align="center" />
- <el-table-column prop="shippingDate" label="鍙戣揣鏃ユ湡" align="center" />
- <el-table-column prop="quantity" label="鍞悗鏁伴噺" align="center" />
+ <el-table :data="tableData"
+ border
+ style="width: 100%; margin-top: 10px;">
+ <el-table-column type="index"
+ label="搴忓彿"
+ width="60"
+ align="center" />
+ <el-table-column prop="productCategory"
+ label="浜у搧澶х被"
+ align="center" />
+ <el-table-column prop="specificationModel"
+ label="瑙勬牸鍨嬪彿"
+ align="center" />
+ <el-table-column prop="unit"
+ label="鍗曚綅"
+ align="center" />
+ <el-table-column prop="expressCompany"
+ label="蹇�掑叕鍙�"
+ align="center" />
+ <el-table-column prop="expressNumber"
+ label="蹇�掑崟鍙�"
+ align="center" />
+ <el-table-column prop="shippingCarNumber"
+ label="鍙戣揣杞︾墝"
+ align="center" />
+ <el-table-column prop="shippingDate"
+ label="鍙戣揣鏃ユ湡"
+ align="center" />
+ <el-table-column prop="quantity"
+ label="鍞悗鏁伴噺"
+ align="center" />
</el-table>
</div>
</div>
@@ -51,73 +80,81 @@
</template>
<script setup>
-import { ref, computed, getCurrentInstance } from 'vue';
-import { getAfterSalesServiceById } from '@/api/customerService/index.js';
+ import { ref, computed, getCurrentInstance } from "vue";
+ import { getAfterSalesServiceById } from "@/api/customerService/index.js";
-const { proxy } = getCurrentInstance();
-const dialogVisible = ref(false);
-const loading = ref(false);
-const detail = ref({});
-const tableData = ref([]);
+ const { proxy } = getCurrentInstance();
+ const dialogVisible = ref(false);
+ const loading = ref(false);
+ const detail = ref({});
+ const tableData = ref([]);
-const { post_sale_waiting_list, degree_of_urgency } = proxy.useDict(
- "post_sale_waiting_list",
- "degree_of_urgency"
-);
-const classificationOptions = computed(() => post_sale_waiting_list?.value || []);
-const degreeOfUrgencyOptions = computed(() => degree_of_urgency?.value || []);
+ const { post_sale_waiting_list, degree_of_urgency } = proxy.useDict(
+ "post_sale_waiting_list",
+ "degree_of_urgency"
+ );
+ const classificationOptions = computed(
+ () => post_sale_waiting_list?.value || []
+ );
+ const degreeOfUrgencyOptions = computed(() => degree_of_urgency?.value || []);
-const getDictLabel = (options, value) => {
- if (!value) return '-';
- const item = options.find(i => String(i.value) === String(value));
- return item ? item.label : value;
-};
+ const getDictLabel = (options, value) => {
+ if (!value) return "-";
+ const item = options.find(i => String(i.value) === String(value));
+ return item ? item.label : value;
+ };
-const openDialog = (row) => {
- dialogVisible.value = true;
- loading.value = true;
- detail.value = {};
- tableData.value = [];
-
- getAfterSalesServiceById(row.id).then(res => {
- loading.value = false;
- if (res.code === 200) {
- detail.value = res.data || {};
- let productData = res.data?.salesLedgerDto?.productData || [];
- const selectedIds = res.data.productModelIds ? String(res.data.productModelIds).split(",") : [];
- tableData.value = productData.filter(item => selectedIds.includes(String(item.id)));
- }
- }).catch(() => {
- loading.value = false;
+ const openDialog = row => {
+ dialogVisible.value = true;
+ loading.value = true;
+ detail.value = {};
+ tableData.value = [];
+
+ getAfterSalesServiceById(row.id)
+ .then(res => {
+ loading.value = false;
+ if (res.code === 200) {
+ detail.value = res.data || {};
+ let productData = res.data?.salesLedgerDto?.productData || [];
+ const selectedIds = res.data.productModelIds
+ ? String(res.data.productModelIds).split(",")
+ : [];
+ tableData.value = productData.filter(item =>
+ selectedIds.includes(String(item.id))
+ );
+ }
+ })
+ .catch(() => {
+ loading.value = false;
+ });
+ };
+
+ const closeDia = () => {
+ dialogVisible.value = false;
+ };
+
+ defineExpose({
+ openDialog,
});
-};
-
-const closeDia = () => {
- dialogVisible.value = false;
-};
-
-defineExpose({
- openDialog
-});
</script>
<style scoped>
-.descriptions {
- display: inline-block;
- font-size: 1rem;
- font-weight: 600;
- padding-left: 12px;
- position: relative;
-}
-.descriptions::before {
- content: "";
- position: absolute;
- left: 0;
- top: 50%;
- transform: translateY(-50%);
- width: 4px;
- height: 1rem;
- background-color: #002fa7;
- border-radius: 2px;
-}
+ .descriptions {
+ display: inline-block;
+ font-size: 1rem;
+ font-weight: 600;
+ padding-left: 12px;
+ position: relative;
+ }
+ .descriptions::before {
+ content: "";
+ position: absolute;
+ left: 0;
+ top: 50%;
+ transform: translateY(-50%);
+ width: 4px;
+ height: 1rem;
+ background-color: #374d77;
+ border-radius: 2px;
+ }
</style>
--
Gitblit v1.9.3