详情添加附件和备注

src/api/wms/file/index.ts

@@ -0,0 +1,12 @@
+import request from '@/config/axios'
+
+// 查询变更记录列表
+export const getFileList = async (params) => {
+  return await request.get({ url: `/infra/file/list`, params })
+}
+
+// 删除库区
+export const deleteFile = async (id: number) => {
+  return await request.delete({ url: `/infra/file/delete?id=` + id })
+}
+

src/components/Annex/src/Annex.vue

@@ -3,21 +3,22 @@
   <div class="annex">
     <div class="title flex items-center">
       <div class="title-txt">附件</div>
-      <UploadFile :isShowFile="false" :isShowTip="false" title="添加附件" :upData="upData"/>
+      <UploadFile :isShowFile="false" :isShowTip="false" title="添加附件" :upData="upData"
+        @update:modelValue="handleAnnexSuccess" />
     </div>
     <div class="list">
-      <div class="item flex items-start" v-for="(item, index) in data.annexList" :key="index">
+      <div class="item flex items-start" v-for="(item, index) in annexData.annexList" :key="index">
         <Icon icon="fa:file-text-o" color="#409eff" size="30" class="mt-4px" />
         <div class="item-center">
-          <div class="item-title">{{ item.title}}</div>
+          <div class="item-title">{{ item.name }}</div>
           <div class="info mt-6px">
             <div class="info-txt">
-              <div>{{ item.size }}</div>
-              <div>来自 {{ item.people }}</div>
+              <div>{{ item.size }}KB</div>
+              <div>来自 {{ item.nickname }}</div>
             </div>
-            <Icon icon="ep:delete" class="cursor-pointer" size="18" @click="deleteAnnex(item)"/>
+            <Icon icon="ep:delete" class="cursor-pointer" size="18" @click="deleteAnnex(item.id)" />
           </div>
-          <div class="time mt-6px ">{{ item.time }}</div>
+          <div class="time mt-6px ">{{ formatDate(item.createTime) }}</div>
         </div>
       </div>
     </div>
@@ -26,6 +27,7 @@
 
 <script lang="ts" setup>
 import UploadFile from '@/components/UploadFile/src/UploadFile.vue'
