From c0bd772b6127d423847539fe8fa94997d5ea60b2 Mon Sep 17 00:00:00 2001
From: GGJ <357021191@qq.com>
Date: Thu, 22 Aug 2024 15:59:15 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=20=E6=8A=80=E6=9C=AF?=
 =?UTF-8?q?=E7=9B=91=E7=9D=A3=20=E6=9F=A5=E8=AF=A2=E6=B5=81=E7=A8=8B?=
 =?UTF-8?q?=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/stores/dictData.ts                        | 23 +++++++++----
 .../electricalEnergy/components1/testRun.vue  | 15 ++++++--
 .../harmonicSurvey/components/planManage.vue  | 12 +++++--
 .../harmonicSurvey/components/testManage.vue  | 15 ++++++--
 .../components/undocumented/addForm.vue       |  2 +-
 .../components/undocumented/index.vue         | 19 ++++++++---
 src/views/pqs/supervise/retire/monitor.vue    | 16 +++++++--
 src/views/pqs/supervise/retire/terminal.vue   | 34 ++++++++++++-------
 .../supervise/technology/components/alarm.vue | 18 +++++++---
 .../components/cycleDetection/index.vue       | 12 +++++--
 .../components/jointDebugList/index.vue       | 18 +++++++---
 .../components/monitorpoint/index.vue         | 20 +++++++----
 .../components/terminainal/index.vue          | 16 +++++++--
 src/views/pqs/supervise/testRun/index.vue     | 18 +++++++---
 14 files changed, 179 insertions(+), 59 deletions(-)

diff --git a/src/stores/dictData.ts b/src/stores/dictData.ts
index 4061fc39..9c86b31b 100644
--- a/src/stores/dictData.ts
+++ b/src/stores/dictData.ts
@@ -2,6 +2,8 @@ import { defineStore } from 'pinia'
 import { DICT_DATA } from '@/stores/constant/cacheKey'
 import type { DictData } from '@/stores/interface/index'
 import { reactive } from 'vue'
+import { useAdminInfo } from '@/stores/adminInfo'
+const adminInfo = useAdminInfo()
 
 export const useDictData = defineStore(
     'dictData',
@@ -28,13 +30,20 @@ export const useDictData = defineStore(
         }
 
         const statusSelect = () => {
-            return [
-                { name: '待提交审批', id: 0 },
-                { name: '审批中', id: 1 },
-                { name: '审批通过', id: 2 },
-                { name: '审批不通过', id: 3 },
-                { name: '已取消', id: 4 }
-            ]
+            if (adminInfo.deptLevel == 2) {
+                return [
+                    { name: '审批中', id: 1 },
+                    { name: '审批通过', id: 2 }
+                ]
+            } else {
+                return [
+                    { name: '待提交审批', id: 0 },
+                    { name: '审批中', id: 1 },
+                    { name: '审批通过', id: 2 },
+                    { name: '审批不通过', id: 3 },
+                    { name: '已取消', id: 4 }
+                ]
+            }
         }
 
         return {
diff --git a/src/views/pqs/supervise/electricalEnergy/components1/testRun.vue b/src/views/pqs/supervise/electricalEnergy/components1/testRun.vue
index b55e7afa..dcc9ebcf 100644
--- a/src/views/pqs/supervise/electricalEnergy/components1/testRun.vue
+++ b/src/views/pqs/supervise/electricalEnergy/components1/testRun.vue
@@ -4,7 +4,13 @@
         <TableHeader area datePicker nextFlag theCurrentTime ref="TableHeaderRef">
             <template #select>
                 <el-form-item label="流程状态">
-                    <el-select v-model="tableStore.table.params.status" clearable placeholder="请选择流程状态">
+                    <el-select
+                        v-model="tableStore.table.params.status"
+                        multiple
+                        collapse-tags
+                        @change="changeStatus"
+                        placeholder="请选择流程状态"
+                    >
                         <el-option
                             v-for="item in statusSelect"
                             :key="item.id"
@@ -178,7 +184,7 @@ const tableStore = new TableStore({
         // tableStore.table.params.relationUserName = tableStore.table.params.userName
     }
 })
-tableStore.table.params.status = ''
+tableStore.table.params.status = statusSelect.map(item => item.id) //[]
 
 provide('tableStore', tableStore)
 
@@ -191,6 +197,11 @@ const checkboxConfig = reactive<VxeTablePropTypes.CheckboxConfig>({
         return !(row.testRunState == 1 || row.testRunState == 2)
     }
 })
