状态类型的改变

web/src/pinia/project/project.js

@@ -0,0 +1,35 @@
+import { defineStore } from 'pinia'
+import { reactive } from 'vue'
+import { queryProjectState } from '@/api/project'
+import { getFileType } from '@/api/file'
+export const projectData = defineStore('counter', () => {
+  // 定义数据(state)
+  const stateList = reactive([])
+  const typeList = reactive([])
+  // 定义修改数据的方法 (action 同步+异步)
+  const getStateList = () => {
+    queryProjectState().then(res => {
+      if (res.code === 0) {
+        console.log(res.data)
+        stateList.length = 0
+        stateList.push(...res.data)
+      }
+    })
+  }
+  const getTypeList = () => {
+    getFileType().then(res => {
+      if (res.code === 0) {
+        console.log(res.data)
+        typeList.length = 0
+        typeList.push(...res.data)
+      }
+    })
+  }
+  // 以对象的方式return供组件使用
+  return {
+    stateList,
+    typeList,
+    getStateList,
+    getTypeList
+  }
+})

web/src/view/projectManage/projectDetails/components/optionEdit.vue

@@ -0,0 +1,119 @@
+<template>
+  <div style="height: 330px">
+    <el-tabs type="border-card">
+      <el-tab-pane label="新增与更新">
+        <div style="height: 250px">
+          <el-alert
+            :title="prompt"
+            type="info"
+          />
+          <el-form class="mt-7">
+            <el-form-item
+              label="项目状态："
+              size="large"
+            >
+              <el-input
+                v-model="projectState"
+                placeholder="请输入项目状态"
+                style="max-width: 600px"
+                size="large"
+                clearable
+              >
+                <template #append>
+                  <el-select
+                    v-model="selectedState"
+                    placeholder="项目状态"
+                    style="width: 115px"
+                    clearable
+                  >
+                    <el-option
+                      v-for="item in data.stateList"
+                      :key="item.ID"
+                      :label="item.name"
+                      :value="item.name"
+                    />
+                  </el-select>
+                </template>
+              </el-input>
+            </el-form-item>
+            <el-form-item
+              label="文件类型："
+              size="large"
+            >
+              <el-input
+                v-model="fileType"
+                style="max-width: 600px"
+                placeholder="请输入文件类型"
+                size="large"
+                clearable
+              >
+                <template #append>
+                  <el-select
+                    v-model="selectedType"
+                    placeholder="文件类型"
+                    style="width: 115px"
+                    clearable
+                    @change="changeType"
+                  >
+                    <el-option
+                      v-for="item in data.typeList"
+                      :key="item.ID"
+                      :label="item.name"
+                      :value="item.ID"
+                    />
+                  </el-select>
+                </template>
+              </el-input>
+            </el-form-item>
+          </el-form>
+          <el-row
+            justify="end"
+            align="middle"
+            class="mt-10"
+          >
+            <el-button
+              :icon="Edit"
+              size="large"
+              @click="itemEdit"
+            >编辑</el-button>
+          </el-row>
+        </div>
+      </el-tab-pane>
+      <el-tab-pane label="删除">
+        <div style="height: 250px" />
+      </el-tab-pane>
+    </el-tabs>
+  </div>
+</template>
+
+<script setup>
+defineOptions({
+  name: 'OptionEdit'
+})
+import { ref } from 'vue'
+import { Edit } from '@element-plus/icons-vue'
+import { projectData } from '@/pinia/project/project'
+
+const data = projectData()
+// 数据
+
+const prompt = '注意：不选择类型或状态默认为添加,选择后默认为更新'
+const projectState = ref('')
+
+const fileType = ref('')
+
+const selectedState = ref('')
+
+const selectedType = ref('')
+
+// pinia数据
+data.getStateList()
+data.getTypeList()
+// 方法
+
+const itemEdit = () => {}
+</script>
+
+<style scoped lang="scss">
+
+</style>

web/src/view/projectManage/projectDetails/projectDetails.vue

@@ -109,13 +109,14 @@
                 <el-text size="large">项目文件列表</el-text>
               </el-col>
               <el-col
-                :span="3"
-                :offset="15"
+                :span="6"
+                :offset="12"
               >
                 <el-button
                   type="primary"
                   :icon="Edit"
-                >类型编辑
+                  @click="openOptionEdit"
+                >项目状态和文件类型编辑
                 </el-button>
               </el-col>
             </el-row>
