feat: "合同管理"

src/components/tall/task/ContractManagement.vue

@@ -1,75 +1,96 @@
 <template>
   <div class="task-form bg-white border-radius-10">
-    <a-form ref="formRef" :model="topicContractFormData">
-      <a-form-item>
-        <label class="color-3">合同名称</label>
-        <a-input v-model:value="topicContractFormData.name" placeholder="合同名称" />
-      </a-form-item>
-
-      <a-form-item>
-        <label class="color-3">合同编号</label>
-        <a-input v-model:value="topicContractFormData.number" placeholder="合同编号" />
-      </a-form-item>
-
-      <a-form-item>
-        <label class="color-3">合同甲方/委托方</label>
-        <a-input v-model:value="topicContractFormData.firstParty" placeholder="合同甲方/委托方" />
-      </a-form-item>
-
-      <a-form-item>
-        <label class="color-3">合同扫描</label>
-        <a-upload-dragger
-          v-model:fileList="fileList"
-          name="files"
-          :multiple="true"
-          :action="action"
-          :headers="headers"
-          :accept="'.pdf'"
-          @change="handleChange"
-        >
-          <p class="ant-upload-drag-icon">
-            <inbox-outlined></inbox-outlined>
-          </p>
-          <p class="ant-upload-text color-3 font-14">点击或拖拽文件到区域内上传交付物</p>
-          <p class="ant-upload-hint color-c">格式：pdf</p>
-        </a-upload-dragger>
-      </a-form-item>
+    <a-form>
+      <div v-for="(item, index) in questionList" :key="index">
+        <template v-if="item.type === 1">
+          <a-form-item>
+            <label class="color-3">{{ item.question }}</label>
+            <a-input v-model:value="item.con" :placeholder="item.question" />
+          </a-form-item>
+        </template>
+
+        <template v-if="item.type === 2">
+          <a-form-item>
+            <label class="color-3">{{ item.question }}</label>
+            <a-textarea v-model:value="item.con" :placeholder="item.question" />
+          </a-form-item>
+        </template>
+
+        <template v-if="item.type === 3"> </template>
+
+        <template v-if="item.type === 4"> </template>
+
+        <template v-if="item.type === 5"> </template>
+
+        <template v-if="item.type === 6">
+          <a-form-item>
+            <label class="color-3">{{ item.question }}</label>
+            <a-date-picker v-model:value="item.date" />
+          </a-form-item>
+        </template>
+
+        <template v-if="item.type === 7">
+          <a-form-item>
+            <label class="color-3">{{ item.question }}</label>
+            <a-upload-dragger
+              v-model:fileList="item.files"
+              name="files"
+              :multiple="true"
+              :action="action"
+              :headers="headers"
+              :accept="'.pdf'"
+              :before-upload="beforeUpload(index)"
+              @change="handleChange"
+            >
+              <p class="ant-upload-drag-icon">
+                <inbox-outlined></inbox-outlined>
+              </p>
+              <p class="ant-upload-text color-3 font-14">点击或拖拽文件到区域内上传交付物</p>
+              <p class="ant-upload-hint color-c">格式：pdf</p>
+            </a-upload-dragger>
+          </a-form-item>
+        </template>
+      </div>
 
       <a-form-item class="text-right">
-        <a-button type="primary" html-type="submit" @click="onSubmit">上传合同扫描件</a-button>
+        <a-button type="primary" html-type="submit" @click="onSubmit">上传中期检查报告</a-button>
       </a-form-item>
     </a-form>
   </div>
 </template>
 
 <script setup>
-import { ref, computed, toRaw } from 'vue';
+import { ref, computed } from 'vue';
 import { useStore } from 'vuex';
+import dayjs from 'dayjs';
 import { InboxOutlined } from '@ant-design/icons-vue';
 import { uploadImg } from 'apis';
 
 const store = useStore();
