项目资料收集

src/views/project/admin/create.vue

@@ -121,15 +121,38 @@
             </el-form>
         </hc-card-item>
         <template #action>
-            <el-button type="info">取消</el-button>
-            <el-button color="#20C98B" type="primary" class="text-white">创建</el-button>
-            <el-button type="warning">保存</el-button>
+            <el-button v-if="formInfo.id" type="info" @click="cancelClick">取消</el-button>
+            <el-button v-if="!formInfo.id" color="#20C98B" type="primary" class="text-white" @click="createClick">创建</el-button>
+            <el-button type="warning" @click="saveClick">保存</el-button>
         </template>
     </hc-card>
 </template>
 
 <script setup>
-import { ref } from 'vue'
+import { onMounted, ref, watch } from 'vue'
+import { isNullES } from 'js-fast-way'
+
+const props = defineProps({
+    form: {
+        type: Object,
+        default: () => ({}),
+    },
+})
+
+//事件
+const emit = defineEmits(['back'])
+
+//监听权限
+const formInfo = ref(props.form)
+watch(() => props.form, (data) => {
+    formInfo.value = data
+})
+
+//渲染完成
+onMounted(() => {
+    console.log(formInfo.value)
+})
+
 const baseForm = ref({ key1:'', key2: '', key3:'', key4:'', key5:'', key6:'', key7:'', key8:'', key9:'' })
 const baseFormRules = {
     key1: {
@@ -167,6 +190,25 @@ const selectYear = ref('')
 
 const yearForm = ref({ key1:'', key2: '', key3:'', key4:'', key5:'', key6:'', key7:'', key8:'', key9:'' })
 const yearFormRules = {}
+
+//取消
+const cancelClick = () => {
+    emit('back')
+}
+
+//创建
+const createClick = () => {
+    const form = formInfo.value
+    if (isNullES(form.id)) cancelClick()
+    console.log('创建')
+}
+
+//保存
+const saveClick = () => {
+    const form = formInfo.value
+    if (isNullES(form.id)) cancelClick()
+    console.log('保存')
+}
 </script>
 
 <style lang="scss">

src/views/project/admin/list.vue

@@ -87,6 +87,9 @@
 import { ref } from 'vue'
 import HcTableList from '../modules/project-list.vue'
 
+//事件
+const emit = defineEmits(['edit'])
+
 const tableRef = ref(null)
 
 //项目阶段
@@ -118,7 +121,7 @@ const tableCheck = (row) => {
 
 //项目名称被点击
 const rowNameClick = (row) => {
-    console.log(row)
+    emit('edit', row)
 }
 
 //批量删除

src/views/project/middle.vue

@@ -6,8 +6,8 @@
             </hc-card>
         </div>
         <div class="content hc-h-full inline-block">
-            <AdminCreate v-if="menuKey === 'project-collect-admin-create'" />
-            <AdminListe v-else-if="menuKey === 'project-collect-admin-list'" />
+            <AdminCreate v-if="menuKey === 'project-collect-admin-create'" :form="editFormInfo" @back="adminCreateBack" />
+            <AdminListe v-else-if="menuKey === 'project-collect-admin-list'" @edit="adminListeEdit" />
             <hc-card v-else>
                 项目资料收集
             </hc-card>
@@ -37,6 +37,7 @@ onMounted(() => {
 const menuKey = ref('')
 const menuData = ref([])
 const menuChange = ({ code }) => {
+    editFormInfo.value = {}
     menuKey.value = code
     router.push({
         path: useRoutes.path,
@@ -64,6 +65,27 @@ const getMenuDefaultKey = async (data) => {
         return data[0].code
     }
 }
+
+//项目列表编辑
+const editFormInfo = ref({})
+const adminListeEdit = (row) => {
+    editFormInfo.value = row
+    menuKey.value = 'project-collect-admin-create'
+    router.push({
+        path: useRoutes.path,
+        query: { code: 'project-collect-admin-create' },
+    })
+}
+
+//返回
+const adminCreateBack = () => {
+    editFormInfo.value = {}
+    menuKey.value = 'project-collect-admin-list'
+    router.push({
+        path: useRoutes.path,
+        query: { code: 'project-collect-admin-list' },
+    })
+}
 </script>
 
 <style lang="scss">

src/views/project/modules/project-list.vue

@@ -425,11 +425,11 @@ const tableColumn = ref([
 
 //表格数据
 const tableData = ref([
-   { key1: '名称1', key2: '-', key3: '-' },
-   { key1: '名称2', key2: '-', key3: '-' },
-   { key1: '名称3', key2: '-', key3: '-' },
-   { key1: '名称4', key2: '-', key3: '-' },
-   { key1: '名称5', key2: '-', key3: '-' },
+   { id: 1, key1: '名称1', key2: '-', key3: '-' },
+   { id: 2, key1: '名称2', key2: '-', key3: '-' },
+   { id: 3, key1: '名称3', key2: '-', key3: '-' },
+   { id: 4, key1: '名称4', key2: '-', key3: '-' },
+   { id: 5, key1: '名称5', key2: '-', key3: '-' },
 ])
 
 //表格被选择