更新

src/api/user.js

@@ -33,3 +33,11 @@ export function logout(data) {
   })
 }
 
+export function policy(data) {
+  return request({
+    url: '/api-web/getUploadSign',
+    method: 'post',
+    data
+  })
+}
+

src/components/VueFormMaking/components/Upload/file.vue

@@ -13,7 +13,7 @@
       :data="uploadData"
       :file-list="dataModel"
       :disabled="element.options.disabled"
-      :style="{'width': element.options.width}"
+      :style="{ width: element.options.width }"
     >
       <div v-if="!preview">
         <el-button size="small" type="primary">点击上传</el-button>
@@ -25,38 +25,40 @@
 
 <script>
 export default {
-  name: 'FileUpload',
+  name: "FileUpload",
   // eslint-disable-next-line vue/require-prop-types
-  props: ['element', 'preview', 'dataModel'],
+  props: ["element", "preview", "dataModel"],
   data() {
     return {
       fileListTmp: [],
-      uploadData: {},
-    }
+      uploadData: {}
+    };
   },
   mounted() {
-    const query = this.$route.query
-    if(query.processId) {
-      this.uploadData.processId = query.processId
+    const query = this.$route.query;
+    if (query.processId) {
+      this.uploadData.processId = query.processId;
     }
   },
   methods: {
     handleRemove(file, fileList) {
-      this.fileListTmp = fileList
-      this.$emit('fileList', fileList)
+      this.fileListTmp = fileList;
+      this.$emit("fileList", fileList);
     },
     handlePreview(file) {
-      window.open(file.url, '_blank')
+      window.open(file.url, "_blank");
     },
     handleExceed(files, fileList) {
-      this.$message.warning(`最多允许上传 ${this.element.options.length} 个文件。`)
+      this.$message.warning(
+        `最多允许上传 ${this.element.options.length} 个文件。`
+      );
     },
     beforeRemove(file, fileList) {
-      return this.$confirm(`确定要移除 ${file.name}？`)
+      return this.$confirm(`确定要移除 ${file.name}？`);
     },
     handleSuccess(response, file, fileList) {
-      console.log(response, file, fileList)
-      if(response.code === 200) {
+      console.log(response, file, fileList);
+      if (response.code === 200) {
         this.fileListTmp.push({
           uid: file.uid,
           name: file.name,
@@ -64,19 +66,17 @@ export default {
           file: {
             name: file.name
           }
-        })
-        this.$emit('fileList', this.fileListTmp)
+        });
+        this.$emit("fileList", this.fileListTmp);
       } else {
-        const index = fileList.findIndex(item => item.uid === file.uid)
-        fileList.splice(index, 1)
+        const index = fileList.findIndex(item => item.uid === file.uid);
+        fileList.splice(index, 1);
 
-        this.$message.error(response.msg)
+        this.$message.error(response.msg);
       }
     }
   }
-}
+};
 </script>
 
-<style scoped>
-
-</style>
+<style scoped></style>

src/components/VueFormMaking/components/Upload/index.vue

@@ -60,16 +60,34 @@
         </div>
       </div>
     </draggable>
-
+    <!-- @click.self="handleAdd" -->
     <div
       v-if="!preview"
       v-show="(!isQiniu || (isQiniu && token)) && fileList.length < length"
       class="el-upload el-upload--picture-card"
       :class="{ 'is-disabled': disabled }"
       :style="{ width: width + 'px', height: height + 'px' }"
-      @click.self="handleAdd"
     >
-      <i
+      <el-upload
+        :action="ossUploadUrl"
+        :on-success="handleSuccess"
+        :on-exceed="handleExceed"
+        :before-upload="beforeUpload"
+        :show-file-list="false"
+        accept="image/*"
+        :limit="5"
+        :data="dataObj"
+      >
+        <i
+          class="el-icon-plus"
+          :style="{
+            fontSize: miniWidth / 4 + 'px',
+            marginTop: -miniWidth / 8 + 'px',
+            marginLeft: -miniWidth / 8 + 'px'
+          }"
+        ></i>
+      </el-upload>
+      <!-- <i
         class="el-icon-plus"
         :style="{
           fontSize: miniWidth / 4 + 'px',
@@ -98,7 +116,7 @@
         name="file"
         class="el-upload__input upload-input"
         @change="handleChange"
-      />
+      /> -->
     </div>
   </div>
 </template>
