更改

src/views/base/policy.vue

@@ -3,7 +3,7 @@
         <template #header>
             <div class="w-36">
                 <el-select v-model="searchForm.areaId" block clearable placeholder="请选择区域" size="large">
-                    <el-option v-for="item in areaType" :label="item.name" :value="item.key" />
+                    <el-option v-for="item in areaType" :key="item.id" :label="item.areaName" :value="item.id" />
                 </el-select>
             </div>
             <div class="w-36 ml-4">
@@ -53,7 +53,7 @@
         </template>
 
         <!-- 新增/编辑 -->
-        <HcDialog is-to-body bg-color="white" :show="rowModal" :title="formModel.id ? '编辑' : '新增'" widths="62rem" @save="rowModalSave" @close="rowModalClose">
+        <HcDialog is-to-body bg-color="white" :show="rowModal" :title="formModel.id ? '编辑' : '新增'" widths="62rem" :loading="submitLoading" @save="rowModalSave" @close="rowModalClose">
             <el-form ref="formRef" :model="formModel" :rules="formRules" label-position="left" label-width="auto" size="large">
                 <div class="flex">
                     <div class="flex-1 mr-4">
@@ -65,12 +65,11 @@
                         </el-form-item>
                         <el-form-item label="所属区域：" prop="areaId">
                             <el-select v-model="formModel.areaId" block>
-                                <el-option label="选项1" value="选项1" />
-                                <el-option label="选项2" value="选项2" />
+                                <el-option v-for="item in areaType" :key="item.id" :label="item.areaName" :value="item.id" />
                             </el-select>
                         </el-form-item>
-                        <el-form-item label="多个文件">
-                            <HcFormUpload :src="formModel.pdfUrl" @item="formItemClick" @upload="formItemUpload" @change="formItemChange" />
+                        <el-form-item label="多个文件" prop="pdfUrl">
+                            <HcFormUpload v-model="formModel.pdfUrl" :src="filename" type="list" :preview="false" @item="formItemClick" @upload="formItemUpload" @change="formItemChange" />
                         </el-form-item>
                     </div>
                     <div class="flex-1 ml-4">
@@ -82,21 +81,25 @@
             </el-form>
         </HcDialog>
 
-        <HcUploadFile ref="HcUploadFileRef" :options="UploadFileOptions" :params="{ projectId }" @success="HcUploadFileSuccess" @error="HcUploadFileEroor" />
+        <HcUploadFile ref="HcUploadFileRef" :options="UploadFileOptions" :params="{ projectId }" @finish="UploadFileFinish" @success="HcUploadFileSuccess" />
     </HcCard>
 </template>
 
 <script setup>
-import { onMounted, ref } from 'vue'
+import { onActivated, onMounted, ref } from 'vue'
 import { getTokenHeader } from '~src/api/request/header'
 import policyApi from '~api/base/policy.js'
 import { useAppStore } from '~src/store'
-import { getArrValue } from 'js-fast-way'
+import { formValidate, getArrValue } from 'js-fast-way'
+import { getAllCounty } from '~api/other'
 
 const useAppState = useAppStore()
 const projectId = ref(useAppState.getProjectId)
-
+onActivated(()=>{
+    getAreaType()
+})
 onMounted(()=>{
+   
     getTableData()
 })
 //上传配置
@@ -105,17 +108,23 @@ const UploadFileOptions = {
     headers: getTokenHeader(),
     url:'/api/blade-land/attachmentInfo/add-file',
     accept_tip:'只能上传doc或pdf文件',
-    accept:'application/pdf,.doc,.docx,application/msword',
+    accept:'application/pdf,.doc,.pdf,.docx,application/msword',
 }
 
 //项目类型
