feature(遵义人民):预约申请资料上传

src/api/platform/index.js

@@ -11,3 +11,7 @@ export function getPlatFormList(data) {
 export function create(data) {
     return request.postRequest(platformPath,'PlatPlatformAppoint','Create', data)
 }
+
+export function createFile(data) {
+    return request.postRequest(platformPath,'PlatPlatformAppoint','CreateFile', data)
+}

src/views/PersonalCenter/file-upload.vue

@@ -0,0 +1,155 @@
+<template>
+  <div>
+    <el-dialog
+        :title="title"
+        :visible.sync="state.isShowDialog"
+        :close-on-click-modal="false"
+        width="1200px"
+    >
+      <el-form
+          ref="editFormRef"
+          :model="form"
+          label-width="100px"
+          size="mini"
+          label-position="top"
+          :rules="rules"
+          closeable
+      >
+        <div class="form-group">
+          <el-row :gutter="20" class="form-row-wrap">
+            <el-col :span="12">
+              <el-form-item label="资料上传" prop="fileList">
+                <el-upload
+                    class="upload-demo"
+                    action="http://192.168.0.218:9933/weedfs/upload"
+                    multiple
+                    v-model:file-list="form.fileList"
+                    :before-upload="beforeAvatarFileUpload"
+                    :on-success="(res, uploadFile) => handleSuccess(res, uploadFile)"
+                    :on-remove="(res, uploadFile) => handleRemove(res, uploadFile)"
+                >
+                  <el-button size="small" type="primary">点击上传</el-button>
+                  <div slot="tip" class="el-upload__tip">文件大小不能超过20MB</div>
+                </el-upload>
+              </el-form-item>
+            </el-col>
+            <!-- END -->
+          </el-row>
+        </div>
+        <!-- END -->
+      </el-form>
+      <template #footer>
+        <span class="dialog-footer">
+          <el-button @click="onCancel" size="small">取 消</el-button>
+          <el-button type="primary" @click="subAdd" size="small">
+            提 交
+          </el-button>
+        </span>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+
+<script lang="ts">
+import { getToken } from "@/utils/auth";
+import { createFile } from "@/api/platform"
+import to from "await-to-js";
+import { mapGetters } from "vuex";
+export default {
+  name: "FrontendWebTest",
+  computed: {
+    ...mapGetters(["userInfo"]),
+  },
+  data() {
+    return {
+      title: "遵义医科大学附属医院临床医学公共实验中心-资料上传",
+      form: {
+        appointId: 0,
+        fileList: [],
+      },
+      state: {
+        isShowDialog: false,
+        loading: false,
+      },
+      rules: {
+        fileList: [{ required: true, message: "请上传资料", trigger: "change" }],
+      },
+    };
+  },
+  methods: {
+    async openDialog(id) {
+      // 校验token
+      const token = getToken();
+      if (!token) {
+        return this.$router.push("/login?redirect=/technical-plat/index");
+      }
+
+      this.form = {
+        appointId: id,
+        fileList: [],
+      }
+      this.state.isShowDialog = true;
+    },
+    beforeAvatarFileUpload(file) {
+      let isLt10m = file.size / 1024 / 1024 / 20 < 1
+      if (!isLt10m) {
+        this.$message.error('上传文件大小不能超过 20MB!')
+        return false
+      }
+      return true
+    },
+    handleSuccess(res, uploadFile) {
+      this.form.fileList.push(uploadFile)
+    },
+    handleRemove(res, uploadFile) {
+      this.form.fileList = uploadFile
+    },
+    onCancel() {
+      this.$refs.editFormRef.clearValidate();
+      this.$refs.editFormRef.resetFields();
+      this.state.isShowDialog = false;
+    },
+    subAdd() {
+      this.$refs.editFormRef.validate(async valid => {
+        if(valid) {
+          this.form.fileList = this.form.fileList.map(item => {
+            return {
+              fileName: item.name,
+              fileUrl: item.response.Data,
+            }
+          })
+          const [err] = await to(createFile(this.form));
+          if(err) {
+            this.$message.warning('操作失败')
+            return
+          }
+          this.$message.success("操作成功");
+          this.state.isShowDialog = false;
+        }
+      })
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+:deep(.el-dialog__body) {
+  padding-top: 10px;
+}
+.appoint-section {
+  min-height: 450px;
+}
+.exper-info-list {
+  h3 {
+    color: #2c405e;
+    font-weight: bold;
+  }
+  .label {
+    width: 100px;
+  }
+}
+.step-tit {
+  color: #2c405e;
+  font-weight: bold;
+}
+</style>

src/views/PersonalCenter/work.vue

@@ -7,6 +7,7 @@
           <div slot="header"
                class="header">
             <h4>科研仪器</h4>
+            <el-button @click="openUploadDialog">上传</el-button>
           </div>
           <ul class="cage-list">
             <li v-for="v in instrList"
@@ -202,6 +203,7 @@
         </el-card>
       </el-col>
     </el-row>
+    <FileUploadDialog ref="fileUploadDialogRef"></FileUploadDialog>
   </div>
 </template>
 
@@ -224,6 +226,7 @@ import moment from "moment";
 import to from "await-to-js";
 import { getToken } from "@/utils/auth";
 import PersonalInfoDialog from "@/components/PersonalInfo";
+import FileUploadDialog from "@/views/PersonalCenter/file-upload.vue";
 export default {
   name: "PersonalCenter",
   components: {
@@ -232,6 +235,7 @@ export default {
     RightContent,
     FullCalendar,
     PersonalInfoDialog,
+    FileUploadDialog,
   },
   data() {
     return {
@@ -415,7 +419,6 @@ export default {
           .format("YYYY-MM-DD HH:mm:ss");
         startTimeEnd = this.getMonthDate()[1];
       }
-      console.log(startTimeStart);
       const [err, res] = await to(
         getInstrListByUser({
           startTimeStart,
@@ -615,6 +618,10 @@ export default {
       this.searchForm.pageNum = val;
       this.getAppointList();
     },
+    openUploadDialog() {
+      console.log('传递参数:id为申请单id')
+      this.$refs.fileUploadDialogRef.openDialog(1);
+    }
   },
 };
 </script>
@@ -917,4 +924,4 @@ export default {
   align-items: center;
   justify-content: flex-end;
 }
-</style>
+</style>