@@ -109,7 +127,7 @@ import Viewer from "viewerjs";
 import Draggable from "vuedraggable";
 import * as qiniu from "qiniu-js";
 require("viewerjs/dist/viewer.css");
-
+import { policy } from "@/api/user";
 import VueI18n from "vue-i18n";
 Vue.use(VueI18n);
 export default {
@@ -193,7 +211,16 @@ export default {
       viewer: null,
       uploadId: "upload_" + new Date().getTime(),
       editIndex: -1,
-      meituIndex: -1
+      meituIndex: -1,
+      ossUploadUrl: "https://ks3-cn-beijing.ksyuncs.com/daya",
+      dataObj: {
+        policy: "",
+        signature: "",
+        key: "",
+        KSSAccessKeyId: "",
+        acl: "public-read",
+        name: ""
+      }
     };
   },
   computed: {
@@ -217,6 +244,52 @@ export default {
     this.$emit("input", this.fileList);
   },
   methods: {
+    handleExceed(files, fileList) {
+      this.$message.warning(`最多允许上传 5 张图片。`);
+    },
+    async beforeUpload(file) {
+      const isLt2M = file.size / 1024 / 1024 < 5;
+      if (!isLt2M) {
+        this.$message.error("上传图片大小不能超过 5MB!");
+      }
+      try {
+        let filename = file.name.replaceAll(" ", "_");
+        let key = new Date().getTime() + filename;
+        let obj = {
+          filename,
+          bucketName: "daya",
+          postData: {
+            filename,
+            acl: "public-read",
+            key,
+            unknowValueField: []
+          }
+        };
+
+        const res = await policy(obj);
+        this.dataObj = {
+          policy: res.data.policy,
+          signature: res.data.signature,
+          key,
+          KSSAccessKeyId: res.data.kssAccessKeyId,
+          acl: "public-read",
+          name: filename
+        };
+
+        return isLt2M;
+      } catch {
+        return false;
+      }
+    },
+    handleSuccess(response, file, fileList) {
+      let url = this.ossUploadUrl + "/" + this.dataObj.key;
+      this.fileList.push({
+        uid: file.uid,
+        name: file.name,
+        url,
+        percent: 100
+      });
+    },
     handleChange() {
       const files = this.$refs.uploadInput.files;
 
@@ -257,21 +330,51 @@ export default {
       }
       this.$refs.uploadInput.value = [];
     },
-    uplaodAction(res, file, key) {
+    async uplaodAction(res, file, key) {
+      try {
+        let filename = file.name.replaceAll(" ", "_");
+        let key = new Date().getTime() + filename;
+        let obj = {
+          filename,
+          bucketName: "daya",
+          postData: {
+            filename,
+            acl: "public-read",
+            key,
+            unknowValueField: []
+          }
+        };
+        const res = await policy(obj);
+        this.dataObj = {
+          policy: res.data.policy,
+          signature: res.data.signature,
+          key,
+          KSSAccessKeyId: res.data.kssAccessKeyId,
+          acl: "public-read",
+          name: filename
+        };
+      } catch {}
       // eslint-disable-next-line no-unused-vars
       const changeIndex = this.fileList.findIndex(item => item.key === key);
       const xhr = new XMLHttpRequest();
 
-      const url = "/api-web/uploadFile";
+      const url = this.ossUploadUrl;
       xhr.open("POST", url, true);
       // xhr.setRequestHeader('Content-Type', 'multipart/form-data')
 
       const formData = new FormData();
-      formData.append("file", file);
+      formData.append(this.dataObj.name, file, this.dataObj.name);
+      formData.append("policy", this.dataObj.policy);
+      formData.append("signature", this.dataObj.signature);
+      formData.append("key", this.dataObj.key);
+      formData.append("KSSAccessKeyId", this.dataObj.KSSAccessKeyId);
+      formData.append("acl", "public-read");
+      formData.append("name", this.dataObj.name);
 
       xhr.send(formData);
       xhr.onreadystatechange = () => {
         if (xhr.readyState === 4) {
+          console.log(xhr, "xhr");
           const tempData = JSON.parse(xhr.response);
           const resData = tempData.data;
           var uploadUrl = "";

src/views/process/list/model/upload.vue

@@ -25,13 +25,14 @@
     </div>
     <div class="upload_section">
       <el-upload
-        action="/api-web/import/oaUploadFile"
+        :action="ossUploadUrl"
         :on-success="handleSuccess"
         :on-exceed="handleExceed"
         :before-upload="beforeUpload"
         :show-file-list="false"
         accept="image/*"
         :limit="5"
+        :data="dataObj"
       >
         <el-button
           size="mini"
@@ -43,13 +44,14 @@
       </el-upload>
 
       <el-upload
-        action="/api-web/import/oaUploadFile"
+        :action="ossUploadUrl"
         style="margin-left: 8px"
         :on-success="handleSuccess"
         :on-exceed="handleExceedFile"
         :before-upload="beforeUploadFile"
         :show-file-list="false"
         :limit="3"
+        :data="dataObj"
         accept="image/*, *.xlsx, *.xls,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel, application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document, *.txt, *.pdf"
       >
         <el-button
@@ -65,21 +67,31 @@
 </template>
 
 <script>
+import { policy } from "@/api/user";
 export default {
   name: "FileUpload",
-  props: [ "fileUrl"],
+  props: ["fileUrl"],
   data() {
     return {
       tempFileUrl: this.fileUrl || [],
       type: "image",
       uploadLoading: false,
-      uploadFileLoading: false
+      uploadFileLoading: false,
+      ossUploadUrl: "https://ks3-cn-beijing.ksyuncs.com/daya",
+      dataObj: {
+        policy: "",
+        signature: "",
+        key: "",
+        KSSAccessKeyId: "",
+        acl: "public-read",
+        name: ""
+      }
     };
   },
   watch: {
     fileUrl(val) {
-      console.log(val)
-      this.tempFileUrl = val
+      console.log(val);
+      this.tempFileUrl = val;
     }
   },
   methods: {
@@ -92,23 +104,79 @@ export default {
       this.tempFileUrl.splice(index, 1);
       this.$emit("update:fileUrl", this.tempFileUrl);
     },
-    beforeUpload(file) {
+    async beforeUpload(file) {
       const isLt2M = file.size / 1024 / 1024 < 5;
       if (!isLt2M) {
         this.$message.error("上传图片大小不能超过 5MB!");
       }
       this.uploadLoading = true;
       this.type = "image";
-      return isLt2M;
+      try {
+        let filename = file.name.replaceAll(" ", "_");
+        let key = new Date().getTime() + filename;
+        let obj = {
+          filename,
+          bucketName: "daya",
+          postData: {
+            filename,
+            acl: "public-read",
+            key,
+            unknowValueField: []
+          }
+        };
+
+        const res = await policy(obj);
+        this.dataObj = {
+          policy: res.data.policy,
+          signature: res.data.signature,
+          key,
+          KSSAccessKeyId: res.data.kssAccessKeyId,
+          acl: "public-read",
+          name: filename
+        };
+        console.log(res, "policy", this.dataObj);
+
+        return isLt2M;
+      } catch {
+        return false;
+      }
     },
-    beforeUploadFile(file) {
+    async beforeUploadFile(file) {
       const isLt2M = file.size / 1024 / 1024 < 5;
       if (!isLt2M) {
-        this.$message.error("上传图片大小不能超过 5MB!");
+        this.$message.error("上传附件大小不能超过 5MB!");
       }
       this.uploadFileLoading = true;
       this.type = "file";
-      return isLt2M;
+
+      try {
+        let filename = file.name.replaceAll(" ", "_");
+        let key = new Date().getTime() + filename;
+        let obj = {
+          filename,
+          bucketName: "daya",
+          postData: {
+            filename,
+            acl: "public-read",
+            key,
+            unknowValueField: []
+          }
+        };
+
+        const res = await policy(obj);
+        this.dataObj = {
+          policy: res.data.policy,
+          signature: res.data.signature,
+          key,
+          KSSAccessKeyId: res.data.kssAccessKeyId,
+          acl: "public-read",
+          name: filename
+        };
+
+        return isLt2M;
+      } catch {
+        return false;
+      }
     },
     handleExceed(files, fileList) {
       this.$message.warning(`最多允许上传 5 张图片。`);
@@ -117,27 +185,21 @@ export default {
       this.$message.warning(`最多允许上传 3 个文件。`);
     },
     handleSuccess(response, file, fileList) {
-      console.log(response, file, fileList);
+      // console.log(response, file, fileList);
       this.uploadLoading = false;
       this.uploadFileLoading = false;
-      if (response.code === 200) {
-        this.tempFileUrl.push({
-          uid: file.uid,
-          name: file.name,
-          url: response.data.url,
-          type: this.type,
-          file: {
-            name: file.name
-          }
-        });
-        console.log(this.tempFileUrl);
-        this.$emit("update:fileList", this.tempFileUrl);
-      } else {
-        const index = fileList.findIndex(item => item.uid === file.uid);
-        fileList.splice(index, 1);
 
-        this.$message.error(response.msg);
-      }
+      let url = this.ossUploadUrl + "/" + this.dataObj.key;
+      this.tempFileUrl.push({
+        uid: file.uid,
+        name: file.name,
+        url,
+        type: this.type,
+        file: {
+          name: file.name
+        }
+      });
+      this.$emit("update:fileList", this.tempFileUrl);
     }
   }
 };

src/views/profile/index.vue

@@ -61,13 +61,13 @@
 </template>
 
 <script>
-import userAvatar from './userAvatar'
-import userInfo from './userInfo'
+import userAvatar from "./userAvatar";
+import userInfo from "./userInfo";
 // import resetPwd from './resetPwd'
-import { getUserProfile } from '@/api/system/sysuser'
+import { getUserProfile } from "@/api/system/sysuser";
 
 export default {
-  name: 'Profile',
+  name: "Profile",
   components: { userAvatar, userInfo },
   data() {
     return {
@@ -75,38 +75,38 @@ export default {
       roleGroup: {},
       postGroup: {},
       deptGroup: {},
-      activeTab: 'userinfo',
+      activeTab: "userinfo",
       roleIds: undefined,
       postIds: undefined,
       roleName: undefined,
       postName: undefined,
       dept: {},
       deptName: undefined
-    }
+    };
   },
   created() {
-    this.getUser()
+    this.getUser();
   },
   methods: {
     getUser() {
       getUserProfile().then(response => {
-        this.user = response.data
-        this.roleIds = response.roleIds
-        this.roleGroup = response.roles
+        this.user = response.data;
+        this.roleIds = response.roleIds;
+        this.roleGroup = response.roles;
 
         if (this.roleIds[0]) {
           for (const key in this.roleGroup) {
             if (this.roleIds[0] === this.roleGroup[key].roleId) {
-              this.roleName = this.roleGroup[key].roleName
+              this.roleName = this.roleGroup[key].roleName;
             }
           }
         } else {
-          this.roleName = '暂无'
+          this.roleName = "暂无";
         }
-        this.dept = response.dept
-        this.deptName = this.dept.deptName
-      })
+        this.dept = response.dept;
+        this.deptName = this.dept.deptName;
+      });
     }
   }
-}
+};
 </script>

src/views/profile/userAvatar.vue

@@ -1,9 +1,25 @@
 <template>
   <div>
-    <img :src="options.img" title="点击上传头像" class="img-circle img-lg" @click="editCropper()">
-    <el-dialog :title="title" :visible.sync="open" width="800px">
+    <!-- <img
+      :src="options.img"
+      title="点击上传头像"
+      class="img-circle img-lg"
+      @click="editCropper()"
+    /> -->
+    <el-upload
+      class="img-circle img-lg"
+      :action="ossUploadUrl"
+      :show-file-list="false"
+      :on-success="handleAvatarSuccess"
+      :before-upload="beforeAvatarUpload"
+      :data="dataObj"
+    >
+      <el-image v-if="options.img" :src="options.img" class="avatar" />
+      <i v-else class="el-icon-plus avatar-uploader-icon"></i>
+    </el-upload>
+    <!-- <el-dialog :title="title" :visible.sync="open" width="800px">
       <el-row>
-        <el-col :xs="24" :md="12" :style="{height: '350px'}">
+        <el-col :xs="24" :md="12" :style="{ height: '350px' }">
           <vue-cropper
             ref="cropper"
             :img="options.img"
@@ -15,47 +31,66 @@
             @realTime="realTime"
           />
         </el-col>
-        <el-col :xs="24" :md="12" :style="{height: '350px'}">
+        <el-col :xs="24" :md="12" :style="{ height: '350px' }">
           <div class="avatar-upload-preview">
-            <img :src="previews.url" :style="previews.img">
+            <img :src="previews.url" :style="previews.img" />
           </div>
         </el-col>
       </el-row>
-      <br>
+      <br />
       <el-row>
         <el-col :lg="2" :md="2">
-          <el-upload action="#" :http-request="requestUpload" :show-file-list="false" :before-upload="beforeUpload">
+          <el-upload
+            action="#"
+            :http-request="requestUpload"
+            :show-file-list="false"
+            :before-upload="beforeUpload"
+          >
             <el-button size="small">
               上传
               <i class="el-icon-upload el-icon--right" />
             </el-button>
           </el-upload>
         </el-col>
-        <el-col :lg="{span: 1, offset: 2}" :md="2">
+        <el-col :lg="{ span: 1, offset: 2 }" :md="2">
           <el-button icon="el-icon-plus" size="small" @click="changeScale(1)" />
         </el-col>
-        <el-col :lg="{span: 1, offset: 1}" :md="2">
-          <el-button icon="el-icon-minus" size="small" @click="changeScale(-1)" />
+        <el-col :lg="{ span: 1, offset: 1 }" :md="2">
+          <el-button
+            icon="el-icon-minus"
+            size="small"
+            @click="changeScale(-1)"
+          />
         </el-col>
-        <el-col :lg="{span: 1, offset: 1}" :md="2">
-          <el-button icon="el-icon-refresh-left" size="small" @click="rotateLeft()" />
+        <el-col :lg="{ span: 1, offset: 1 }" :md="2">
+          <el-button
+            icon="el-icon-refresh-left"
+            size="small"
+            @click="rotateLeft()"
+          />
         </el-col>
-        <el-col :lg="{span: 1, offset: 1}" :md="2">
-          <el-button icon="el-icon-refresh-right" size="small" @click="rotateRight()" />
+        <el-col :lg="{ span: 1, offset: 1 }" :md="2">
+          <el-button
+            icon="el-icon-refresh-right"
+            size="small"
+            @click="rotateRight()"
+          />
         </el-col>
-        <el-col :lg="{span: 2, offset: 6}" :md="2">
-          <el-button type="primary" size="small" @click="uploadImg()">提 交</el-button>
+        <el-col :lg="{ span: 2, offset: 6 }" :md="2">
+          <el-button type="primary" size="small" @click="uploadImg()"
+            >提 交</el-button
+          >
         </el-col>
       </el-row>
-    </el-dialog>
+    </el-dialog> -->
   </div>
 </template>
 
 <script>
-import store from '@/store'
-import { VueCropper } from 'vue-cropper'
-import { uploadAvatar } from '@/api/system/sysuser'
-
+import store from "@/store";
+import { VueCropper } from "vue-cropper";
+import { uploadAvatar } from "@/api/system/sysuser";
+import { policy } from "@/api/user";
 export default {
   components: { VueCropper },
   props: {
@@ -67,7 +102,7 @@ export default {
       // 是否显示弹出层
       open: false,
       // 弹出层标题
-      title: '修改头像',
+      title: "修改头像",
       options: {
         img: store.getters.avatar, // 裁剪图片的地址
         autoCrop: true, // 是否默认生成截图框
@@ -75,63 +110,137 @@ export default {
         autoCropHeight: 200, // 默认生成截图框高度
         fixedBox: true // 固定截图框大小 不允许改变
       },
-      previews: {}
-    }
+      previews: {},
+      info: null,
+      ossUploadUrl: "https://ks3-cn-beijing.ksyuncs.com/daya",
+      dataObj: {
+        policy: "",
+        signature: "",
+        key: "",
+        KSSAccessKeyId: "",
+        acl: "public-read",
+        name: ""
+      }
+    };
   },
   methods: {
+    async beforeAvatarUpload(file) {
+      const isLt2M = file.size / 1024 / 1024 < 5;
+      if (!isLt2M) {
+        this.$message.error("上传图片大小不能超过 5MB!");
+      }
+      this.uploadLoading = true;
+      this.type = "image";
+      try {
+        let filename = file.name.replaceAll(" ", "_");
+        let key = new Date().getTime() + filename;
+        let obj = {
+          filename,
+          bucketName: "daya",
+          postData: {
+            filename,
+            acl: "public-read",
+            key,
+            unknowValueField: []
+          }
+        };
+
+        const res = await policy(obj);
+        this.dataObj = {
+          policy: res.data.policy,
+          signature: res.data.signature,
+          key,
+          KSSAccessKeyId: res.data.kssAccessKeyId,
+          acl: "public-read",
+          name: filename
+        };
+        console.log(res, "policy", this.dataObj);
+
+        return isLt2M;
+      } catch {
+        return false;
+      }
+    },
+    handleAvatarSuccess(response, file, fileList) {
+      // console.log(response, file, fileList)
+
+      let url = this.ossUploadUrl + "/" + this.dataObj.key;
+
+      const formData = new FormData();
+      formData.append("avatar", url);
+      uploadAvatar(formData).then(response => {
+        if (response.code === 200) {
+          this.options.img = url;
+          this.msgSuccess("修改成功");
+        } else {
+          this.msgError(response.msg);
+        }
+      });
+    },
     // 编辑头像
     editCropper() {
-      this.open = true
+      this.open = true;
     },
     // 覆盖默认的上传行为
-    requestUpload() {
+    requestUpload(file) {
+      console.log(file);
+      this.info = file;
     },
     // 向左旋转
     rotateLeft() {
-      this.$refs.cropper.rotateLeft()
+      this.$refs.cropper.rotateLeft();
     },
     // 向右旋转
     rotateRight() {
-      this.$refs.cropper.rotateRight()
+      this.$refs.cropper.rotateRight();
     },
     // 图片缩放
     changeScale(num) {
-      num = num || 1
-      this.$refs.cropper.changeScale(num)
+      num = num || 1;
+      this.$refs.cropper.changeScale(num);
     },
     // 上传预处理
     beforeUpload(file) {
-      if (file.type.indexOf('image/') === -1) {
-        this.msgError('文件格式错误，请上传图片类型,如：JPG，PNG后缀的文件。')
+      if (file.type.indexOf("image/") === -1) {
+        this.msgError("文件格式错误，请上传图片类型,如：JPG，PNG后缀的文件。");
       } else {
-        const reader = new FileReader()
-        reader.readAsDataURL(file)
+        const reader = new FileReader();
+        reader.readAsDataURL(file);
         reader.onload = () => {
-          this.options.img = reader.result
-        }
+          this.options.img = reader.result;
+        };
       }
     },
     // 上传图片
     uploadImg() {
-      this.$refs.cropper.getCropBlob(data => {
-        const formData = new FormData()
-        formData.append('upload[]', data)
+      this.$refs.cropper.getCropBlob(async data => {
+        console.log(data, "showifo");
+        const formData = new FormData();
+        formData.append("upload[]", data);
         uploadAvatar(formData).then(response => {
           if (response.code === 200) {
-            this.open = false
-            this.options.img = process.env.VUE_APP_BASE_API + '/' + response.data
-            this.msgSuccess('修改成功')
+            this.open = false;
+            this.options.img =
+              process.env.VUE_APP_BASE_API + "/" + response.data;
+            this.msgSuccess("修改成功");
           } else {
-            this.msgError(response.msg)
+            this.msgError(response.msg);
           }
-          this.$refs.cropper.clearCrop()
-        })
-      })
+          this.$refs.cropper.clearCrop();
+        });
+      });
     },
     // 实时预览
     realTime(data) {
-      this.previews = data
+      this.previews = data;
     }
   }
-}
+};
 </script>
+
+<style>
+.avatar {
+  border-radius: 50%;
+  overflow: hidden;
+}
+</style>

src/views/system/settings/index.vue

@@ -5,20 +5,25 @@
         <span>配置信息</span>
       </div>
       <div class="text item">
-        <el-form ref="ruleForm" :model="ruleForm" :rules="rules" label-width="120px">
+        <el-form
+          ref="ruleForm"
+          :model="ruleForm"
+          :rules="rules"
+          label-width="120px"
+        >
           <el-form-item label="系统名称：" prop="name">
             <el-input v-model="ruleForm.name" />
           </el-form-item>
           <el-form-item label="系统Logo：" prop="logo">
             <el-upload
               class="avatar-uploader"
-              :action="url"
-              :data="{type:'1'}"
+              :action="ossUploadUrl"
+              :data="dataObj"
               :show-file-list="false"
               :on-success="handleAvatarSuccess"
               :before-upload="beforeAvatarUpload"
             >
-              <img v-if="ruleForm.logo" :src="ruleForm.logo" class="avatar">
+              <img v-if="ruleForm.logo" :src="ruleForm.logo" class="avatar" />
               <i v-else class="el-icon-plus avatar-uploader-icon" />
             </el-upload>
           </el-form-item>
@@ -27,7 +32,12 @@
             <el-radio v-model="ruleForm.is_ldap" :label="false">否</el-radio>
           </el-form-item>
           <el-form-item style="margin-bottom: 0">
-            <el-button v-permisaction="['system:settings:index:config']" type="primary" @click="submitForm('ruleForm', 1)">确定</el-button>
+            <el-button
+              v-permisaction="['system:settings:index:config']"
+              type="primary"
+              @click="submitForm('ruleForm', 1)"
+              >确定</el-button
+            >
           </el-form-item>
         </el-form>
       </div>
@@ -42,11 +52,7 @@
           type="info"
           style="margin-bottom: 10px"
         />
-        <el-table
-          :data="tableData"
-          border
-          style="width: 100%"
-        >
+        <el-table :data="tableData" border style="width: 100%">
           <el-table-column
             prop="local_field_name"
             label="字段名称"
@@ -57,20 +63,41 @@
             label="字段昵称"
             width="150"
           />
-          <el-table-column
-            prop="ldap_field_name"
-            label="Ldap字段"
-          >
-            <template slot-scope="{row, $index}">
-              <div style="width: 100%; min-height: 24px;" @click="{{ chengenum($index, true) }}" @dblclick="{{ chengenum($index, false) }}">
-                <el-input v-if="editable[$index]" v-model="row.ldap_field_name" />
+          <el-table-column prop="ldap_field_name" label="Ldap字段">
+            <template slot-scope="{ row, $index }">
+              <div
+                style="width: 100%; min-height: 24px;"
+                @click="
+                  {
+                    {
+                      chengenum($index, true);
+                    }
+                  }
+                "
+                @dblclick="
+                  {
+                    {
+                      chengenum($index, false);
+                    }
+                  }
+                "
+              >
+                <el-input
+                  v-if="editable[$index]"
+                  v-model="row.ldap_field_name"
+                />
                 <span v-else>{{ row.ldap_field_name }}</span>
               </div>
             </template>
           </el-table-column>
         </el-table>
         <div style="margin-top: 20px">
-          <el-button v-permisaction="['system:settings:index:ldap']" type="primary" @click="submitForm('ruleForm', 2)">确定</el-button>
+          <el-button
+            v-permisaction="['system:settings:index:ldap']"
+            type="primary"
+            @click="submitForm('ruleForm', 2)"
+            >确定</el-button
+          >
         </div>
       </div>
     </el-card>
@@ -78,34 +105,40 @@
 </template>
 
 <script>
-import { setSettings, getSettings } from '@/api/system/settings'
+import { setSettings, getSettings } from "@/api/system/settings";
+import { policy } from "@/api/user";
 export default {
-  components: {
-
-  },
+  components: {},
   data() {
     return {
-      url: process.env.VUE_APP_BASE_API + '/api/v1/public/uploadFile',
+      // url: process.env.VUE_APP_BASE_API + "/api/v1/public/uploadFile",
       editable: [],
       ruleForm: {
-        name: '',
-        logo: '',
+        name: "",
+        logo: "",
         is_ldap: false
       },
       rules: {
         name: [
-          { required: true, message: '请输入系统名称', trigger: 'blur' },
-          { min: 3, max: 15, message: '长度在 3 到 15 个字符', trigger: 'blur' }
+          { required: true, message: "请输入系统名称", trigger: "blur" },
+          { min: 3, max: 15, message: "长度在 3 到 15 个字符", trigger: "blur" }
         ],
-        logo: [
-          { required: true, message: '请设置Logo', trigger: 'blur' }
-        ]
+        logo: [{ required: true, message: "请设置Logo", trigger: "blur" }]
       },
-      tableData: []
-    }
+      tableData: [],
+      ossUploadUrl: "https://ks3-cn-beijing.ksyuncs.com/daya",
+      dataObj: {
+        policy: "",
+        signature: "",
+        key: "",
+        KSSAccessKeyId: "",
+        acl: "public-read",
+        name: ""
+      }
+    };
   },
   created() {
-    this.getSettingsInfo()
+    this.getSettingsInfo();
   },
   methods: {
     getSettingsInfo() {
@@ -114,96 +147,130 @@ export default {
           if (v.classify === 1) {
             if (v.content === undefined || v.content === null) {
               this.ruleForm = {
-                name: '',
-                logo: '',
+                name: "",
+                logo: "",
                 is_ldap: false
-              }
+              };
             } else {
-              if (v.content.is_ldap === undefined || v.content.is_ldap === null) {
-                v.content.is_ldap = false
+              if (
+                v.content.is_ldap === undefined ||
+                v.content.is_ldap === null
+              ) {
+                v.content.is_ldap = false;
               }
-              this.ruleForm = v.content
+              this.ruleForm = v.content;
             }
           } else if (v.classify === 2) {
             if (v.content === undefined || v.content === null) {
-              this.tableData = []
+              this.tableData = [];
             } else {
-              this.tableData = v.content
+              this.tableData = v.content;
             }
           }
         }
-      })
+      });
     },
     // 提交配置信息
     submitForm(formName, classify) {
-      var requestStatus = false
+      var requestStatus = false;
       var jsonValue = {
         classify: classify
-      }
+      };
       if (classify === 1) {
-        this.$refs[formName].validate((valid) => {
+        this.$refs[formName].validate(valid => {
           if (valid) {
-            jsonValue.content = this.ruleForm
-            requestStatus = true
+            jsonValue.content = this.ruleForm;
+            requestStatus = true;
           }
-        })
+        });
       } else if (classify === 2) {
-        jsonValue.content = this.tableData
-        requestStatus = true
+        jsonValue.content = this.tableData;
+        requestStatus = true;
       }
       if (requestStatus) {
         setSettings(jsonValue).then(response => {
-          this.$store.dispatch('settings/getSystemSettings')
+          this.$store.dispatch("settings/getSystemSettings");
           this.$message({
-            message: '设置成功',
-            type: 'success'
-          })
-        })
+            message: "设置成功",
+            type: "success"
+          });
+        });
       }
     },
     resetForm(formName) {
-      this.$refs[formName].resetFields()
+      this.$refs[formName].resetFields();
     },
     handleAvatarSuccess(res, file) {
-      this.ruleForm.logo = res.data
+      let url = this.ossUploadUrl + "/" + this.dataObj.key;
+      this.ruleForm.logo = url;
     },