-const areaType = ref([
-    { name: '二级路', key: '二级路' },
-    { name: '国道', key: '国道' },
-    { name: '水利水电', key: '水利水电' },
-    { name: '市政', key: '市政' },
-])
-
+const areaType = ref([])
+//获取区域
+const getAreaType = async ()=>{
+    const { error, code, data } = await getAllCounty({
+        projectId: projectId.value,
+    })
+    if (!error && code === 200) {
+        areaType.value = getArrValue(data)
+       
+    } else {
+        areaType.value = []
+    }
+}
 //搜索表单
 const searchForm = ref({
     areaId: null, name: null, startDate: null, endDate: null,
@@ -145,12 +154,6 @@ const tableColumn = [
     { key: 'action', name: '操作', width: '220', align: 'center' },
 ]
 const tableData = ref([
-    { id: 1, key: 'YS-01', key1: 'xxxx', key2: 'xxxx', key3: '65632', key4: '' },
-    { id: 2, key: 'YS-01', key1: 'xxxx', key2: 'xxxx', key3: '65632', key4: '' },
-    { id: 3, key: 'YS-01', key1: 'xxxx', key2: 'xxxx', key3: '65632', key4: '' },
-    { id: 4, key: 'YS-01', key1: 'xxxx', key2: 'xxxx', key3: '65632', key4: '' },
-    { id: 5, key: 'YS-01', key1: 'xxxx', key2: 'xxxx', key3: '65632', key4: '' },
-    { id: 6, key: 'YS-01', key1: 'xxxx', key2: 'xxxx', key3: '65632', key4: '' },
 ])
 
 const getTableData = async () => {
@@ -178,29 +181,49 @@ const tableSelectionChange = (rows) => {
 //弹窗
 const rowModal = ref(false)
 const formRef = ref(null)
-const formModel = ref({ pdfUrl:'key1' })
+const formModel = ref({ list:[] })
 const formRules = {
     number: [{ required: true, message: '请输入编号', trigger: 'blur' }],
     name: [{ required: true, message: '请输入名称', trigger: 'blur' }],
     areaId: [{ required: true, message: '请选择所属区域', trigger: 'change' }],
     remark: [{ required: true, message: '请输入备注', trigger: 'blur' }],
+    pdfUrl:[{ required: true, message: '请上传文件', trigger: 'blur' }],
 }
 
 //新增
 const addRowClick = () => {
-    formModel.value = {}
+    formModel.value = { list:[] }
     rowModal.value = true
+    filename.value = ''
 }
 
 //编辑
 const editRowClick = (row) => {
     formModel.value = row
+    // filename.value=row.pdf
     rowModal.value = true
 }
 
 //保存
-const rowModalSave = () => {
-
+const submitLoading = ref(false)
+const rowModalSave = async () => {
+    console.log(formModel.value)
+    const res = await formValidate(formRef.value)
+    if (res) {
+        submitLoading.value = true
+        //发起请求
+        const form = formModel.value
+        form.projectId = projectId.value
+        const { error, code, msg } = await policyApi.addOrUpdate(form)
+        //判断状态
+        submitLoading.value = false
+        if (!error && code === 200) {
+            window.$message?.success(msg)
+            rowModal.value = false
+            getTableData()
+            
+        } 
+    }
 }
 
 //关闭弹窗
@@ -211,19 +234,14 @@ const rowModalClose = () => {
 
 //上传
 const formItemUpload = () => {
+    HcUploadFileRef?.value?.cancelUpload()
     HcUploadFileRef.value?.selectFile()
 }
 
-// 文件上传成功的回调
-const HcUploadFileSuccess = (res) => {
-    console.log('文件上传成功', res)
-}
-//文件上传失败HcUploadFileEroor
-const HcUploadFileEroor = ({ resData }) => {
-    console.log('文件失败', resData.response.data.msg)
-}
-const formItemClick = ({ item, index }) => {
 
+const formItemClick = async ({ item, index }) => {
+    console.log(item, 'item')
+   
 }
 
 //文件变化
@@ -231,4 +249,27 @@ const formItemChange = (src) => {
     console.log(src, 'src')
     formModel.value.pdfUrl = src
 }
+//文件上传完成
+const UploadFileFinish = ()=>{
+    HcUploadFileRef?.value.setModalShow(false)
+}
+const filename = ref('')
+// 文件上传成功的回调
+const HcUploadFileSuccess = ({ resData }) => {
+    console.log(resData, 'resData')
+    formModel.value.list.push(resData)
+    const { domainPdfUrl, name } = resData
+    if (formModel.value.pdfUrl) {
+        formModel.value.pdfUrl = formModel.value.pdfUrl + ',' + domainPdfUrl
+    } else {
+        formModel.value.pdfUrl = domainPdfUrl
+    }
+    if (filename.value) {
+        filename.value = filename.value + ',' + name
+        
+    } else {
+        filename.value = name
+    }
+   
+}
 </script>