From f28363d03c3539b0219c5b58ea8b7db37d50be6f Mon Sep 17 00:00:00 2001
From: gaoshp <291585735@qq.com>
Date: 星期二, 23 四月 2024 22:34:17 +0800
Subject: [PATCH] 编辑时间轴组件
---
src/views/console/soam/oss-system.vue | 205 ++++++++++++++++++++++++++++++++++++++++++++++-----
1 files changed, 184 insertions(+), 21 deletions(-)
diff --git a/src/views/console/soam/oss-system.vue b/src/views/console/soam/oss-system.vue
index 1120d5e..47b1265 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-03-29 18:27:53
+ * @LastEditTime: 2024-04-03 14:46:31
* @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
-->
@@ -11,21 +11,21 @@
<el-tabs tab-position="left" style="height: 800px" class="demo-tabs">
<el-tab-pane label="鏂囦欢瀛樺偍">
<div class="tabTitle">鏂囦欢瀛樺偍</div>
- <el-form :model="ossForm" ref="ossForm" label-width="120px">
+ <el-form :model="ossForm" label-width="120px">
<el-row>
<el-col :span="24">
- <el-form-item label="endpoint" prop="endpoint">
+ <el-form-item label="endpoint">
<el-input v-model="ossForm.endpoint" clearable></el-input>
</el-form-item>
</el-col>
<el-col :span="24">
- <el-form-item label="acceskey" prop="acceskey">
- <el-input v-model="ossForm.acceskey" clearable></el-input>
+ <el-form-item label="acceskey">
+ <el-input v-model="ossForm.accessKey" clearable></el-input>
</el-form-item>
</el-col>
<el-col :span="24">
- <el-form-item label="secretkey" prop="secretkey">
- <el-input v-model="ossForm.secretkey" clearable></el-input>
+ <el-form-item label="secretkey">
+ <el-input v-model="ossForm.secretKey" clearable></el-input>
</el-form-item>
</el-col>
<el-col :span="24">
@@ -39,8 +39,8 @@
<el-tab-pane label="搴旂敤璁剧疆">
<div class="tabTitle">搴旂敤璁剧疆</div>
<ul class="show-list">
- <li class="active">
- <div class="edit">缂栬緫</div>
+ <li :class="{active: active.isA}" @click="changeLi('isA')">
+ <div class="edit" @click="editBtn('isA')">缂栬緫</div>
<div class="logo">
<img src="http://116.63.155.153:83/api/static/images/cps.png">
</div>
@@ -49,12 +49,67 @@
<div class="domain">http://192.168.1.199</div>
</div>
</li>
- <li>2</li>
- <li>3</li>
+ <li :class="{active: active.isB}" @click="changeLi('isB')">
+ <div class="edit" @click="editBtn('isB')">缂栬緫</div>
+ <div class="logo">
+ <img src="http://116.63.155.153:83/api/static/images/vision.png">
+ </div>
+ <div class="content">
+ <div class="name">澶у睆</div>
+ <div class="domain">http://192.168.1.199:31005</div>
+ </div>
+ </li>
+ <li :class="{active: active.isC}" @click="changeLi('isC')">
+ <div class="edit" @click="editBtn('isC')">缂栬緫</div>
+ <div class="logo">
+ <img src="http://116.63.155.153:83/api/static/images/hmi.png">
+ </div>
+ <div class="content">
+ <div class="name">HMI</div>
+ <div class="domain"></div>
+ </div>
+ </li>
</ul>
- <el-form label-width="80px">
-
- </el-form>
+ <el-card class="system-content">
+ <template #header>
+ <div class="card-header">
+ <span v-if="!isEdit">搴旂敤璇︽儏</span>
+ <span v-if="isEdit">缂栬緫搴旂敤</span>
+ <div v-if="isEdit">
+ <el-button @click="cencelBtn" >鍙� 娑�</el-button>
+ <el-button type="primary" :loading="isSaveing" @click="sysSubmit">淇� 瀛�</el-button>
+ </div>
+ </div>
+ </template>
+ <el-form :model="searchData" abel-width="120px">
+ <el-form-item label="绯荤粺灞曠ず" v-if="!isEdit">
+ <el-switch v-model="searchData.isShow" disabled/>
+ </el-form-item>
+ <el-form-item label="绯荤粺灞曠ず" v-if="isEdit">
+ <el-switch v-model="searchData.isShow"/>
+ </el-form-item>
+ <el-form-item label="搴旂敤鍚嶇О" v-if="!isEdit">
+ <div>{{searchData.name}}</div>
+ </el-form-item>
+ <el-form-item label="搴旂敤鍚嶇О" v-if="isEdit">
+ <el-input v-model="searchData.name" placeholder="搴旂敤鍚嶇О" clearable></el-input>
+ </el-form-item>
+ <el-form-item label="搴旂敤鏍囪瘑">
+ <div>{{searchData.code}}</div>
+ </el-form-item>
+ <el-form-item label="缃戦〉鍦板潃" v-if="!isEdit">
+ <div>{{searchData.domain}}</div>
+ </el-form-item>
+ <el-form-item label="缃戦〉鍦板潃" v-if="isEdit">
+ <el-input v-model="searchData.domain" placeholder="缃戦〉鍦板潃" clearable></el-input>
+ </el-form-item>
+ <el-form-item label="涓婁紶鍥炬爣">
+ <div>
+ <img :src="searchData.logo" style="width:66px;height:66px;">
+ </div>
+ </el-form-item>
+ </el-form>
+ </el-card>
</el-tab-pane>
</el-tabs>
</div>
@@ -65,11 +120,27 @@
name: "oss-main",
data(){
return {
+ isSaveing: false,
+ isEdit: false,
+ active: {
+ isA: true,
+ isB: false,
+ isC: false
+ },
+ searchData: {
+ isShow: true,
+ name: "",
+ code: "",
+ domain: "",
+ logo: "",
+ backgroundUrl: ""
+ },
ossForm: {
endpoint: "",
- acceskey: "",
- secretkey: ""
- }
+ accessKey: "",
+ secretKey: ""
+ },
+ temData: []
}
},
components: {},
@@ -77,12 +148,87 @@
},
mounted(){
-
+ this.getOssUpdata(); //鏂囦欢瀛樺偍
+ this.setting(); //搴旂敤璁剧疆
},
methods: {
- ossUpdata(){
-
- }
+ cencelBtn() {
+ this.isEdit=false;
+ this.isSaveing = false;
+ },
+ sysSubmit() {
+ this.isSaveing = true;
+ var obj = {...this.searchData};
+ if(obj.isShow == true) {
+ obj.isShow = "1";
+ }else {
+ obj.isShow = "0";
+ }
+ this.$HTTP.put("/api/blade-system/application/update",obj).then(res=> {
+ if(res.code == 200) {
+ this.$message({
+ message: "鎿嶄綔鎴愬姛",
+ type: "success"
+ })
+ this.cencelBtn();
+ }
+ })
+ },
+ editBtn(name) {
+ this.isEdit = true;
+ },
+ setting() {
+ this.$HTTP.get("/api/blade-system/application/list").then(res=> {
+ if(res.code == 200) {
+ res.data.forEach(item=> {
+ if(item.isShow == "1") {
+ item.isShow = true;
+ }else {
+ item.isShow = false;
+ }
+ })
+ this.temData = res.data;
+ this.searchData = this.temData[0];
+ }
+ })
+ },
+ changeLi(name) {
+ for(var key in this.active) {
+ if(key === name) {
+ this.active[name] = true;
+ }else {
+ this.active[key] = false;
+ }
+ switch(name) {
+ case "isA":
+ this.searchData = this.temData[0];
+ break;
+ case "isB":
+ this.searchData = this.temData[1];
+ break;
+ case "isC":
+ this.searchData = this.temData[2];
+ break;
+ }
+ }
+ },
+ ossUpdata() {
+ this.$HTTP.post("/api/blade-resource/oss/update",this.ossForm).then(res=> {
+ if(res.code == 200) {
+ this.$message({
+ message: "鏇存柊鎴愬姛",
+ type: "success"
+ })
+ }
+ })
+ },
+ getOssUpdata(){
+ this.$HTTP.get("/api/blade-resource/oss/detail").then(res=> {
+ if(res.code == 200) {
+ this.ossForm = res.data;
+ }
+ })
+ }
}
}
</script>
@@ -158,4 +304,21 @@
word-wrap: break-word;
word-break: break-all;
}
+.system-content /deep/ .el-card__header{
+ padding: 0px;
+}
+.system-content .card-header{
+ border-bottom: 1px solid #ebeef5;
+ padding: 12px 18px!important;
+ position: relative;
+}
+.system-content .card-header span{
+ font-size:13px;
+ font-weight: 400px;
+}
+.system-content .card-header > div {
+ position: absolute;
+ top: 6px;
+ right: 22px;
+}
</style>
--
Gitblit v1.9.3