first commit

src/utils/getHost.js

@@ -13,6 +13,13 @@ export function getUploadUrl() {
     return  '/data-collect-api/api/upload/picture'
   }
 }
+export function getUploadPdf() {
+  if (process.env.NODE_ENV === 'development') {
+    return '/dev/api/getUploadUrl'
+  } else {
+    return  '/data-collect-api/api/getUploadUrl'
+  }
+}
 export function getServerUrl() {
   if (process.env.NODE_ENV === 'development') {
     return '/dev/api'

src/views/claimTasks/user/incomplete/details.vue

@@ -51,12 +51,12 @@
                 <div>备注:</div>
               </el-col>
               <el-col :span="22">
-                <el-input  v-model="item.remark" placeholder="请输入备注(选填)" clearabl :disabled="true"></el-input>
+                <el-input  v-model="item.remark" placeholder="请输入备注" clearabl :disabled="true"></el-input>
               </el-col>
             </el-row>
         </el-form-item>
         <el-form-item label="收集备注" prop="remark">
-          <el-input type="textarea"  v-model="state.formItem.addItem.remark" placeholder="请输入备注" clearable></el-input>
+          <el-input type="textarea"  v-model="state.formItem.addItem.remark" placeholder="请输入收集备注" clearable></el-input>
         </el-form-item>
         <el-form-item label="网页截图">
           <div style="border: 1px solid #ccc; width: 100%;">
@@ -75,6 +75,20 @@
           />
         </div>
         </el-form-item>
+        <el-form-item label="上传文件">
+            <el-upload
+              class="upload-demo"
+              :action="state.server_pdf"
+              :on-success="handleFileSuccess"
+              multiple
+              :limit="10"
+              :on-exceed="onexceed"
+              :before-remove="beforeRemove"
+              :file-list="state.formItem.fileListPdf">
+              <el-button size="small" type="primary">点击上传</el-button>
+              <div slot="tip" class="el-upload__tip" style="margin-left: 10px;">只能上传pdf文件</div>
+            </el-upload>
+        </el-form-item>
       </el-form>
       <template #footer>
         <el-row style="width: 100% !important;">
@@ -104,8 +118,8 @@ import '@wangeditor/editor/dist/css/style.css' // 引入 css
 import { Editor, Toolbar } from '@wangeditor/editor-for-vue'
 
 import { claimTasksApi } from '/@/api/claimTasks'
-import { ElMessage } from 'element-plus';
-import { getUploadUrl } from "/@/utils/getHost.js";
+import { ElMessage,ElMessageBox } from 'element-plus';
+import { getUploadUrl,getServerUrl } from "/@/utils/getHost.js";
 // 定义子组件向父组件传值/事件
 const emit = defineEmits(['refresh']);
 
@@ -113,6 +127,7 @@ const emit = defineEmits(['refresh']);
 const dialogFormRef = ref();
 const router = useRouter();
 const state = reactive({
+  server_pdf:getServerUrl()+'/uploadPdf',
   userId: null,
   index:0,
   userIndex:0,
@@ -143,7 +158,7 @@ const state = reactive({
         ],
         editorImgList:[], // 富文本里的内容
         editorContent:'', // 富文本所有内容
-        
+        fileListPdf:[], // 附件
   },
 });
 // 编辑器实例，必须用 shallowRef
@@ -193,6 +208,25 @@ const handleCreated = (editor) => {
     editorRef.value = editor // 记录 editor 实例，重要！
 }
 
+/** 文件上传成功处理 */
+const handleFileSuccess = (response, file, fileList) => {
+    ElMessage.success('上传成功！')
+    state.formItem.fileListPdf.push(response.data.url)
+    console.log(state.formItem.fileListPdf)
+};
+
+// 删除文件
+const beforeRemove = (file, fileList) => {
+  console.log(state.formItem.fileListPdf)
+  let index = state.formItem.fileListPdf.map(item => item).indexOf(file.response.data.url);
+    state.formItem.fileListPdf.splice(index,1)
+};
+
+// 文件数量限制
+const onexceed = (response, file, fileList) => {
+	ElMessage.error('仅可上传10个文件');
+};
+
 // 数据不可采集
 const notCollectible = () =>{
   const editor = editorRef.value;
@@ -428,6 +462,7 @@ const wipeData = () => {
   state.formItem.userFilled = [];
   state.formItem.editorImgList = [];
   state.formItem.editorContent = ''; 
+  state.formItem.fileListPdf = [];
 };