From df4c5ac38a1f287b7d0f48a558630cae70f6a690 Mon Sep 17 00:00:00 2001
From: lzhe <lzhe@example.com>
Date: 星期二, 07 五月 2024 21:09:17 +0800
Subject: [PATCH] 1
---
src/views/console/soam/oss-system.vue | 243 +++++++++++++++++++++++++++++++++++++++++++-----
1 files changed, 216 insertions(+), 27 deletions(-)
diff --git a/src/views/console/soam/oss-system.vue b/src/views/console/soam/oss-system.vue
index 5dccb9a..98c0e7a 100644
--- a/src/views/console/soam/oss-system.vue
+++ b/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-05-06 16:26:56
+ * @LastEditTime: 2024-05-07 21:09:02
* @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
-->
@@ -40,36 +40,19 @@
<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"
- >
+ <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">
<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"
- >
+ <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">
<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>
@@ -146,11 +129,64 @@
</el-form>
</el-card>
</el-tab-pane>
+ <el-tab-pane label="鎺堟潈">
+ <div class="tabTitle">鎺堟潈</div>
+ <div class="license-detail">
+ <div><span class="left">鎺堜簣锛� </span>{{licenseDetail.account}}</div>
+ <div><span class="left">鎺堟潈鏂瑰紡锛�</span>姘镐箙鎺堟潈</div>
+ <div><span class="left">鎺堟潈鏃ユ湡锛�</span>{{licenseDetail.applyDate}}~{{licenseDetail.expireDate}}</div>
+ <div><span class="left">宸叉巿鏉冩ā鍧楋細</span>{{licenseDetail.moduleNames.VISION}}|{{licenseDetail.moduleNames.CPS}}</div>
+ <div><span class="left">璁惧鏍囪瘑锛�</span><span class="licenseCopy" @click="licenseCopy">澶嶅埗</span></div>
+ </div>
+ </el-tab-pane>
+ <el-tab-pane label="鏈嶅姟闆嗘垚">
+ <div class="tabTitle">鏈嶅姟闆嗘垚</div>
+ <div class="card">
+ <div class="top">
+ <div class="title">
+ <img src="./logo.png" />
+ <span>浼佷笟寰俊</span>
+ <span class="taginfo" v-if="appType==1">宸插叧鑱�</span>
+ <div class="desc">CPS涓庝紒涓氬井淇″叧鑱旓紝鍗忎綔涓庢矡閫氭洿鍔犻珮鏁堛�傜粦瀹氬悗灏嗗悓姝ヤ紒涓氬井淇＄殑浜哄憳鍚嶅崟鍜岀粍缁囨灦鏋勶紝骞跺厑璁告垚鍛樹娇鐢ㄤ紒涓氬井淇¤处鍙风櫥褰�</div>
+ </div>
+ <el-button class="btn" @click="addOss(1)" v-if="appType!=1" :disabled="appType != 1">鍏宠仈</el-button>
+ <el-button class="btn" @click="addOss(2)" v-if="appType==1" :disabled="appType != 1" type="danger" plain>瑙ｇ粦</el-button>
+ </div>
+ </div>
+ <div class="card">
+ <div class="top">
+ <div class="title">
+ <img src="./logo.png"/>
+ <span >閽夐拤</span>
+ <span class="taginfo" v-if="appType==2">宸插叧鑱�</span>
+ <div class="desc">CPS涓庨拤閽夊叧鑱旓紝鍗忎綔涓庢矡閫氭洿鍔犻珮鏁堛�傜粦瀹氬悗灏嗗悓姝ラ拤閽夌殑浜哄憳鍚嶅崟鍜岀粍缁囨灦鏋勶紝骞跺厑璁告垚鍛樹娇鐢ㄩ拤閽夎处鍙风櫥褰�</div>
+ </div>
+ <el-button class="btn" @click="addOss(2)" v-if="appType!=2" :disabled="appType != 2">鍏宠仈</el-button>
+ <el-button class="btn" @click="addOss(2)" v-if="appType==2" :disabled="appType != 2" type="danger" plain>瑙ｇ粦</el-button>
+ </div>
+ <div class="bottom">
+ <div class="info">
+ <div class="img">
+ <el-icon><Monitor /></el-icon>
+ </div>
+ <div class="info-right">
+ <div class="tag">
+ <div> 缁勭粐鏋舵瀯鍚屾</div>
+ <span>绔嬪嵆鍚屾</span>
+ </div>
+ <div class="time">涓婃鍚屾鏃堕棿锛�-</div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </el-tab-pane>
</el-tabs>
+ <save-dialog v-if="dialog.save" ref="saveDialog" @success="addOssSuccess" @closed="dialog.save=false"></save-dialog>
</div>
</template>
<script>
+ import saveDialog from './addOss'
import * as ElementPlusIconsVue from '@element-plus/icons-vue'
let icons = []
for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
@@ -160,6 +196,20 @@
name: "oss-main",
data(){
return {
+ appType: "",
+ dialog: {
+ save: false
+ },
+ copyStr: "",
+ licenseDetail: {
+ account: "",
+ applyDate: "",
+ expireDate: "",
+ moduleNames: {
+ VISION: "",
+ CPS: ""
+ }
+ },
uploadData: {},
logoType: "0",
authorization: {Authorization: "Basic c2FiZXI6c2FiZXJfc2VjcmV0"},
@@ -188,7 +238,7 @@
temData: []
}
},
- components: {...ElementPlusIconsVue},
+ components: {...ElementPlusIconsVue,saveDialog},
created(){
},
@@ -196,8 +246,48 @@
this.getOssUpdata(); //鏂囦欢瀛樺偍
this.setting(); //搴旂敤璁剧疆
this.getFile(); //浼佷笟logo
+ this.license(); //鎺堟潈
+ this.outer(); //鏈嶅姟闆嗘垚
},
methods: {
+ outer() {
+ this.$HTTP.get("/api/blade-sync/outer-app-config/list").then(res=> {
+ if(res.code == 200) {
+ this.appType = res.data[0].appType;
+ }
+ })
+ },
+ addOss(type) {
+ this.dialog.save = true
+ this.$nextTick(() => {
+ this.$refs.saveDialog.open(type);
+ })
+ },
+ addOssSuccess() {
+
+ },
+ licenseCopy() {
+ // 澶嶅埗鍒板壀璐存澘
+ navigator.clipboard.writeText(this.copyStr).then(() => {
+ console.log('鎷疯礉瀹屾垚');
+ }).catch(err => {
+ console.error('Failed to copy text: ', err);
+ });
+ },
+ license() {
+ this.$HTTP.get("/api/blade-cps/init/license-detail").then(res=> {
+ if(res.code == 200) {
+ res.data.moduleNames.VISION = JSON.stringify(res.data.moduleNames.VISION);
+ res.data.moduleNames.CPS = JSON.stringify(res.data.moduleNames.CPS);
+ this.licenseDetail = res.data;
+ }
+ })
+ this.$HTTP.get("/api/blade-cps/init/license-device").then(res=> { //璁惧鏍囪瘑
+ if(res.code == 200) {
+ this.copyStr = res.data;
+ }
+ })
+ },
getFile() {
this.$HTTP.get("/api/blade-cps/enterprise/get").then(res=> {
if(res.code == 200) {
@@ -208,7 +298,6 @@
})
},
handleAvatarSuccess1(resp, file) {
- this.getFile();
this.logoType = "0";
if(this.imageUrl1) {
resp.uploadMethod = "edit";
@@ -218,7 +307,6 @@
this.handleAvatarSuccess(resp);
},
handleAvatarSuccess2(resp, file) {
- this.getFile();
this.logoType = "1";
if(this.imageUrl2) {
resp.uploadMethod = "edit";
@@ -232,22 +320,24 @@
this.$HTTP.get("/api/blade-cps/enterprise/get").then(res=> {
if(res.code == 200) {
// 鍏堣祴鍊�
+ if(res.data.list.length == 0) res.data.list = [{},{}];
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]);
+ var upData = Object.assign({},res.data.list[0]);
obj.type = "0";
}
if(that.logoType == "1") {
obj.type = "1";
+ var upData = Object.assign({},res.data.list[1]);
}
if(resp.uploadMethod == "edit") {
url = "/api/blade-cps/enterprise/edit";
}
- that.$HTTP.post(url,resp.data).then(resJ=> {
+ that.$HTTP.post(url,upData).then(resJ=> {
if(resJ.code == 200) {
that.$message.success("鎿嶄綔鎴愬姛");
}else {
@@ -258,9 +348,9 @@
})
},
beforeAvatarUpload(file) {
- var isJPG = file.type === 'image/jpeg';
+ var isJPG = (file.type === 'image/jpeg' || file.type === 'image/png');
if (!isJPG) {
- this.$message.error('鏍煎紡閿欒锛岃閲嶆柊涓婁紶锛�');
+ this.$message.error('鏍煎紡閿欒锛岃閲嶆柊涓婁紶锛�');
}
return isJPG;
},
@@ -480,4 +570,103 @@
height: 92px;
display: block;
}
+.license-detail {
+ display: flex;
+ flex-direction: column;
+ padding: 10px;
+ font-size: 14px;
+ padding-left: 70px;
+}
+.license-detail .left {
+ width: 100px;
+ display: inline-block;
+ text-align: right;
+ font-weight: 700;
+}
+.licenseCopy {
+ color: #62a5a5;
+ cursor: pointer;
+}
+.card {
+ margin-bottom: 20px;
+ padding: 20px;
+ box-shadow: 0 2px 12px 0 rgba(0,0,0,.1);
+ margin-left: 12px;
+ margin-right: 12px;
+}
+.card .top {
+ margin-bottom: 20px;
+ position: relative;
+}
+.card .top .title img {
+ width: 42px;
+ height: 42px;
+ vertical-align: middle;
+}
+.card .top .title .desc {
+ color: #bbb;
+ font-size: 14px;
+ margin: 20px 0;
+}
+.card .top .btn {
+ position: absolute;
+ right: 30px;
+ top: 20px;
+}
+.card .top .title .taginfo {
+ color: #3b8e8e;
+ border: 1px solid #3b8e8e;
+ border-radius: 4px;
+ font-size: 14px;
+ margin-left: 10px;
+ padding: 2px 8px;
+}
+.card .bottom {
+ padding-top: 20px;
+ border-top: 1px solid #ebebeb;
+}
+.card .bottom .info {
+ border: 1px solid #ebebeb;
+ width: 378px;
+ display: flex;
+ padding: 20px;
+}
+.card .bottom .info .img {
+ background-color: #3b8e8e;
+ border-radius: 6px;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+}
+.card .bottom .info .img, .card .bottom .info img {
+ width: 46px;
+ height: 46px;
+}
+.card .bottom .info .img i {
+ font-size: 28px;
+ color: #fff;
+}
+.card .bottom .info .info-right {
+ flex: 1;
+ display: inline-block;
+ margin-left: 20px;
+}
+.card .bottom .info .info-right .tag {
+ display: flex;
+}
+.card .bottom .info .info-right .tag div {
+ flex: 1;
+ font-size: 14px;
+}
+.card .bottom .info .info-right .tag span{
+ color: #3b8e8e;
+ cursor: pointer;
+ padding: 0 !important;
+ min-height: 14px !important;
+}
+.card .bottom .info .info-right .time {
+ margin-top: 10px;
+ color: #bbb;
+ font-size: 14px;
+}
</style>
--
Gitblit v1.9.3