-const formRef = ref(null);
+// 项目信息
 const sessionProject = sessionStorage.getItem('project');
-const projectId = computed(() => store.getters['projects/projectId']);
+// 上传文件相关
 const token = computed(() => store.getters['user/token']);
 const headers = { Authorization: `Bearer ${token.value}` };
 const action = uploadImg;
-const fileList = ref([]);
-
+// 查找、提交相关
+const projectId = computed(() => store.getters['projects/projectId']); // 项目ID
+const code = computed(() => store.state.task.label); // code
+const questionList = ref([]);
+// 当前操作的问题下标
+const currIndex = ref(null);
+
+// 更新项目ID
 if (sessionProject) {
   const project = JSON.parse(sessionProject);
   store.commit('projects/setProject', project);
 }
 
-const topicContractFormData = ref({
-  projectId: projectId.value,
-  code: '',
-  name: '',
-  number: '',
-  firstParty: '',
-  fileIdList: [],
-});
+getDataByCode();
+
+const beforeUpload = index => {
+  currIndex.value = index;
+};
 
 const handleChange = info => {
   const resFileList = [...info.fileList];
@@ -101,26 +122,92 @@ const handleChange = info => {
     return file;
   });
 
-  fileList.value = arr.value;
+  questionList.value[currIndex.value].files = arr.value;
 };
 
-const onSubmit = () => {
-  fileList.value.forEach(item => {
-    // let obj = {
-    //   fileId: item.id,
-    //   fileName: item.name,
-    //   filePathL: item.url
-    // }
+const onSubmit = async () => {
+  const params = {
+    param: {
+      code: code.value,
+      projectId: projectId.value,
+      questionAndAnswerList: [],
+    },
+  };
+
+  const arr = [];
+  questionList.value.forEach(item => {
+    const obj = {
+      questionId: item.questionId,
+      answerList: [],
+    };
+
+    if (item.type === 1 || item.type === 2) {
+      obj.answerList.push(item.con);
+    }
 
-    // topicContractFormData.value.fileList.push(obj);
-    topicContractFormData.value.fileIdList.push(item.id);
-  });
+    if (item.type === 6) {
+      obj.answerList.push(dayjs(item.date).format('x'));
+    }
 
-  // const params = { param: topicContractFormData.value };
+    if (item.type === 7) {
+      item.files.forEach(val => {
+        const file = {
+          id: val.id,
+          name: val.name,
+          url: val.url,
+        };
+        obj.answerList.push(JSON.stringify(file));
+      });
+    }
+    arr.push(obj);
+  });
 
-  // saveSubExperiment(params);
-  console.log('submit!', toRaw(topicContractFormData.value));
+  params.param.questionAndAnswerList = arr;
+  await store.dispatch('task/submitAnswer', params);
+  getDataByCode();
 };
+
+async function getDataByCode() {
+  const params = {
+    param: {
+      code: code.value,
+      projectId: projectId.value,
+      intellectualId: null,
+    },
+  };
+  const data = await store.dispatch('task/getByCode', params);
+
+  data.forEach(item => {
+    if (item.type === 1 || item.type === 2) {
+      item.con = '';
+
+      if (item.answerList.length > 0) {
+        item.con = item.answerList[0].answer;
+      }
+    }
+
+    if (item.type === 6) {
+      item.date = null;
+
+      if (item.answerList.length > 0) {
+        item.date = dayjs(Number(item.answerList[0].answer)).format('YYYY-MM-DD');
+        item.date = dayjs(item.date, 'YYYY-MM-DD');
+      }
+    }
+
+    if (item.type === 7) {
+      item.files = [];
+
+      if (item.answerList.length > 0) {
+        item.answerList.forEach(val => {
+          val.answer = JSON.parse(val.answer);
+          item.files.push(val.answer);
+        });
+      }
+    }
+  });
+  questionList.value = data;
+}
 </script>
 
 <style scoped>