扫描

src/views/alter/collection/components/tableInfoModal.vue

@@ -0,0 +1,69 @@
+<template>
+    <hc-dialog is-to-body is-footer-center widths="30rem" :show="isShow" title="变更归档文件" @save="addModalSave" @close="addModalClose">
+        <el-form ref="formRef" :model="formModel" :rules="formRules" label-position="top" label-width="auto" size="large">
+            <el-form-item label="文件编号：">
+                <el-input v-model="formModel.key1" />
+            </el-form-item>
+            <el-form-item label="文件名称：">
+                <el-input v-model="formModel.key2" />
+            </el-form-item>
+            <el-form-item label="编制单位：">
+                <el-input v-model="formModel.key3" />
+            </el-form-item>
+            <el-form-item label="备注：">
+                <el-input v-model="formModel.key4" :autosize="{ minRows: 4, maxRows: 8 }" type="textarea" />
+            </el-form-item>
+        </el-form>
+    </hc-dialog>
+</template>
+
+<script setup>
+import { ref, watch } from 'vue'
+
+const props = defineProps({
+    info: {
+        type: Object,
+        default: () => ({}),
+    },
+})
+
+//事件
+const emit = defineEmits(['finish', 'close'])
+
+//双向绑定
+// eslint-disable-next-line no-undef
+const isShow = defineModel('modelValue', {
+    default: false,
+})
+
+//监听
+watch(() => [
+    props.info,
+], ([val]) => {
+    console.log('info', val)
+}, { immediate: true })
+
+//监听
+watch(isShow, (val) => {
+    if (val) {
+        console.log('isShow', val)
+    }
+})
+
+//基础表单
+const formRef = ref(null)
+const formModel = ref({})
+const formRules = {}
+
+//保存
+const addModalSave = () => {
+    emit('finish')
+    addModalClose()
+}
+
+//关闭弹窗
+const addModalClose = () => {
+    isShow.value = false
+    emit('close')
+}
+</script>

src/views/alter/collection/components/treeInfoModal.vue

@@ -0,0 +1,72 @@
+<template>
+    <hc-dialog is-to-body is-footer-center widths="30rem" :show="isShow" title="变更归档目录" @save="addModalSave" @close="addModalClose">
+        <el-form ref="formRef" :model="formModel" :rules="formRules" label-position="top" label-width="auto" size="large">
+            <el-form-item label="文件编号：">
+                <el-input v-model="formModel.key1" />
+            </el-form-item>
+            <el-form-item label="文件名称：">
+                <el-input v-model="formModel.key2" />
+            </el-form-item>
+            <el-form-item label="文件类型：">
+                <el-select v-model="formModel.key3" block>
+                    <el-option label="变更方案" value="1" />
+                    <el-option label="变更令" value="2" />
+                </el-select>
+            </el-form-item>
+            <el-form-item label="备注：">
+                <el-input v-model="formModel.key4" :autosize="{ minRows: 4, maxRows: 8 }" type="textarea" />
+            </el-form-item>
+        </el-form>
+    </hc-dialog>
+</template>
+
+<script setup>
+import { ref, watch } from 'vue'
+
+const props = defineProps({
+    info: {
+        type: Object,
+        default: () => ({}),
+    },
+})
+
+//事件
+const emit = defineEmits(['finish', 'close'])
+
+//双向绑定
+// eslint-disable-next-line no-undef
+const isShow = defineModel('modelValue', {
+    default: false,
+})
+
+//监听
+watch(() => [
+    props.info,
+], ([val]) => {
+    console.log('info', val)
+}, { immediate: true })
+
+//监听
+watch(isShow, (val) => {
+    if (val) {
+        console.log('isShow', val)
+    }
+})
+
+//基础表单
+const formRef = ref(null)
+const formModel = ref({})
+const formRules = {}
+
+//保存
+const addModalSave = () => {
+    emit('finish')
+    addModalClose()
+}
+
+//关闭弹窗
+const addModalClose = () => {
+    isShow.value = false
+    emit('close')
+}
+</script>

src/views/alter/collection/scan.vue

@@ -4,7 +4,7 @@
             <hc-new-switch :datas="tabTab" :keys="tabKey" :round="false" size="default" @change="tabChange" />
         </template>
         <template #extra>
-            <el-button hc-btn type="primary">
+            <el-button hc-btn type="primary" @click="isTableInfoShow = true">
                 <HcIcon name="add" />
                 <span>新增</span>
             </el-button>
@@ -30,11 +30,19 @@
                 </hc-card-item>
             </div>
         </div>
+
+        <!-- 节点树的新增和编辑 -->
+        <treeInfoModal v-model="isTreeInfoShow" />
+
+        <!-- 表格的新增和编辑 -->
+        <tableInfoModal v-model="isTableInfoShow" />
     </hc-card>
 </template>
 
 <script setup>
 import { nextTick, onMounted, ref } from 'vue'
+import treeInfoModal from './components/treeInfoModal.vue'
+import tableInfoModal from './components/tableInfoModal.vue'
 
 defineOptions({
     name: 'AlterCollectionScan',
@@ -105,8 +113,14 @@ const treeMenus = [
 
 const treeMenuTap = ({ key, node, data }) => {
     console.log(key, node, data)
+    if (key === 'add' || key === 'edit') {
+        isTreeInfoShow.value = true
+    }
 }
 
+const isTreeInfoShow = ref(false)
+const isTableInfoShow = ref(false)
+
 //搜索表单
 const searchForm = ref({ current: 1, size: 10, total: 0 })