+const changeStatus = e => {
+    if (e.length == 0) {
+        tableStore.table.params.status = statusSelect.map(item => item.id)
+    }
+}
 /** 处理审批按钮 */
 const handleAudit = (instanceId: any, historyInstanceId: any) => {
     push({
diff --git a/src/views/pqs/supervise/harmonicSurvey/components/planManage.vue b/src/views/pqs/supervise/harmonicSurvey/components/planManage.vue
index b212044b..c873d5dc 100644
--- a/src/views/pqs/supervise/harmonicSurvey/components/planManage.vue
+++ b/src/views/pqs/supervise/harmonicSurvey/components/planManage.vue
@@ -12,7 +12,9 @@
                 </el-select>
             </el-form-item>
             <el-form-item label="流程状态">
-                <el-select v-model="tableStore.table.params.status" clearable placeholder="请选择流程状态">
+                <el-select v-model="tableStore.table.params.status"    multiple
+                    collapse-tags
+                        @change="changeStatus" placeholder="请选择流程状态">
                     <el-option
                         v-for="item in statusSelect"
                         :key="item.id"
@@ -205,7 +207,7 @@ const tableStore = new TableStore({
     }
 })
 
-tableStore.table.params.status = ''
+tableStore.table.params.status = statusSelect.map(item => item.id) //[]
 tableStore.table.params.supvType = ''
 provide('tableStore', tableStore)
 // 新增计划
@@ -213,7 +215,11 @@ const add = () => {
     // title.value = '普测计划新增'
     planAddRef.value.open('计划新增')
 }
-
+const changeStatus = e => {
+    if (e.length == 0) {
+        tableStore.table.params.status = statusSelect.map(item => item.id)
+    }
+}
 const exportFn = () => {
     let form = JSON.parse(JSON.stringify(tableStore.table.params))
     form.pageNum = 1
diff --git a/src/views/pqs/supervise/harmonicSurvey/components/testManage.vue b/src/views/pqs/supervise/harmonicSurvey/components/testManage.vue
index 95c96305..8e5d1580 100644
--- a/src/views/pqs/supervise/harmonicSurvey/components/testManage.vue
+++ b/src/views/pqs/supervise/harmonicSurvey/components/testManage.vue
@@ -12,7 +12,13 @@
                 </el-select>
             </el-form-item>
             <el-form-item label="流程状态">
-                <el-select v-model="tableStore.table.params.status" clearable placeholder="请选择流程状态">
+                <el-select
+                    v-model="tableStore.table.params.status"
+                    multiple
+                    collapse-tags
+                    @change="changeStatus"
+                    placeholder="请选择流程状态"
+                >
                     <el-option
                         v-for="item in statusSelect"
                         :key="item.id"
@@ -220,10 +226,15 @@ const tableStore = new TableStore({
     }
 })
 
-tableStore.table.params.status = ''
+tableStore.table.params.status = statusSelect.map(item => item.id) //[]
 tableStore.table.params.supvType = ''
 
 provide('tableStore', tableStore)
+const changeStatus = e => {
+    if (e.length == 0) {
+        tableStore.table.params.status = statusSelect.map(item => item.id)
+    }
+}
 // 新增计划
 const add = (id: string) => {
     planTestRef.value.open('计划测试填报', id, true)
diff --git a/src/views/pqs/supervise/interfere/components/undocumented/addForm.vue b/src/views/pqs/supervise/interfere/components/undocumented/addForm.vue
index 3253c7d7..787fb6d7 100644
--- a/src/views/pqs/supervise/interfere/components/undocumented/addForm.vue
+++ b/src/views/pqs/supervise/interfere/components/undocumented/addForm.vue
@@ -137,7 +137,7 @@
                 </el-select>
             </el-form-item>
             <el-form-item for="-" label="预测评估单位：" prop="evaluationDept">
-                <el-select v-model="form.evaluationDept" placeholder="请选择预测评估单位">
+                <el-select v-model="form.evaluationDept" allow-create filterable placeholder="请选择预测评估单位">
                     <el-option
                         v-for="(item, index) in evaluationDeptList"
                         :label="item.name"
diff --git a/src/views/pqs/supervise/interfere/components/undocumented/index.vue b/src/views/pqs/supervise/interfere/components/undocumented/index.vue
index 73db04c4..f35741da 100644
--- a/src/views/pqs/supervise/interfere/components/undocumented/index.vue
+++ b/src/views/pqs/supervise/interfere/components/undocumented/index.vue
@@ -16,7 +16,13 @@
             </el-form-item>
 
             <el-form-item label="流程状态">
-                <el-select v-model="tableStore.table.params.status" clearable placeholder="请选择流程状态">
+                <el-select
+                    v-model="tableStore.table.params.status"
+                    multiple
+                    collapse-tags
+                    @change="changeStatus"
+                    placeholder="请选择流程状态"
+                >
                     <el-option
                         v-for="item in statusSelect"
                         :key="item.id"
@@ -38,7 +44,7 @@
     <!-- 上传 -->
     <Audit ref="AuditRef" @onSubmit="tableStore.index()" />
     <!-- 查看详情 detail 新增/修改 create-->
-    <addForm ref="addForms" @onSubmit="tableStore.index()"   ></addForm>
+    <addForm ref="addForms" @onSubmit="tableStore.index()"></addForm>
 </template>
 <script setup lang="ts">
 import { ref, onMounted, provide, watch } from 'vue'
@@ -81,7 +87,7 @@ const tableStore = new TableStore({
         {
             field: 'city',
             title: '所在地市',
-            minWidth: 80,
+            minWidth: 80
             // formatter: (obj: any) => {
             //     return areaOptionList.filter(item => item.id == obj.row.city)[0]?.name
             // }
@@ -235,13 +241,18 @@ tableStore.table.params.loadType = ''
 tableStore.table.params.userName = ''
 tableStore.table.params.fileUploadflag = ''
 tableStore.table.params.orgId = adminInfo.$state.deptId
-tableStore.table.params.status = ''
+tableStore.table.params.status = statusSelect.map(item => item.id) //[]
 
 provide('tableStore', tableStore)
 // 新增
 const addList = () => {
     addRef.value.open()
 }
+const changeStatus = e => {
+    if (e.length == 0) {
+        tableStore.table.params.status = statusSelect.map(item => item.id)
+    }
+}
 
 const addForms = ref()
 const addFormModel = () => {
diff --git a/src/views/pqs/supervise/retire/monitor.vue b/src/views/pqs/supervise/retire/monitor.vue
index ef05ae91..6aed86e9 100644
--- a/src/views/pqs/supervise/retire/monitor.vue
+++ b/src/views/pqs/supervise/retire/monitor.vue
@@ -4,7 +4,13 @@
         <TableHeader date-picker nextFlag theCurrentTime>
             <template #select>
                 <el-form-item label="流程状态">
-                    <el-select v-model="tableStore.table.params.status" clearable placeholder="请选择流程状态">
+                    <el-select
+                        v-model="tableStore.table.params.status"
+                        multiple
+                        collapse-tags
+                        @change="changeStatus"
+                        placeholder="请选择流程状态"
+                    >
                         <el-option
                             v-for="item in statusSelect"
                             :key="item.id"
@@ -225,9 +231,13 @@ const tableStore = new TableStore({
     }
 })
 tableStore.table.params.searchValue = ''
-tableStore.table.params.status = ''
+tableStore.table.params.status = statusSelect.map(item => item.id) //[]
 provide('tableStore', tableStore)
-
+const changeStatus = e => {
+    if (e.length == 0) {
+        tableStore.table.params.status = statusSelect.map(item => item.id)
+    }
+}
 //新增退运终端信息
 const add = () => {
     deviceQuitPopup.value.open('新增监测点状态变更')
diff --git a/src/views/pqs/supervise/retire/terminal.vue b/src/views/pqs/supervise/retire/terminal.vue
index ffc2278b..f7b9b0b4 100644
--- a/src/views/pqs/supervise/retire/terminal.vue
+++ b/src/views/pqs/supervise/retire/terminal.vue
@@ -4,7 +4,13 @@
         <TableHeader date-picker nextFlag theCurrentTime>
             <template v-slot:select>
                 <el-form-item label="流程状态">
-                    <el-select v-model="tableStore.table.params.status" clearable placeholder="请选择流程状态">
+                    <el-select
+                        v-model="tableStore.table.params.status"
+                        multiple
+                        collapse-tags
+                        @change="changeStatus"
+                        placeholder="请选择流程状态"
+                    >
                         <el-option
                             v-for="item in statusSelect"
                             :key="item.id"
@@ -14,12 +20,12 @@
                     </el-select>
                 </el-form-item>
                 <el-form-item label="搜索">
-                <el-input
-                    v-model="tableStore.table.params.searchValue"
-                    placeholder="输入变电站、终端"
-                    clearable
-                ></el-input>
-            </el-form-item>
+                    <el-input
+                        v-model="tableStore.table.params.searchValue"
+                        placeholder="输入变电站、终端"
+                        clearable
+                    ></el-input>
+                </el-form-item>
             </template>
             <template #operation>
                 <el-button icon="el-icon-Plus" type="primary" @click="add">新增</el-button>
@@ -83,7 +89,7 @@ const tableStore = new TableStore({
                 2: 'danger',
                 3: 'warning',
                 4: 'info',
-                 null: 'primary'
+                null: 'primary'
             },
             replaceValue: {
                 0: '运行',
@@ -105,7 +111,7 @@ const tableStore = new TableStore({
                 2: 'danger',
                 3: 'warning',
                 4: 'info',
-                  null: 'primary'
+                null: 'primary'
             },
             replaceValue: {
                 0: '运行',
@@ -113,7 +119,7 @@ const tableStore = new TableStore({
                 2: '停运',
                 3: '调试',
                 4: '退运',
-                  null:'/'
+                null: '/'
             }
         },
         {
@@ -220,10 +226,14 @@ const tableStore = new TableStore({
         tableStore.table.params.deviceType = 1
     }
 })
-tableStore.table.params.status = ''
+tableStore.table.params.status = statusSelect.map(item => item.id)
 tableStore.table.params.searchValue = ''
 provide('tableStore', tableStore)
-
+const changeStatus = e => {
+    if (e.length == 0) {
+        tableStore.table.params.status = statusSelect.map(item => item.id)
+    }
+} 
 //新增退运终端信息
 const add = () => {
     deviceQuitPopup.value.open('新增终端状态变更')
diff --git a/src/views/pqs/supervise/technology/components/alarm.vue b/src/views/pqs/supervise/technology/components/alarm.vue
index fd991c69..d5d055a5 100644
--- a/src/views/pqs/supervise/technology/components/alarm.vue
+++ b/src/views/pqs/supervise/technology/components/alarm.vue
@@ -2,7 +2,13 @@
     <TableHeader area datePicker nextFlag theCurrentTime ref="TableHeaderRef">
         <template #select>
             <el-form-item label="流程状态">
-                <el-select v-model="tableStore.table.params.status" clearable placeholder="请选择流程状态">
+                <el-select
+                    v-model="tableStore.table.params.status"
+                    multiple
+                    collapse-tags
+                    @change="changeStatus"
+                    placeholder="请选择流程状态"
+                >
                     <el-option
                         v-for="item in statusSelect"
                         :key="item.id"
@@ -193,7 +199,7 @@ const tableStore = new TableStore({
             render: 'buttons',
             fixed: 'right',
             buttons: [
-                            {
+                {
                     name: 'productSetting',
                     title: '查看报告',
                     type: 'primary',
@@ -404,8 +410,12 @@ const cancelLeave = async (row: any) => {
     // 加载数据
     tableStore.index()
 }
-tableStore.table.params.status = ''
-
+tableStore.table.params.status = statusSelect.map(item => item.id) //[]
+const changeStatus = e => {
+    if (e.length == 0) {
+        tableStore.table.params.status = statusSelect.map(item => item.id)
+    }
+}
 provide('tableStore', tableStore)
 
 onMounted(() => {
diff --git a/src/views/pqs/supervise/terminalNetworkDetection/components/cycleDetection/index.vue b/src/views/pqs/supervise/terminalNetworkDetection/components/cycleDetection/index.vue
index 93fd6a86..f317d8c4 100644
--- a/src/views/pqs/supervise/terminalNetworkDetection/components/cycleDetection/index.vue
+++ b/src/views/pqs/supervise/terminalNetworkDetection/components/cycleDetection/index.vue
@@ -10,7 +10,9 @@
                 ></el-input>
             </el-form-item>
             <el-form-item label="流程状态">
-                <el-select v-model="tableStore.table.params.status" clearable placeholder="请选择流程状态">
+                <el-select v-model="tableStore.table.params.status"           multiple
+                    collapse-tags
+                        @change="changeStatus" placeholder="请选择流程状态">
                     <el-option
                         v-for="item in statusSelect"
                         :key="item.id"
@@ -214,12 +216,16 @@ const tableStore = new TableStore({
         // tableStore.table.params.relationUserName = tableStore.table.params.userName
     }
 })
-tableStore.table.params.status = ''
+tableStore.table.params.status = statusSelect.map(item => item.id) //[]
 tableStore.table.params.state = ''
 tableStore.table.params.searchValue = ''
 
 provide('tableStore', tableStore)
-
+const changeStatus = e => {
+    if (e.length == 0) {
+        tableStore.table.params.status = statusSelect.map(item => item.id)
+    }
+}
 onMounted(() => {
     tableStore.index()
 })
diff --git a/src/views/pqs/supervise/terminalNetworkDetection/components/jointDebugList/index.vue b/src/views/pqs/supervise/terminalNetworkDetection/components/jointDebugList/index.vue
index 0012f6c7..dec7cf11 100644
--- a/src/views/pqs/supervise/terminalNetworkDetection/components/jointDebugList/index.vue
+++ b/src/views/pqs/supervise/terminalNetworkDetection/components/jointDebugList/index.vue
@@ -10,7 +10,13 @@
                 ></el-input>
             </el-form-item>
             <el-form-item label="流程状态">
-                <el-select v-model="tableStore.table.params.status" clearable placeholder="请选择流程状态">
+                <el-select
+                    v-model="tableStore.table.params.status"
+                    multiple
+                    collapse-tags
+                    @change="changeStatus"
+                    placeholder="请选择流程状态"
+                >
                     <el-option
                         v-for="item in statusSelect"
                         :key="item.id"
@@ -50,7 +56,7 @@ const flag = ref(false)
 const TableHeaderRef = ref()
 const tableRef = ref()
 const statusSelect = dictData.statusSelect()
-
+statusSelect.push({ name: '同步台账成功', id: 5 })
 const tableStore = new TableStore({
     url: '/supervision-boot/tempLinedebug/list',
     publicHeight: 65,
@@ -216,14 +222,18 @@ const tableStore = new TableStore({
         // tableStore.table.params.relationUserName = tableStore.table.params.userName
     }
 })
-tableStore.table.params.status = ''
+tableStore.table.params.status = statusSelect.map(item => item.id) //[]
 tableStore.table.params.searchValue = ''
 // tableStore.table.params.loadType = ''
 // tableStore.table.params.userName = ''
 // tableStore.table.params.fileUploadflag = ''
 
 provide('tableStore', tableStore)
-
+const changeStatus = e => {
+    if (e.length == 0) {
+        tableStore.table.params.status = statusSelect.map(item => item.id)
+    }
+}
 const exportEvent = () => {
     let form = JSON.parse(JSON.stringify(tableStore.table.params))
     form.pageNum = 1
diff --git a/src/views/pqs/supervise/terminalNetworkDetection/components/monitorpoint/index.vue b/src/views/pqs/supervise/terminalNetworkDetection/components/monitorpoint/index.vue
index bd85ea73..97dcd9c5 100644
--- a/src/views/pqs/supervise/terminalNetworkDetection/components/monitorpoint/index.vue
+++ b/src/views/pqs/supervise/terminalNetworkDetection/components/monitorpoint/index.vue
@@ -10,7 +10,13 @@
                 ></el-input>
             </el-form-item>
             <el-form-item label="流程状态">
-                <el-select v-model="tableStore.table.params.status" clearable placeholder="请选择流程状态">
+                <el-select
+                    v-model="tableStore.table.params.status"
+                    multiple
+                    collapse-tags
+                    @change="changeStatus"
+                    placeholder="请选择流程状态"
+                >
                     <el-option
                         v-for="item in statusSelect"
                         :key="item.id"
@@ -132,7 +138,7 @@ const tableStore = new TableStore({
                     showDisabled: row => {
                         return row.createBy != adminInfo.$state.id || !(row.status == 0)
                     },
-                    
+
                     disabled: row => {
                         return !(row.status == 0)
                     },
@@ -181,11 +187,13 @@ const tableStore = new TableStore({
         // tableStore.table.params.relationUserName = tableStore.table.params.userName
     }
 })
-tableStore.table.params.status = ''
+tableStore.table.params.status = statusSelect.map(item => item.id) //[]
 tableStore.table.params.searchValue = ''
-// tableStore.table.params.loadType = ''
-// tableStore.table.params.userName = ''
-// tableStore.table.params.fileUploadflag = ''
+const changeStatus = e => {
+    if (e.length == 0) {
+        tableStore.table.params.status = statusSelect.map(item => item.id)
+    }
+}
 
 provide('tableStore', tableStore)
 
diff --git a/src/views/pqs/supervise/terminalNetworkDetection/components/terminainal/index.vue b/src/views/pqs/supervise/terminalNetworkDetection/components/terminainal/index.vue
index 66d5e291..43c2a4a6 100644
--- a/src/views/pqs/supervise/terminalNetworkDetection/components/terminainal/index.vue
+++ b/src/views/pqs/supervise/terminalNetworkDetection/components/terminainal/index.vue
@@ -9,7 +9,13 @@
                 ></el-input>
             </el-form-item>
             <el-form-item label="流程状态">
-                <el-select v-model="tableStore.table.params.status" clearable placeholder="请选择流程状态">
+                <el-select
+                    v-model="tableStore.table.params.status"
+                    multiple
+                    @change="changeStatus"
+                    collapse-tags
+                    placeholder="请选择流程状态"
+                >
                     <el-option
                         v-for="item in statusSelect"
                         :key="item.id"
@@ -215,7 +221,7 @@ const tableStore = new TableStore({
         // tableStore.table.params.relationUserName = tableStore.table.params.userName
     }
 })
-tableStore.table.params.status = ''
+tableStore.table.params.status = statusSelect.map(item => item.id)
 tableStore.table.params.searchValue = ''
 // tableStore.table.params.loadType = ''
 // tableStore.table.params.userName = ''
@@ -252,7 +258,11 @@ const cancelLeave = async (row: any) => {
     // 加载数据
     tableStore.index()
 }
-
+const changeStatus = e => {
+    if (e.length == 0) {
+        tableStore.table.params.status = statusSelect.map(item => item.id)
+    }
+}
 //导出模板
 const exportExcelTemplate = () => {
     downloadDevTemplate().then((res: any) => {
diff --git a/src/views/pqs/supervise/testRun/index.vue b/src/views/pqs/supervise/testRun/index.vue
index 7d14972b..9a775288 100644
--- a/src/views/pqs/supervise/testRun/index.vue
+++ b/src/views/pqs/supervise/testRun/index.vue
@@ -4,7 +4,13 @@
         <TableHeader area datePicker nextFlag theCurrentTime ref="TableHeaderRef">
             <template #select>
                 <el-form-item label="流程状态">
-                    <el-select v-model="tableStore.table.params.status" clearable placeholder="请选择流程状态">
+                    <el-select
+                        v-model="tableStore.table.params.status"
+                        multiple
+                        collapse-tags
+                        @change="changeStatus"
+                        placeholder="请选择流程状态"
+                    >
                         <el-option
                             v-for="item in statusSelect"
                             :key="item.id"
@@ -245,10 +251,14 @@ const tableStore = new TableStore({
         // tableStore.table.params.relationUserName = tableStore.table.params.userName
     }
 })
-tableStore.table.params.status = ''
+tableStore.table.params.status = statusSelect.map(item => item.id) //[]
 
 provide('tableStore', tableStore)
-
+const changeStatus = e => {
+    if (e.length == 0) {
+        tableStore.table.params.status = statusSelect.map(item => item.id)
+    }
+}
 onMounted(() => {
     tableStore.index()
 })
@@ -369,8 +379,6 @@ const runTestSubmit = (type: number) => {
         }
     })
 }
-
-
 </script>
 
 <style scoped lang="scss"></style>