+import { formatDate } from '@/utils/formatTime'
 const message = useMessage() // 消息弹窗
 const { t } = useI18n() // 国际化
 defineComponent({
@@ -33,7 +35,7 @@ defineComponent({
 })
 // 接受父组件参数
 const props = defineProps({
-  data: {
+  annexData: {
     type: Object,
     required: true
   },
@@ -43,22 +45,16 @@ const props = defineProps({
   },
 })
 // 子传父的时候需要先定义好emit这个方法
-const emit = defineEmits(['handleImport','deleteAnnexSuccess'])
+const emit = defineEmits(['handleAnnexSuccess', 'deleteAnnexSuccess'])
 // 添加附件
-const handleImport =()=>{
-  emit('handleImport')
+const handleAnnexSuccess = () => {
+  emit('handleAnnexSuccess')
 }
 
 // 删除附件
-const deleteAnnex =async (item) => {
-  try {
-    // 删除的二次确认
-    await message.delConfirm()
-    // 发起删除
-    // await RoleApi.deleteRole(id)
-    message.success(t('common.delSuccess'))
-    emit('deleteAnnexSuccess')
-  } catch { }
+const deleteAnnex = async (id) => {
+
+  emit('deleteAnnexSuccess', id)
 }
 
 </script>

src/components/ChangeRecord/src/ChangeRecord.vue

@@ -10,7 +10,7 @@
           <template #icon>
             <slot>
               <Icon color="#9e9e9e"
-                :icon="item.type == 1 ? 'ep:document-add' : item.type == 2 ? 'ep:edit' : item.type == 3 ? 'ep:document' : ''"
+                :icon="item.type == 1 ? 'ep:document-add' : item.type == 2 ? 'ep:edit' : item.type == 3 ? 'ep:delete' : item.type == 4 ? 'fa:edit' : item.type == 5 ? 'ep:upload' : item.type == 6 ? 'ep:document-delete' : item.type == 7 ? 'ep:chat-line-square' : item.type == 8 ? 'ep:delete' : ''"
                 class="cursor-pointer" size="20" />
             </slot>
           </template>
@@ -23,16 +23,29 @@
             <slot>
               <div class="dic color-#303133" v-if="item.type == 1">
                 {{ item.nickname }} {{ item.content }}
-                <!-- {{ item.nickname }} <span>创建了</span> 记录 -->
               </div>
               <div class="dic color-#303133" v-else-if="item.type == 2">
                 {{ item.nickname }} {{ item.content }}
-                <!-- {{ item.nickname }} <span>修改了</span> 状态 -->
               </div>
               <div class="dic color-#303133" v-else-if="item.type == 3">
                 {{ item.nickname }} {{ item.content }}
-                 <!-- <span>添加了</span> 附件 -->
               </div>
+              <div class="dic color-#303133" v-else-if="item.type == 4">
+                {{ item.nickname }} {{ item.content }}
+              </div>
+              <div class="dic color-#303133" v-else-if="item.type == 5">
+                {{ item.nickname }} {{ item.content }}
+              </div>
+              <div class="dic color-#303133" v-else-if="item.type == 6">
+                {{ item.nickname }} {{ item.content }}
+              </div>
+              <div class="dic color-#303133" v-else-if="item.type == 7">
+                {{ item.nickname }} {{ item.content }}
+              </div>
+              <div class="dic color-#303133" v-else-if="item.type == 8">
+                {{ item.nickname }} {{ item.content }}
+              </div>
+
               <!-- <div class="tips" v-if="item.type == 2">
                 <span class="color-#f56c6c" style="text-decoration:line-through">原值</span>><span
                   class="color-#67c23a">新值</span>
@@ -102,6 +115,7 @@ const downFile = (cur)=>{
   font-size: 14px;
   margin-top: 6px;
 }
+
 .file {
   .file-text {
     margin-left: 6px;

src/components/Detail/src/Detail.vue

@@ -25,7 +25,7 @@
       </ContentWrap>
       <ContentWrap class="w-[27%] ml-16px">
         <!-- 附件组件 -->
-        <Annex :data="annexData" @handleImport="handleImport" @deleteAnnex="deleteAnnexSuccess" :upData="remarksData.data"/>
+        <Annex :annexData="annexData" @handleAnnexSuccess="handleAnnexSuccess" @deleteAnnexSuccess="deleteAnnexSuccess" :upData="remarksData.data"/>
         <!-- 备注组件 -->
         <Remarks :remarksData="remarksData"  class="mt-20px"
           @remarksSubmitScuess="remarksSubmitScuess" />
@@ -42,6 +42,10 @@ import Remarks from '@/components/Remarks/src/Remarks.vue'
 import ChangeRecord from '@/components/ChangeRecord/src/ChangeRecord.vue'
 import Tabs from '@/components/Tabs/src/Tabs.vue'
 import * as DetailApi from '@/api/wms/detail'
+import * as FileApi from '@/api/wms/file'
+
+const message = useMessage() // 消息弹窗
+const { t } = useI18n() // 国际化
 
 
 defineOptions({ name: 'Detail' })
@@ -99,17 +103,7 @@ if (tabsList.value && tabsList.value.length > 0) {
 
 // 附件默认数据
 const annexData = reactive({
-  annexList: [{
-    title: '文件名文件名2023-12-12.docx',
-    size: '150.02KB',
-    people: '贾先生',
-    time: '2023年5月6日 17:16:00',
-  }, {
-    title: '文件名文件名2023-12-15.docx',
-    size: '242KB',
-    people: '张张',
-    time: '2022年12月12日 17:16:00',
-  }]
+  annexList: []
 })
 
 // 备注数据
@@ -142,29 +136,33 @@ const changeRecordData = reactive({
   }]
 })
 const detailData = ref("")//详情数据
-
-// 导入成功之后
-const importSuccess = () => {}
-
-/** 搜索按钮操作 */
-const handleQuery = () => {
-  importFormRef.value.open()
+// 获取附件列表篇
+const getFileList = async () => {
+  detailLoading.value = true
+  try {
+    annexData.annexList = await FileApi.getFileList(remarksData.data)
+  } finally {
+    detailLoading.value = false
   }
-
-/** 重置按钮操作 */
-const resetQuery = () => {
-  queryParams.pageNo = 1
-  queryFormRef.value.resetFields()
 }
+/** 添加附件 */
+const handleAnnexSuccess = () => {
+  getFileList()
+  getChangeRecordList()
 
-/** 用户导入 */
-const importFormRef = ref()
-const handleImport = () => {
-  importFormRef.value.open()
 }
 // 删除附件成功之后所走的方法
-const deleteAnnexSuccess = async () => {
+const deleteAnnexSuccess = async (id) => {
   console.log('删除成功');
+  try {
+    // 删除的二次确认
+    await message.delConfirm()
+    // 发起删除
+    await FileApi.deleteFile(id)
+    message.success(t('common.delSuccess'))
+    getFileList()
+    getChangeRecordList()
+  } catch { }
 }
 
 // Tabs当前选择
@@ -192,6 +190,7 @@ const openDetail = async (row: any, titleName: any, titleValue: any, tableName:
     try {
       detailData.value = row
       getRemarkList()
+      getFileList()
       getChangeRecordList()
 
     } finally {