@@ -136,6 +137,7 @@
                 v-model="fileType"
                 clearable
                 @change="changeFileType"
+                placeholder="项目状态"
               >
                 <el-option
                   v-for="item in fileTypeList"
@@ -189,12 +191,14 @@
               </el-button>
             </el-col>
           </el-row>
-          <el-row style="margin-top: 20px">
+          <el-row style="margin-top: 20px" >
             <el-col :span="24">
               <el-table
                 :data="fileList"
                 row-class-name="row-class"
                 border
+                height="560px"
+                stripe
               >
                 <el-table-column
                   prop="ID"
@@ -237,6 +241,15 @@
               </el-table>
             </el-col>
           </el-row>
+          <el-row justify="end">
+            <el-pagination
+                :page-size="10"
+                background
+                layout="prev, pager, next"
+                :total="fileTotal"
+                @change="changeFilePage"
+            />
+          </el-row>
         </el-card>
       </el-col>
     </el-row>
@@ -410,6 +423,13 @@
         </div>
       </template>
     </el-dialog>
+    <el-dialog
+        v-model="stateTypeShow"
+        title="状态和类型编辑"
+        width="40%"
+    >
+      <option-edit/>
+    </el-dialog>
   </div>
 </template>
 
@@ -420,7 +440,7 @@ import { getAllUsers } from '@/api/user'
 import { getFileType, queryFileList, createProjectFile, downloadProjectFile } from '@/api/file'
 import { Download, Upload, Delete, Search, RefreshLeft, Edit } from '@element-plus/icons-vue'
 import { ElMessage, ElMessageBox } from 'element-plus'
-
+import OptionEdit from './components/optionEdit.vue'
 defineOptions({
   name: 'ProjectDetails'
 })
@@ -448,6 +468,8 @@ const messagePopupShow = ref(false)
 const userList = reactive([])
 // 项目文件列表
 const fileList = reactive([])
+
+const fileTotal = ref(0)
 // 项目文件类型列表
 const fileTypeList = reactive([])
 // 项目文件类型
@@ -459,7 +481,7 @@ const uploadFileType = ref('')
 
 const uploadFileData = ref([])
 
-// const uploadFileList = ref([])
+const stateTypeShow = ref(false)
 
 // .............................................
 // 计算属性
@@ -484,6 +506,7 @@ onMounted(() => {
   projectMessage('LCZM202407161229')
   queryFileType()
   getProjectState()
+  queryFile()
   getAllUsers().then(res => {
     if (res.code === 0) {
       userList.push(...res.data)
@@ -499,11 +522,6 @@ const projectMessage = (code) => {
       data.CreatedAt = formatDate(data.CreatedAt)
       data.UpdatedAt = formatDate(data.UpdatedAt)
       Object.keys(data).forEach(key => {
-        if (key === 'files') {
-          // data[key].CreatedAt = formatDate(data[key].CreatedAt)
-          // data[key].UpdatedAt = formatDate(data[key].UpdatedAt)
-          fileList.push(...data[key])
-        }
         information[key] = data[key]
         editData[key] = data[key]
       })
@@ -544,8 +562,9 @@ const changeFileType = (value) => {
 const queryFile = () => {
   queryFileList(fileCondition).then(res => {
     if (res.code === 0) {
-      console.log(res.data)
-      fileList.push(...res.data)
+      fileTotal.value = res.data.total
+      fileList.length = 0
+      fileList.push(...res.data.list)
     }
   })
 }
@@ -553,6 +572,7 @@ const queryFile = () => {
 // 编辑基本信息
 const editBasicMessage = () => {
   const data = {
+    id: editData.ID,
     code: 'LCZM202407161229',
     name: editData.name,
     principal: editData.principal,
@@ -574,9 +594,15 @@ const editBasicMessage = () => {
     }
   }
   editProject(data).then(res => {
-    console.log(res)
     if (res.code === 0) {
-      console.log(res.data)
+      ElMessage({
+        message: '编辑成功',
+        type: 'success',
+        showClose: true,
+        duration: 2000
+      })
+      messagePopupShow.value = false
+      projectMessage('LCZM202407161229')
     }
   })
 }
@@ -684,6 +710,15 @@ const headSelect = () => {
 //
 const changeUrgency = () => {
 }
+
+const changeFilePage = (value) => {
+  fileCondition.pageInfo.page = value
+  queryFile()
+}
+
+const openOptionEdit = () => {
+  stateTypeShow.value = true
+}
 </script>
 
 <style scoped lang="scss">