-    beforeAvatarUpload(file) {
-      const isLt2M = file.size / 1024 / 1024 < 2
+    async beforeAvatarUpload(file) {
+      const isLt2M = file.size / 1024 / 1024 < 2;
       if (!isLt2M) {
-        this.$message.error('上传头像图片大小不能超过 2MB!')
+        this.$message.error("上传头像图片大小不能超过 2MB!");
+      }
+
+      try {
+        let filename = file.name.replaceAll(" ", "_");
+        let key = new Date().getTime() + filename;
+        let obj = {
+          filename,
+          bucketName: "daya",
+          postData: {
+            filename,
+            acl: "public-read",
+            key,
+            unknowValueField: []
+          }
+        };
+
+        const res = await policy(obj);
+        this.dataObj = {
+          policy: res.data.policy,
+          signature: res.data.signature,
+          key,
+          KSSAccessKeyId: res.data.kssAccessKeyId,
+          acl: "public-read",
+          name: filename
+        };
+        console.log(res, "policy", this.dataObj);
+
+        return isLt2M;
+      } catch {
+        return false;
       }
-      return isLt2M
     },
-    chengenum(row, status) { // 我的方法
-      this.editable[row] = status
-      this.$set(this.editable, row, status)
+    chengenum(row, status) {
+      // 我的方法
+      this.editable[row] = status;
+      this.$set(this.editable, row, status);
     }
   }
-}
+};
 </script>
 
 <style>
-  .avatar-uploader .el-upload {
-    border: 1px dashed #d9d9d9;
-    border-radius: 6px;
-    cursor: pointer;
-    position: relative;
-    overflow: hidden;
-  }
-  .avatar-uploader .el-upload:hover {
-    border-color: #409EFF;
-  }
-  .avatar-uploader-icon {
-    font-size: 28px;
-    color: #8c939d;
-    width: 178px;
-    height: 178px;
-    line-height: 178px;
-    text-align: center;
-  }
-  .avatar {
-    width: 178px;
-    height: 178px;
-    display: block;
-  }
+.avatar-uploader .el-upload {
+  border: 1px dashed #d9d9d9;
+  border-radius: 6px;
+  cursor: pointer;
+  position: relative;
+  overflow: hidden;
+}
+.avatar-uploader .el-upload:hover {
+  border-color: #409eff;
+}
+.avatar-uploader-icon {
+  font-size: 28px;
+  color: #8c939d;
+  width: 178px;
+  height: 178px;
+  line-height: 178px;
+  text-align: center;
+}
+.avatar {
+  width: 178px;
+  height: 178px;
+  display: block;
+}
 </style>