From 12e90cca31d377e28cfe5c6442509841991308e9 Mon Sep 17 00:00:00 2001
From: hanbaoshan <hanbaoshan@aiotlink.com>
Date: 星期四, 25 二月 2021 11:00:57 +0800
Subject: [PATCH] ztree分析图标着色；应用中心产品详情弹框初步搭建
---
src/pages/ai/index/App.vue | 158 +++++++++++++++++++++++++++++-----------------------
1 files changed, 87 insertions(+), 71 deletions(-)
diff --git a/src/pages/ai/index/App.vue b/src/pages/ai/index/App.vue
index 95dfb60..51b3a61 100644
--- a/src/pages/ai/index/App.vue
+++ b/src/pages/ai/index/App.vue
@@ -176,7 +176,7 @@
<div>褰撳墠鐗堟湰:{{item.version}}</div>
<div v-if="item.remoteVersion">鏈�鏂扮増鏈�:{{item.remoteVersion}}</div>
</div>
- <div class="info-onmask">鏌ョ湅璇︽儏</div>
+ <div class="info-onmask" @click="checkDetail(item)">鏌ョ湅璇︽儏</div>
<div class="mask-btn">
<el-button
v-if="!item.isDefault"
@@ -443,7 +443,7 @@
<div>褰撳墠鐗堟湰:{{item.version}}</div>
<div v-if="item.remoteVersion">鏈�鏂扮増鏈�:{{item.remoteVersion}}</div>
</div>
- <div class="info-onmask">鏌ョ湅璇︽儏</div>
+ <div class="info-onmask" @click="checkDetail(item)">鏌ョ湅璇︽儏</div>
<div class="mask-btn">
<el-button
@click="unLoadSdk(item)"
@@ -499,7 +499,7 @@
<div>褰撳墠鐗堟湰:{{item.version}}</div>
<div v-if="item.remoteVersion">鏈�鏂扮増鏈�:{{item.remoteVersion}}</div>
</div>
- <div class="info-onmask">鏌ョ湅璇︽儏</div>
+ <div class="info-onmask" @click="checkDetail(item)">鏌ョ湅璇︽儏</div>
<div class="mask-btn">
<el-button
v-if="!item.isDefault"
@@ -595,57 +595,72 @@
<el-button type="primary" @click="offlineInstall">瀹� 瑁�</el-button>
</div>
</el-dialog>
- <!-- <div class="draggable-box" v-if="productDetailShow" > -->
- <div class="draggable-box" v-if="false" >
- <div class="box-top">
- <div class="top-left">
- <div class="banner">
- <!-- <el-carousel
- ref="carousel"
- :autoplay="false"
- indicator-position="none"
- :arrow="curCheckTarget.pics.length > 1 ? 'always' : 'never'"
- @change="changeHandle"
- >
- <el-carousel-item v-for="(item, index) in curCheckTarget.pics" :key="index">
- <div class="imgwrap">
- <img
- v-if="item.type=='image'"
- :src="'/httpImage/'+item.url"
- class="cursor-pointer"
- preview
- />
- <video v-if="item.type=='video'" :src="'/httpImage/'+item.url" controls></video>
- </div>
- </el-carousel-item>
- </el-carousel> -->
- </div>
- </div>
- <div class="top-right">
- <div class="summary">
- <div class="icon"></div>
- <div class="name"></div>
- <!-- <div class="tags">
- <span
- class="tag"
- v-for="(id, index) in data.productLabelId"
- :key="index+'i'"
- >{{showNameById(id)}}</span>
- </div> -->
- <div class="btns">
- <el-button size="mini">鍗囩骇</el-button>
- <el-button size="mini">鍗歌浇</el-button>
- <el-button size="mini">鎵撳紑</el-button>
+ <!-- <div class="dialog-content" v-if="productDetailVisible" > -->
+ <el-dialog
+ class="product-detail-dialog"
+ :visible="productDetailVisible"
+ @close="productDetailVisible=false"
+ >
+ <div class="dialog-title" slot="title">绠楁硶/搴旂敤璇︽儏</div>
+ <div class="dialog-content">
+ <div class="box-top">
+ <div class="top-left">
+ <div class="banner">
+ <!-- <el-carousel
+ ref="carousel"
+ :autoplay="false"
+ indicator-position="none"
+ :arrow="curCheckTarget.pics.length > 1 ? 'always' : 'never'"
+ @change="changeHandle"
+ >
+ <el-carousel-item v-for="(item, index) in curCheckTarget.pics" :key="index">
+ <div class="imgwrap">
+ <img
+ v-if="item.type=='image'"
+ :src="'/httpImage/'+item.url"
+ class="cursor-pointer"
+ preview
+ />
+ <video v-if="item.type=='video'" :src="'/httpImage/'+item.url" controls></video>
+ </div>
+ </el-carousel-item>
+ </el-carousel>-->
</div>
</div>
- <div class="product-intruduction">
- <div class="title">浜у搧绠�浠�</div>
+ <div class="top-right">
+ <div class="summary">
+ <div class="icon"></div>
+ <div class="name"></div>
+ <!-- <div class="tags">
+ <span
+ class="tag"
+ v-for="(id, index) in curCheckTarget.productLabelId"
+ :key="index+'i'"
+ >{{showNameById(id)}}</span>
+ </div>-->
+ <div class="btns">
+ <el-button size="mini">鍗囩骇</el-button>
+ <el-button size="mini">鍗歌浇</el-button>
+ <el-button size="mini">鎵撳紑</el-button>
+ </div>
+ </div>
+ <div class="product-intruduction">
+ <div class="title">浜у搧绠�浠�</div>
+ </div>
+ </div>
+ </div>
+ <div class="box-bot">
+ <div class="bot-left">
+ <div class="part-title">鍔熻兘鐗圭偣</div>
+
+ </div>
+ <div class="bot-right">
+ <div class="part-title">鎺ㄨ崘绠楁硶</div>
</div>
</div>
</div>
- <div class="box-bot"></div>
- </div>
+ </el-dialog>
</div>
</template>
<script>
@@ -661,8 +676,8 @@
FileUploader
},
computed: {
- updateNum(){
- return this.hasNewVersionApp.length+this.hasNewVersionSdk.length
+ updateNum () {
+ return this.hasNewVersionApp.length + this.hasNewVersionSdk.length
},
// notInstalledList () {
// return this.sdkList.filter(sdk => {
@@ -701,7 +716,6 @@
sdkList: [],
installedList: [],
hasNewVersionSdk: [],
- updateNum: 0,
hasNewVersionApp: [],
notInstalledList: [],
buttonAuthority: sessionStorage.getItem("buttonAuthoritys") || [],
@@ -742,7 +756,7 @@
sdkUpgreading: true,
autoRefresh: true,
curCheckTarget: {},
- productDetailShow: false,
+ productDetailVisible: false,
}
},
directives: {
@@ -766,20 +780,21 @@
isShow (authority) {
return this.isAdmin || this.buttonAuthority.indexOf("," + authority + ",") > -1
},
- batchUpdate(type){
- if(type=="sdk"){
- this.hasNewVersionSdk.forEach(sdk=>{
+ batchUpdate (type) {
+ if (type == "sdk") {
+ this.hasNewVersionSdk.forEach(sdk => {
this.donwload(sdk)
})
- }else{
- this.hasNewVersionApp.forEach(app=>{
- this.downloadApp(app,'upgrade')
+ } else {
+ this.hasNewVersionApp.forEach(app => {
+ this.downloadApp(app, 'upgrade')
})
}
},
checkDetail (item) {
this.curCheckTarget = item;
- this.productDetailShow = true;
+ debugger
+ this.productDetailVisible = true;
},
//绂荤嚎瀹夎
offlineInstall () {
@@ -1158,23 +1173,24 @@
width: 100%;
height: 100%;
}
+ .product-detail-dialog {
+ .el-dialog__header {
+ text-align: center;
+ }
+ .dialog-content{
+ .box-top {
+ }
+ .box-bot {
+ }
+ }
+ }
}
-.flex-title{
+.flex-title {
display: flex;
justify-content: space-between;
align-items: center;
}
-.draggable-box{
- width: 1000px;
- height: 600px;
- background: aqua;
- position: absolute;
- top: 0;
- left: 0;
- right: 0;
- bottom: 0;
- margin: auto;
-}
+
.el-loading-mask .el-loading-spinner {
top: 40px !important;
}
--
Gitblit v1.8.0