1

src/views/exctab/modules/add-excel.vue

@@ -0,0 +1,64 @@
+<template>
+    <hc-dialog v-model="isShow" :title="type" widths="800px" :padding="false" @close="dialogClose">
+        111
+        <template #footer>
+            <el-button hc-btn @click="dialogClose">取消</el-button>
+            <el-button hc-btn type="primary" :loading="submitLoading" @click="dialogSubmit">提交</el-button>
+        </template>
+    </hc-dialog>
+</template>
+
+<script setup>
+import { ref, watch } from 'vue'
+import mainApi from '~api/exctab/exceltab'
+
+const props = defineProps({
+    info: {
+        type: Object,
+        default: () => ({}),
+    },
+    type: {
+        type: String,
+        default: '新增',
+    },
+})
+
+//事件
+const emit = defineEmits(['finish', 'close'])
+
+//双向绑定
+const isShow = defineModel('modelValue', {
+    default: false,
+})
+
+//监听可否编辑
+const dataInfo = ref(props.info)
+watch(() => props.info, (data) => {
+    dataInfo.value = data
+}, { immediate: true, deep: true })
+
+//监听显示
+watch(isShow, (val) => {
+    if (val) getInfoData()
+})
+
+//处理数据
+const getInfoData = () => {
+    console.log(dataInfo.value)
+}
+
+//提交
+const submitLoading = ref(false)
+const dialogSubmit = async () => {
+    emit('finish')
+}
+
+//关闭弹窗
+const dialogClose = () => {
+    emit('close')
+}
+</script>
+
+<style scoped lang="scss">
+
+</style>

src/views/exctab/modules/template.vue

@@ -64,6 +64,8 @@
                 </div>
             </hc-card>
         </hc-body>
+        <!-- 新增清表 -->
+        <HcAddExcel v-model="addExcelShow" :info="addExcelInfo" :type="addExcelType" @finish="addExcelFinish" />
     </hc-drawer>
 </template>
 
@@ -72,6 +74,7 @@ import { ref, watch } from 'vue'
 import { useAppStore } from '~src/store'
 import screenfull from 'screenfull'
 import { getArrValue, getObjValue, getRandom, isNullES } from 'js-fast-way'
+import HcAddExcel from './add-excel.vue'
 import mainApi from '~api/exctab/exceltab'
 
 const props = defineProps({
@@ -177,8 +180,21 @@ const treeDataMenu = ({ node, item, level }, resolve) => {
 }
 
 //菜单被点击
-const treeMenuClick = ({ key, node, data }) => {
+const treeMenuClick = ({ key, data }) => {
     console.log(key)
+    if (key === 'add') {
+        addExcelInfo.value = getObjValue(data)
+        addExcelType.value = '新增'
+        addExcelShow.value = true
+    }
+}
+
+//新增/编辑清表
+const addExcelShow = ref(false)
+const addExcelInfo = ref({})
+const addExcelType = ref('')
+const addExcelFinish = () => {
+
 }
 
 //全加载树