fix:通过模板新增dashboard优化

This commit is contained in:
zyh
2022-12-07 14:16:35 +08:00
parent 84c425b186
commit 8a31717262
4 changed files with 23 additions and 38 deletions

View File

@@ -186,6 +186,6 @@
// padding: 8px 0; // padding: 8px 0;
box-sizing: border-box; box-sizing: border-box;
.el-dropdown-menu__item{ .el-dropdown-menu__item{
line-height: 32px; // line-height: 32px;
} }
} }

View File

@@ -1,4 +1,3 @@
import i18n from '@/components/common/i18n'
import { getUUID } from '../js/common' import { getUUID } from '../js/common'
export default { export default {
data () { data () {

View File

@@ -163,8 +163,7 @@ export default {
// 其他tab的数据我的收藏、我的创建、最近浏览数据 // 其他tab的数据我的收藏、我的创建、最近浏览数据
otherData: [], otherData: [],
// 收藏列表 // 收藏列表
starredList: [], starredList: []
visible: false
} }
}, },
methods: { methods: {

View File

@@ -16,7 +16,7 @@
<!-- dashboardTemplate --> <!-- dashboardTemplate -->
<el-form-item :label="$t('upload.template')" prop="tmplId"> <el-form-item :label="$t('upload.template')" prop="tmplId">
<v-selectpage <v-selectpage
:data="dashboardList" :data="templateList"
:tb-columns="ChartSearchShowFields" :tb-columns="ChartSearchShowFields"
:multiple="false" :multiple="false"
:language="language" :language="language"
@@ -29,27 +29,11 @@
@values="tempChange" @values="tempChange"
></v-selectpage> ></v-selectpage>
</el-form-item> </el-form-item>
<!-- link(asset) --> <!-- link -->
<el-form-item :label="$t('asset.asset')" prop="link" v-if="selectedTemp.varType==1" key="asset"> <el-form-item v-if="templateType" :label="templateType==1?$t('asset.asset'):$t('asset.endpoint')" prop="link" key="link">
<v-selectpage <v-selectpage
:data="dataList" :data="dataList"
:tb-columns="assetColumns" :tb-columns="templateType==1?assetColumns:endpointColumns"
:multiple="false"
:language="language"
key-field="id"
show-field="name"
:width="640"
v-model="editDashboard.link"
class="form-control"
:result-format="resultFormat"
@values="linkChange"
></v-selectpage>
</el-form-item>
<!-- link(endpoint) -->
<el-form-item :label="$t('asset.endpoint')" prop="link" v-else-if="selectedTemp.varType==2" key="endpoint">
<v-selectpage
:data="dataList"
:tb-columns="endpointColumns"
:multiple="false" :multiple="false"
:language="language" :language="language"
key-field="id" key-field="id"
@@ -88,12 +72,14 @@
<script> <script>
import bus from '@/libs/bus' import bus from '@/libs/bus'
import editRigthBox from '../mixin/editRigthBox'
export default { export default {
props: { props: {
}, },
mixins: [editRigthBox],
data () { data () {
return { return {
url: 'visual/panel/fromTmpl', url: '/visual/panel/fromTmpl',
rules: { rules: {
name: [ name: [
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } { required: true, message: this.$t('validate.required'), trigger: 'blur' }
@@ -208,26 +194,26 @@ export default {
link: '', link: '',
description: '' description: ''
}, },
dashboardList: [], templateList: [],
dataList: [], dataList: [],
selectedTemp: {} // 选中的dashboard模板 templateType: undefined // 选中模板的varType
} }
}, },
computed: { computed: {
language () { return this.$store.getters.getLanguage } language () { return this.$store.getters.getLanguage }
}, },
mounted () { created () {
this.isEdit = true
this.getDashboardTempData() this.getDashboardTempData()
}, },
methods: { methods: {
// 选中的模板变化 // 选中的模板变化
tempChange: bus.debounce(function (val) { tempChange: bus.debounce(function (val) {
this.editDashboard.link = '' const newValue = this.$loadsh.get(val, ['0', 'varType'])
const newValue = val.length ? val[0] : {} const oldValue = this.templateType
const oldValue = this.$loadsh.cloneDeep(this.selectedTemp) this.templateType = newValue
this.selectedTemp = this.$loadsh.cloneDeep(newValue)
// 判断varType是否变化 // 判断varType是否变化
if (oldValue.varType != newValue.varType) { if (oldValue != newValue) {
this.getTableData() this.getTableData()
} }
this.$refs.form.validateField('tmplId') this.$refs.form.validateField('tmplId')
@@ -240,16 +226,17 @@ export default {
getDashboardTempData () { getDashboardTempData () {
this.$get('visual/panel', { type: 'template', pageSize: -1 }).then(response => { this.$get('visual/panel', { type: 'template', pageSize: -1 }).then(response => {
if (response.code === 200) { if (response.code === 200) {
this.dashboardList = response.data.list this.templateList = response.data.list
} }
}) })
}, },
// 根据选中模板vartype请求数据 // 根据选中模板vartype请求数据
getTableData () { getTableData () {
this.editDashboard.link = ''
this.dataList = [] this.dataList = []
if (this.selectedTemp.varType === 1) { if (this.templateType === 1) {
this.getAssetData() this.getAssetData()
} else if (this.selectedTemp.varType === 2) { } else if (this.templateType === 2) {
this.getEndpointData() this.getEndpointData()
} }
}, },
@@ -277,8 +264,8 @@ export default {
const params = this.$loadsh.cloneDeep(this.editDashboard) const params = this.$loadsh.cloneDeep(this.editDashboard)
this.$refs.form.validate((valid) => { this.$refs.form.validate((valid) => {
if (valid) { if (valid) {
// 模板varType ≠ 0时有效且必填 // 模板varType ≠ 0时link有效且必填
if (this.selectedTemp.varType == 0) { if (this.templateType == 0) {
delete params.link delete params.link
} }
this.$post(this.url, params).then(response => { this.$post(this.url, params).then(response => {