1
lzhe
2024-05-06 96820ec7eead362f475afa1a3eb073a176cb7286
1
已修改1个文件
163 ■■■■■ 文件已修改
src/views/console/soam/oss-system.vue 163 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/views/console/soam/oss-system.vue
@@ -2,7 +2,7 @@
 * @Author: lzhe lzhe@example.com
 * @Date: 2024-03-26 10:28:33
 * @LastEditors: lzhe lzhe@example.com
 * @LastEditTime: 2024-04-03 14:46:31
 * @LastEditTime: 2024-05-06 16:26:56
 * @FilePath: /smart-web/src/views/master/person/main/index.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
@@ -35,6 +35,41 @@
                        </el-col>
                    </el-row>
                </el-form>
            </el-tab-pane>
            <el-tab-pane label="企业LOGO">
                <div class="tabTitle">企业LOGO</div>
                <span class="logotitle">上传logo</span>
                <div class="logo1">
                    <el-upload
                        class="avatar-uploader"
                        :headers="authorization"
                        action="/api/blade-resource/oss/endpoint/put-file"
                        :show-file-list="false"
                        :on-success="handleAvatarSuccess1"
                        :before-upload="beforeAvatarUpload"
                        type="0"
                    >
                        <img v-if="imageUrl1" :src="imageUrl1" class="avatar" />
                        <el-icon v-else class="avatar-uploader-icon"><Plus /></el-icon>
                    </el-upload>
                    <span>建议无底色、大小180*40px</span>
                </div>
                <div class="logo2">
                    <el-upload
                        class="avatar-uploader"
                        :headers="authorization"
                        action="/api/blade-resource/oss/endpoint/put-file"
                        :show-file-list="false"
                        :on-success="handleAvatarSuccess2"
                        :before-upload="beforeAvatarUpload"
                        type="1"
                    >
                        <img v-if="imageUrl2" :src="imageUrl2" class="avatar" />
                        <el-icon v-else class="avatar-uploader-icon"><Plus /></el-icon>
                    </el-upload>
                    <span>建议无底色、大小180*40px</span>
                </div>
            </el-tab-pane>
            <el-tab-pane label="应用设置">
                <div class="tabTitle">应用设置</div>
@@ -116,10 +151,20 @@
</template>
<script>
    import * as ElementPlusIconsVue from '@element-plus/icons-vue'
    let icons = []
    for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
        icons.push(key)
    }
    export default {
        name: "oss-main",
        data(){
            return {
                uploadData: {},
                logoType: "0",
                authorization: {Authorization: "Basic c2FiZXI6c2FiZXJfc2VjcmV0"},
                imageUrl1: "",
                imageUrl2: "",
                isSaveing: false,
                isEdit: false,
                active: {
@@ -143,15 +188,82 @@
                temData: []
            }
        },
        components: {},
        components: {...ElementPlusIconsVue},
        created(){
            
        },
        mounted(){
            this.getOssUpdata();  //文件存储
            this.setting();  //应用设置
            this.getFile();  //企业logo
        },
        methods: {
            getFile() {
                this.$HTTP.get("/api/blade-cps/enterprise/get").then(res=> {
                    if(res.code == 200) {
                        this.uploadData = res.data;
                        this.imageUrl1 = res.data.list[0].link;
                        this.imageUrl2 = res.data.list[1].link;
                    }
                })
            },
            handleAvatarSuccess1(resp, file) {
                this.getFile();
                this.logoType = "0";
                if(this.imageUrl1) {
                    resp.uploadMethod = "edit";
                }else {
                    resp.uploadMethod = "add";
                }
                this.handleAvatarSuccess(resp);
            },
            handleAvatarSuccess2(resp, file) {
                this.getFile();
                this.logoType = "1";
                if(this.imageUrl2) {
                    resp.uploadMethod = "edit";
                }else {
                    resp.uploadMethod = "add";
                }
                this.handleAvatarSuccess(resp);
            },
            handleAvatarSuccess(resp) {
                var that = this;
                this.$HTTP.get("/api/blade-cps/enterprise/get").then(res=> {
                    if(res.code == 200) {
                        // 先赋值
                        that.uploadData = res.data;
                        that.imageUrl1 = res.data.list[0].link;
                        that.imageUrl2 = res.data.list[1].link;
                        //添加接口
                        var url = "/api/blade-cps/enterprise/add";
                        if(that.logoType == "0") {
                            Object.assign({},res.data.list[0]);
                            obj.type = "0";
                        }
                        if(that.logoType == "1") {
                            obj.type = "1";
                        }
                        if(resp.uploadMethod == "edit") {
                            url = "/api/blade-cps/enterprise/edit";
                        }
                        that.$HTTP.post(url,resp.data).then(resJ=> {
                            if(resJ.code == 200) {
                                that.$message.success("操作成功");
                            }else {
                                that.$alert(resJ.message, "提示", {type: 'error'});
                            }
                        })
                    }
                })
            },
            beforeAvatarUpload(file) {
                var isJPG = file.type === 'image/jpeg';
                if (!isJPG) {
                this.$message.error('格式错误,请重新上传!');
                }
                return isJPG;
            },
            cencelBtn() {
                this.isEdit=false;
                this.isSaveing = false;
@@ -321,4 +433,51 @@
    top: 6px;
    right: 22px;
}
.logotitle {
    font-weight: 400;
    font-size: 16px;
    width: 140px;
    text-align: center;
    display: inline-block;
    vertical-align: top;
}
.logo1,.logo2 {
    display: inline-block;
    margin-right: 20px;
}
.avatar-uploader /deep/ .el-upload {
    border: 1px dashed #d9d9d9;
    border-radius: 6px;
    cursor: pointer;
    position: relative;
    overflow: hidden;
}
.avatar-uploader /deep/ .el-upload:hover {
    border-color: #409EFF;
}
.avatar-uploader-icon {
    font-size: 28px;
    color: #8c939d;
    text-align: center;
}
.logo1 /deep/ .avatar-uploader-icon {
    width: 178px;
    height: 178px;
    line-height: 178px;
}
.logo2 /deep/ .avatar-uploader-icon {
    width: 92px;
    height: 92px;
    line-height: 92px;
}
.logo1 .avatar {
    width: 178px;
    height: 178px;
    display: block;
}
.logo2 .avatar {
    width: 92px;
    height: 92px;
    display: block;
}
</style>