src/views/deliveryRecord/components/emailEdits.vue

@@ -1,87 +1,168 @@
 <template>
-    <div>
-        <el-dialog title="邮件内容" :visible="emailVidable"  @close="cancel" center
-            :distroy-on-close="true">
-            <div>
-                <el-form>
-                    <el-col :span="24">
-                        <el-form-item label="邮件主题：" label-width="100px">
-                           <div>主题</div>
-                        </el-form-item>
-                    </el-col>
-                     <el-col :span="12">
-                        <el-form-item label="收件人：" label-width="100px">
-                           <div>收件人</div>
-                        </el-form-item>
-                    </el-col>
-                     <el-col :span="12">
-                        <el-form-item label="发件人：" label-width="100px">
-                           <div>发件人</div>
-                        </el-form-item>
-                    </el-col>
-                    <el-col :span="24">
-                        <el-form-item label="邮件附件：" label-width="100px">
-                           <div  style="color: blue; cursor: pointer" @click="viewAttachments">附件</div>
-                        </el-form-item>
-                    </el-col>
-                    <el-col :span="24">
-                        <el-form-item label="邮件正文：" label-width="100px">
-                            <el-input type="textarea" :rows="4" placeholder="请输入内容" v-model="sendData"></el-input>
-                        </el-form-item>
-                    </el-col>
-                </el-form>
-                
-            </div>
-            <div slot="footer" class="dialog-footer">
-                <el-button @click="cancel" class="endbutton1" round><span>取 消</span></el-button>
-                <el-button @click="submitSend" class="endbutton1" type="primary" round><span>确 认</span></el-button>
-            </div>
-        </el-dialog>
-    </div>
+  <div>
+    <el-dialog
+      title="邮件内容"
+      :visible="emailVidable"
+      @close="cancel"
+      center
+      :distroy-on-close="true"
+    >
+      <div>
+        <el-form>
+          <el-col :span="24">
+            <el-form-item label="邮件主题：" label-width="100px">
+              <div>{{ emailRow.mailSubject }}</div>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="收件人：" label-width="100px">
+              <div>{{ emailRow.mailAddress }}</div>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="发件人：" label-width="100px">
+              <div>{{ emailRow.mailFromAddress }}</div>
+            </el-form-item>
+          </el-col>
+          <el-col :span="24">
+            <el-form-item label="邮件附件：" label-width="100px">
+              <div
+                style="color: blue; cursor: pointer"
+                v-for="(item, index) in emailRow.caseAttachList"
+                :key="index"
+                @click="viewAttachments(item.annexPath)"
+              >
+                {{ item.annexName }}
+              </div>
+            </el-form-item>
+          </el-col>
+          <el-col :span="24">
+            <el-form-item label="邮件上传：" label-width="100px">
+              <el-upload
+                class="upload-demo"
+                accept=".doc,.docx,.pdf"
+                ref="upload"
+                :action="UploadUrl()"
+                :headers="headers"
+                :data="filedata"
+                :on-preview="handlePreview"
+                :on-remove="handleRemove"
+                :limit="1"
+                :on-change="beforeUpload"
+                :on-success="handlSuccess"
+                :file-list="fileList"
+              >
+                <el-button
+                  slot="trigger"
+                  size="small"
+                  type="primary"
+                  >选取文件</el-button
+                >
+                <div slot="tip" class="el-upload__tip">
+                  只能上传.doc，docx，pdf文件
+                </div>
+              </el-upload>
+            </el-form-item>
+          </el-col>
+          <el-col :span="24">
+            <el-form-item label="邮件正文：" label-width="100px">
+              <el-input
+                type="textarea"
+                :rows="4"
+                placeholder="请输入内容"
+                v-model="sendData"
+              ></el-input>
+            </el-form-item>
+          </el-col>
+        </el-form>
+      </div>
+      <div slot="footer" class="dialog-footer">
+        <el-button @click="cancel" class="endbutton1" round
+          ><span>取 消</span></el-button
+        >
+        <el-button @click="submitSend" class="endbutton1" type="primary" round
+          ><span>确 认</span></el-button
+        >
+      </div>
+    </el-dialog>
+  </div>
 </template>
 
 <script>
 import {
-    updateSendContent,update
+  updateSendContent,
+  update,
 } from "@/api/deliveryRecord/deliveryRecord.js";
+import { getToken } from "@/utils/auth";
 export default {
-    props: ["emailVidable", "emailRow","queryParams"],
-    data() {
-        return {
-            sendData:'',
-            fileURL: window.location.origin + "/API",
-        };
+  props: ["emailVidable", "emailRow", "queryParams"],
+  data() {
+    return {
+      sendData: "",
+      fileURL: window.location.origin + "/API",
+      headers: {
+        Authorization: "Bearer " + getToken(),
+      },
+      filedata: {
+        annexType: 13,
+      },
+      fileList: [],
+      files:[],
+    };
+  },
+  watch: {
+    emailVidable(val) {
+      if (val) {
+        console.log(this.emailRow);
+        this.sendData = this.emailRow.mailContent;
+      }
     },
-    watch: {
-        emailVidable(val){
-            if(val){
-                this.sendData = this.emailRow.mailContent;
-            }
-        }
+  },
+  methods: {
+    cancel() {
+      this.$emit("cancelEmail");
     },
-    methods: {
-        cancel() {
-            this.$emit("cancelEmail");
-        },
-        submitSend() {
-            console.log(this.emailRow.mailContent)
-            this.updateSendContentFn({
-                id:this.emailRow.id,
-                mailContent:this.sendData
-            })
-        },
-        updateSendContentFn(data){
-            update(data).then(res=>{
-                this.$message.success('更新成功');
-                this.$emit("cancelEmail");
-                this.$emit('getList',this.queryParams);
-            })
-        },
-        // 查看附件下载附件
-        viewAttachments(val){
-            window.open(this.fileURL + val);
-        }
+    submitSend() {
+      console.log(this.emailRow.mailContent);
+      this.updateSendContentFn({
+        id: this.emailRow.id,
+        mailContent: this.sendData,
+        caseAttachList:[{annexId:this.files.annexId}],
+        
+      });
+     
     },
+    updateSendContentFn(data) {
+        console.log(data)
+      update(data).then((res) => {
+        
+        this.$message.success("更新成功");
+        this.$emit("cancelEmail");
+        this.$emit("getList", this.queryParams);
+         this.$refs.upload.clearFiles(); // 清除文件列表
+      });
+    },
+    // 查看附件下载附件
+    viewAttachments(val) {
+      window.open(this.fileURL + val);
+    },
+    /**上传地址*/
+    UploadUrl() {
+      return window.location.origin + "/API/common/upload";
+    },
+    handlePreview(file) {},
+    handleRemove(file, fileList) {},
+    beforeUpload(flie, fileList) {
+
+    },
+    handlSuccess(res, file) {
+        
+      const fileSuccess = [{ annexId: res.annexId, annexType: res.annexType,annexName:res.newFileName,annexPath:res.fileName,onlyOfficeFileId:res.onlyOfficeFileId}]
+      this.emailRow.caseAttachList = fileSuccess
+      this.files = res
+       console.log(res)
+    },
+  },
 };
 </script>