|
|
@@ -3,27 +3,26 @@
|
|
|
<el-dialog
|
|
|
v-loading="loading"
|
|
|
:visible.sync="visible"
|
|
|
- :close-on-press-escape="false"
|
|
|
+ :close-on-press-escape="true"
|
|
|
:close-on-click-modal="false"
|
|
|
:show-close="false"
|
|
|
append-to-body
|
|
|
custom-class="home-edit-dialog"
|
|
|
- title="My"
|
|
|
+ title="我的业务设置"
|
|
|
>
|
|
|
<div class="drag-container">
|
|
|
<div v-loading="allLoading" class="drag-left">
|
|
|
- <div class="drag-title">list</div>
|
|
|
- <div class="item-filter">
|
|
|
- <el-form ref="filterForm" :model="formData" inline size="mini">
|
|
|
- <el-form-item label="system">
|
|
|
+ <div class="filter-title">业务列表</div>
|
|
|
+ <div class="list-filter">
|
|
|
+ <el-form ref="filterForm" :model="formData" inline size="small">
|
|
|
+ <el-form-item label="应用名称">
|
|
|
<el-input v-model="formData.systemName" clearable class="filter-item-input" />
|
|
|
</el-form-item>
|
|
|
- <el-form-item label="business">
|
|
|
+ <el-form-item label="业务名称">
|
|
|
<el-input v-model="formData.businessName" clearable class="filter-item-input" />
|
|
|
</el-form-item>
|
|
|
<el-form-item>
|
|
|
- <el-button type="primary" @click="searchTable">search</el-button>
|
|
|
- <!-- <el-button type="danger" @click="resetTable('filterForm')">reset</el-button> -->
|
|
|
+ <el-button type="primary" @click="searchTable">查询</el-button>
|
|
|
</el-form-item>
|
|
|
</el-form>
|
|
|
</div>
|
|
|
@@ -35,6 +34,7 @@
|
|
|
:move="checkMove"
|
|
|
:set-data="setData"
|
|
|
filter=".filtered"
|
|
|
+ handle=".handle-icon"
|
|
|
class="drag-item-box"
|
|
|
>
|
|
|
<div
|
|
|
@@ -42,9 +42,10 @@
|
|
|
:key="element.id"
|
|
|
class="drag-item"
|
|
|
:class="{'filtered': element.isFavorite}"
|
|
|
+ @click="jumpTo(element.url)"
|
|
|
>
|
|
|
- <i class="el-icon-plus handle-icon" @click="clickAddItem(index)" />
|
|
|
- <el-avatar :size="56" :src="element.url" />
|
|
|
+ <i class="el-icon-plus handle-icon" @click.stop="clickAddItem(index)" />
|
|
|
+ <el-avatar :size="56" :src="element.icon" />
|
|
|
<div class="item-content">
|
|
|
<div class="item-name">{{ element.businessName }}</div>
|
|
|
<div class="item-system">{{ element.appName }}</div>
|
|
|
@@ -63,8 +64,8 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
<div v-loading="myLoading" class="drag-right">
|
|
|
- <div class="drag-title">My</div>
|
|
|
- <div class="item-tip">tip</div>
|
|
|
+ <div class="filter-title">我的业务</div>
|
|
|
+ <div class="filter-tip">提示：可以通过鼠标拖拽进行排序</div>
|
|
|
<el-scrollbar class="my-scroll-box">
|
|
|
<draggable
|
|
|
:list="myBizData"
|
|
|
@@ -75,7 +76,7 @@
|
|
|
>
|
|
|
<div v-for="(element, index) in myBizData" :key="element.id" class="drag-item">
|
|
|
<i class="el-icon-minus handle-icon" @click="clickRemoveItem(index)" />
|
|
|
- <el-avatar :size="56" src="https://cube.elemecdn.com/3/7c/3ea6beec64369c2642b92c6726f1epng.png" />
|
|
|
+ <el-avatar :size="56" :src="element.icon" />
|
|
|
<div class="item-content">
|
|
|
<div class="item-name">{{ element.businessName }}</div>
|
|
|
<div class="item-system">{{ element.appName }}</div>
|
|
|
@@ -86,8 +87,8 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
<div slot="footer">
|
|
|
- <el-button @click="close">Cancel</el-button>
|
|
|
- <el-button type="primary" @click="saveFavorite">Confirm</el-button>
|
|
|
+ <el-button @click="close">取消</el-button>
|
|
|
+ <el-button type="primary" @click="saveFavorite">确定</el-button>
|
|
|
</div>
|
|
|
</el-dialog>
|
|
|
</div>
|
|
|
@@ -102,32 +103,21 @@ export default {
|
|
|
components: {
|
|
|
draggable
|
|
|
},
|
|
|
- props: {},
|
|
|
data() {
|
|
|
return {
|
|
|
// dialog
|
|
|
visible: false,
|
|
|
// table
|
|
|
current: 1,
|
|
|
- size: 15,
|
|
|
+ size: 18,
|
|
|
allBizTotal: 0,
|
|
|
allBizData: [],
|
|
|
- myBizData: [
|
|
|
- { businessName: 'bizleft4', id: 4 },
|
|
|
- { businessName: 'bizleft5', id: 5 },
|
|
|
- { businessName: 'bizleft6', id: 6 },
|
|
|
- { businessName: 'bizleft7', id: 7 }
|
|
|
- ],
|
|
|
+ myBizData: [],
|
|
|
// filter
|
|
|
formData: {
|
|
|
- systemNumber: '',
|
|
|
systemName: '',
|
|
|
- businessName: '',
|
|
|
- businessNumber: ''
|
|
|
+ businessName: ''
|
|
|
},
|
|
|
- // select data
|
|
|
- systemData: [],
|
|
|
- businessData: [],
|
|
|
// others
|
|
|
loading: false,
|
|
|
allLoading: false,
|
|
|
@@ -198,7 +188,7 @@ export default {
|
|
|
type: 'error',
|
|
|
duration: 0,
|
|
|
showClose: true,
|
|
|
- message: error.message
|
|
|
+ message: '获取业务列表出错：' + error.message
|
|
|
})
|
|
|
})
|
|
|
},
|
|
|
@@ -207,7 +197,7 @@ export default {
|
|
|
this.allLoading = true
|
|
|
const params = {
|
|
|
page: 1,
|
|
|
- size: 50,
|
|
|
+ size: 100,
|
|
|
params: {
|
|
|
delFlag: 0
|
|
|
}
|
|
|
@@ -227,18 +217,26 @@ export default {
|
|
|
type: 'error',
|
|
|
duration: 0,
|
|
|
showClose: true,
|
|
|
- message: error.message
|
|
|
+ message: '获取我的业务出错：' + error.message
|
|
|
})
|
|
|
})
|
|
|
},
|
|
|
saveFavorite() {
|
|
|
this.loading = true
|
|
|
- pushSaveFavorite(this.myBizData).then(res => {
|
|
|
+ const data = []
|
|
|
+ for (let i = 0; i < this.myBizData.length; i++) {
|
|
|
+ data.push({
|
|
|
+ 'appId': this.myBizData[i].appId,
|
|
|
+ 'businessId': this.myBizData[i].id,
|
|
|
+ 'seq': i + 1
|
|
|
+ })
|
|
|
+ }
|
|
|
+ pushSaveFavorite(data).then(res => {
|
|
|
this.loading = false
|
|
|
this.visible = false
|
|
|
this.$message({
|
|
|
type: 'success',
|
|
|
- message: 'Save Successfully!'
|
|
|
+ message: '保存成功!'
|
|
|
})
|
|
|
}).catch(error => {
|
|
|
console.log(error)
|
|
|
@@ -247,7 +245,7 @@ export default {
|
|
|
type: 'error',
|
|
|
duration: 0,
|
|
|
showClose: true,
|
|
|
- message: error.message
|
|
|
+ message: '保存出错：' + error.message
|
|
|
})
|
|
|
})
|
|
|
},
|
|
|
@@ -263,6 +261,9 @@ export default {
|
|
|
close() {
|
|
|
this.visible = false
|
|
|
},
|
|
|
+ jumpTo(link) {
|
|
|
+ window.open(link, '_blank')
|
|
|
+ },
|
|
|
clone(item) {
|
|
|
return { ...item }
|
|
|
},
|
|
|
@@ -301,19 +302,22 @@ export default {
|
|
|
.drag-left, .drag-right {
|
|
|
width: 50%;
|
|
|
padding: 0 0 20px 20px;
|
|
|
- max-height: 540px;
|
|
|
}
|
|
|
|
|
|
.drag-left {
|
|
|
background-color: #F8F9F9;
|
|
|
position: relative;
|
|
|
+ max-height: 634px;
|
|
|
|
|
|
.page {
|
|
|
position: absolute;
|
|
|
bottom: 0;
|
|
|
left: 0;
|
|
|
width: 100%;
|
|
|
- text-align: center;
|
|
|
+
|
|
|
+ .el-pagination {
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
|
|
|
::v-deep {
|
|
|
.btn-prev, .btn-next, .el-pager li{
|
|
|
@@ -324,8 +328,10 @@ export default {
|
|
|
}
|
|
|
|
|
|
.drag-right {
|
|
|
+ max-height: 770px;
|
|
|
+
|
|
|
.my-scroll-box {
|
|
|
- // 48 = drag-title + item-tip - drag-right.margin-bottom
|
|
|
+ // 48 = filter-title + filter-tip - drag-right.margin-bottom
|
|
|
height: calc(100% - 48px);
|
|
|
margin-top: -2px;
|
|
|
}
|
|
|
@@ -341,21 +347,28 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
|
|
|
- .drag-title {
|
|
|
+ .filter-title {
|
|
|
font-size: 14px;
|
|
|
+ color: rgba(0,0,0,0.85);
|
|
|
+ font-weight: 550;
|
|
|
line-height: 2;
|
|
|
height: 28px;
|
|
|
- color: rgba(0,0,0,0.85);
|
|
|
}
|
|
|
|
|
|
- .item-filter, .item-tip {
|
|
|
+ .list-filter, .filter-tip {
|
|
|
height: 40px;
|
|
|
}
|
|
|
|
|
|
- .item-tip {
|
|
|
+ .filter-tip {
|
|
|
font-size: 12px;
|
|
|
- line-height: 40px;
|
|
|
color: rgba(0,0,0,0.65);
|
|
|
+ line-height: 40px;
|
|
|
+
|
|
|
+ &::before{
|
|
|
+ content: "*";
|
|
|
+ color: #ff4949;
|
|
|
+ margin-right: 2px;
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
.filter-item-input {
|
caiaa