暂降治理评估

2024-03-08 10:33:06 +08:00
parent 2191d2dc6b
commit 50bbba807f
13 changed files with 968 additions and 6 deletions
--- a/src/components/form/areaCascard/index.vue
+++ b/src/components/form/areaCascard/index.vue
@@ -0,0 +1,121 @@
+<template>
+    <el-cascader
+        class='tags_cascader_input'
+        ref='areaCascader'
+        :options='options'
+        :props='isMultiple?baseMultipleCascader:baseCascader'
+        @change='change'
+        clearable
+        collapse-tags
+        collapse-tags-tooltip
+    />
+</template>
+
+
+<script setup lang='ts'>
+import { ref } from 'vue'
+
+const areaCascader = ref()
+let areaValue = ref()
+const change = (e: any) => {
+    areaValue = areaCascader.value.getCheckedNodes()
+}
+
+const options = [
+    {
+        value: '海口市',
+        label: '海口市',
+        children: [
+            {
+                value: '秀英区',
+                label: '秀英区',
+                children: [
+                    {
+                        value: '秀英区',
+                        label: '秀英区',
+                        children: []
+                    },
+                    {
+                        value: '龙华区',
+                        label: '龙华区',
+                        children: []
+                    },
+                    {
+                        value: '琼山区',
+                        label: '琼山区',
+                        children: []
+                    }
+                ]
+            },
+            {
+                value: '龙华区',
+                label: '龙华区',
+                children: []
+            },
+            {
+                value: '琼山区',
+                label: '琼山区',
+                children: []
+            }
+        ]
+    },
+    {
+        value: '三亚市',
+        label: '三亚市',
+        children: [
+            {
+                value: '海棠区',
+                label: '海棠区',
+                children: []
+            },
+            {
+                value: '吉阳区',
+                label: '吉阳区',
+                children: []
+            },
+            {
+                value: '天涯区',
+                label: '天涯区',
+                children: []
+            }
+        ]
+    }
+]
+
+// 区域联级下拉框配置,多选
+const baseMultipleCascader = {
+    expandTrigger: 'hover' as const,
+    multiple: true
+}
+
+
+// 区域联级下拉框配置，单选
+const baseCascader = {
+    expandTrigger: 'hover' as const
+}
+
+
+/*暴露areaValue、areaCascader*/
+defineExpose({
+    areaCascader,
+    areaValue
+})
+/*定义参数给父组件*/
+const props = defineProps({
+    //根据父组件传递是否多选，默认单选
+    isMultiple: Boolean
+})
+</script>
+
+<style>
+.tags_cascader_input {
+    height: 32px !important;
+    width: 350px;
+}
+
+.tags_cascader_input .el-input--suffix {
+    height: 32px !important;
+    width: 280px;
+}
+
+</style>