代码调整
This commit is contained in:
parent
00359591b5
commit
5dc7de9ded
@ -2,39 +2,39 @@ import elementConst from './elementConst';
|
|||||||
import form2Base from './form2Base';
|
import form2Base from './form2Base';
|
||||||
|
|
||||||
const formBuilder = {
|
const formBuilder = {
|
||||||
buildForm(el) {
|
buildForm(el) {
|
||||||
const form = {};
|
const form = {};
|
||||||
form.type = el.type;
|
form.type = el.type;
|
||||||
form.name = el.name;
|
form.name = el.name;
|
||||||
form.formGroup = [];
|
form.formGroup = [];
|
||||||
form.model = {};
|
form.model = {};
|
||||||
|
|
||||||
// 添加通用配置
|
// 添加通用配置
|
||||||
form.model['base'] = {};
|
form.model['base'] = {};
|
||||||
form2Base.forEach(each=>{
|
form2Base.forEach(each=>{
|
||||||
form.model['base'][each.prop] = each.value;
|
form.model['base'][each.prop] = each.value;
|
||||||
});
|
});
|
||||||
form.formGroup.push({name:'通用配置', type:'base', styleList:form2Base});
|
form.formGroup.push({name:'通用配置', type:'base', styleList:form2Base});
|
||||||
|
|
||||||
const list = [{name:'绘图配置', type:'shape'}, {name:'样式配置', type:'style'}];
|
const list = [{name:'绘图配置', type:'shape'}, {name:'样式配置', type:'style'}];
|
||||||
list.forEach(eachType=>{
|
list.forEach(eachType=>{
|
||||||
form.model[eachType.type] = {};
|
form.model[eachType.type] = {};
|
||||||
const eachList = el.formList[eachType.type];
|
const eachList = el.formList[eachType.type];
|
||||||
eachList.forEach(each=>{
|
eachList.forEach(each=>{
|
||||||
form.model[eachType.type][each.prop] = each.value;
|
form.model[eachType.type][each.prop] = each.value;
|
||||||
});
|
});
|
||||||
form.formGroup.push({name:eachType.name, type: eachType.type, styleList:eachList});
|
form.formGroup.push({name:eachType.name, type: eachType.type, styleList:eachList});
|
||||||
});
|
});
|
||||||
return form;
|
return form;
|
||||||
},
|
},
|
||||||
buildFormList() {
|
buildFormList() {
|
||||||
const formList = [];
|
const formList = [];
|
||||||
const elementList = Object.values(elementConst);
|
const elementList = Object.values(elementConst);
|
||||||
elementList.forEach(el=>{
|
elementList.forEach(el=>{
|
||||||
formList.push(this.buildForm(el));
|
formList.push(this.buildForm(el));
|
||||||
});
|
});
|
||||||
return formList;
|
return formList;
|
||||||
}
|
}
|
||||||
}
|
};
|
||||||
|
|
||||||
export default formBuilder;
|
export default formBuilder;
|
||||||
|
@ -1,10 +1,10 @@
|
|||||||
import Vue from 'vue';
|
import Vue from 'vue';
|
||||||
import { getBaseUrl } from '@/utils/baseUrl'
|
import { getBaseUrl } from '@/utils/baseUrl';
|
||||||
|
|
||||||
// 创建或者打开数据库
|
// 创建或者打开数据库
|
||||||
export function openIndexedDB() {
|
export function openIndexedDB() {
|
||||||
const baseUrl = getBaseUrl();
|
const baseUrl = getBaseUrl();
|
||||||
const indexedDBName = baseUrl.replace(/http.?:\/\/(.*)[\/|:].*/, "$1");
|
const indexedDBName = baseUrl.replace(/http.?:\/\/(.*)[\/|:].*/, '$1');
|
||||||
const request = window.indexedDB.open(indexedDBName, 1);
|
const request = window.indexedDB.open(indexedDBName, 1);
|
||||||
request.onerror = function (event) {
|
request.onerror = function (event) {
|
||||||
console.log('数据库打开报错');
|
console.log('数据库打开报错');
|
||||||
@ -18,7 +18,7 @@ export function openIndexedDB() {
|
|||||||
Vue.prototype.$db = event.target.result;
|
Vue.prototype.$db = event.target.result;
|
||||||
Vue.prototype.$db.createObjectStore('mapData', { keyPath: 'id' });
|
Vue.prototype.$db.createObjectStore('mapData', { keyPath: 'id' });
|
||||||
Vue.prototype.$db.createObjectStore('runPlan', { keyPath: 'templateId' });
|
Vue.prototype.$db.createObjectStore('runPlan', { keyPath: 'templateId' });
|
||||||
Vue.prototype.$db.createObjectStore('composeList', { keyPath: 'id' });
|
Vue.prototype.$db.createObjectStore('composeTemplateList', { keyPath: 'id' });
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
// 新增数据
|
// 新增数据
|
||||||
|
@ -20,7 +20,7 @@
|
|||||||
<el-select v-model="props.row.defaultStyleSelect" size="mini">
|
<el-select v-model="props.row.defaultStyleSelect" size="mini">
|
||||||
<el-option v-for="(eachStyle) in styleSelectList" :key="eachStyle.value" :label="eachStyle.label" :value="eachStyle.value" />
|
<el-option v-for="(eachStyle) in styleSelectList" :key="eachStyle.value" :label="eachStyle.label" :value="eachStyle.value" />
|
||||||
</el-select>
|
</el-select>
|
||||||
<el-button type="primary" size="mini" class="addStyle" @click="addStyle(props.$index)">添加</el-button>
|
<el-button type="primary" size="mini" class="addStyle" @click="addStyle(props.$index,'style')">添加</el-button>
|
||||||
</div>
|
</div>
|
||||||
<div v-if="props.row.style" class="styleInList">
|
<div v-if="props.row.style" class="styleInList">
|
||||||
<div v-for="(eachStyleInfo,index) in Object.keys(props.row.style)" :key="index" class="eachStyleInfo">
|
<div v-for="(eachStyleInfo,index) in Object.keys(props.row.style)" :key="index" class="eachStyleInfo">
|
||||||
@ -41,10 +41,10 @@
|
|||||||
<el-select v-model="props.row.defaultShapeSelect" size="mini">
|
<el-select v-model="props.row.defaultShapeSelect" size="mini">
|
||||||
<el-option v-for="(eachShape) in shapeSelectList" :key="eachShape.value" :label="eachShape.label" :value="eachShape.value" />
|
<el-option v-for="(eachShape) in shapeSelectList" :key="eachShape.value" :label="eachShape.label" :value="eachShape.value" />
|
||||||
</el-select>
|
</el-select>
|
||||||
<el-button type="primary" size="mini" class="addStyle" @click="addShape(props.$index)">添加</el-button>
|
<el-button type="primary" size="mini" class="addStyle" @click="addStyle(props.$index,'shape')">添加</el-button>
|
||||||
</div>
|
</div>
|
||||||
<div v-if="props.row.Shape" class="styleInList">
|
<div v-if="props.row.shape" class="styleInList">
|
||||||
<div v-for="(eachShapeInfo,index) in Object.keys(props.row.Shape)" :key="index" class="eachStyleInfo">
|
<div v-for="(eachShapeInfo,index) in Object.keys(props.row.shape)" :key="index" class="eachStyleInfo">
|
||||||
<each-form-item
|
<each-form-item
|
||||||
:prop="eachShapeInfo"
|
:prop="eachShapeInfo"
|
||||||
:data="formModel.stateList[props.$index].shape"
|
:data="formModel.stateList[props.$index].shape"
|
||||||
@ -156,26 +156,16 @@ export default {
|
|||||||
// // this.$iscs
|
// // this.$iscs
|
||||||
// }
|
// }
|
||||||
// },
|
// },
|
||||||
addStyle(index) {
|
addStyle(index, type) {
|
||||||
const style = this.formModel.stateList[index].style;
|
const style = this.formModel.stateList[index][type];
|
||||||
if (!style) {
|
if (!style) {
|
||||||
this.$set(this.formModel.stateList[index], 'style', {});
|
this.$set(this.formModel.stateList[index], type, {});
|
||||||
}
|
}
|
||||||
const data = this.formModel.stateList[index];
|
const data = this.formModel.stateList[index];
|
||||||
if (!data.style[data.defaultStyleSelect] && data.defaultStyleSelect) {
|
const dataName = 'default' + type.replace(type[0], type[0].toUpperCase()) + 'Select';
|
||||||
const other = utils.deepClone(this.formModel.style[data.defaultStyleSelect]);
|
if (!data[type][data[dataName]] && data[dataName]) {
|
||||||
this.$set(this.formModel.stateList[index].style, data.defaultStyleSelect, other);
|
const other = utils.deepClone(this.formModel[type][data[dataName]]);
|
||||||
}
|
this.$set(this.formModel.stateList[index][type], data[dataName], other);
|
||||||
},
|
|
||||||
addShape(index) {
|
|
||||||
const shape = this.formModel.stateList[index].shape;
|
|
||||||
if (!shape) {
|
|
||||||
this.$set(this.formModel.stateList[index], 'shape', {});
|
|
||||||
}
|
|
||||||
const data = this.formModel.stateList[index];
|
|
||||||
if (!data.shape[data.defaultShapeSelect] && data.defaultShapeSelect) {
|
|
||||||
const other = utils.deepClone(this.formModel.shape[data.defaultShapeSelect]);
|
|
||||||
this.$set(this.formModel.stateList[index].shape, data.defaultShapeSelect, other);
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
expandChange(row, expandedRows) {
|
expandChange(row, expandedRows) {
|
||||||
|
@ -33,7 +33,7 @@
|
|||||||
<el-button v-show="selected" type="danger" size="small" @click="onDelete">删除</el-button>
|
<el-button v-show="selected" type="danger" size="small" @click="onDelete">删除</el-button>
|
||||||
</div>
|
</div>
|
||||||
</el-tab-pane>
|
</el-tab-pane>
|
||||||
<el-tab-pane label="状态编辑" name="second">
|
<el-tab-pane label="单元素状态编辑" name="second">
|
||||||
<el-tabs v-model="statusTab" class="card" type="card" @tab-click="onSelectTab">
|
<el-tabs v-model="statusTab" class="card" type="card" @tab-click="onSelectTab">
|
||||||
<el-tab-pane v-for="(composeElem,index) in composeElemList" :key="index" :label="composeElem.name" :name="composeElem.code" :lazy="true">
|
<el-tab-pane v-for="(composeElem,index) in composeElemList" :key="index" :label="composeElem.name" :name="composeElem.code" :lazy="true">
|
||||||
<table-form :ref="'tableform'+composeElem.code" :compose-elem="composeElem" />
|
<table-form :ref="'tableform'+composeElem.code" :compose-elem="composeElem" />
|
||||||
@ -43,6 +43,9 @@
|
|||||||
<el-button type="primary" size="small" @click="onSaveStatus">保存</el-button>
|
<el-button type="primary" size="small" @click="onSaveStatus">保存</el-button>
|
||||||
</div>
|
</div>
|
||||||
</el-tab-pane>
|
</el-tab-pane>
|
||||||
|
<el-tab-pane label="状态组合编辑" name="third">
|
||||||
|
<!-- {{ 状态组合编辑 }} -->
|
||||||
|
</el-tab-pane>
|
||||||
</el-tabs>
|
</el-tabs>
|
||||||
</el-card>
|
</el-card>
|
||||||
</div>
|
</div>
|
||||||
@ -115,21 +118,25 @@ export default {
|
|||||||
const type = this.$route.query.type || '<模型类型>';
|
const type = this.$route.query.type || '<模型类型>';
|
||||||
const source = this.$iscs.getSource();
|
const source = this.$iscs.getSource();
|
||||||
if (id && source) {
|
if (id && source) {
|
||||||
const elementList = source.elementList.map(el => {
|
const shapeList = source.elementList;
|
||||||
|
shapeList.forEach(el => {
|
||||||
return this.$iscs.getShapeByCode(el.code).model;
|
return this.$iscs.getShapeByCode(el.code).model;
|
||||||
});
|
});
|
||||||
const composeList = source.composeList.map(el => {
|
// const composeList = source.composeList.map(el => {
|
||||||
return this.$iscs.getShapeByCode(el.code).model;
|
// return this.$iscs.getShapeByCode(el.code).model;
|
||||||
});
|
// });
|
||||||
const rect = elementList.reduce((temp, el) => {
|
// const rect = shapeList.reduce((temp, el) => {
|
||||||
const shape = this.$iscs.getShapeByCode(el.code);
|
// const shape = this.$iscs.getShapeByCode(el.code);
|
||||||
return shape && temp ? temp.union(shape.getBoundingRect().clone()) : shape.getBoundingRect();
|
// return shape && temp ? temp.union(shape.getBoundingRect().clone()) : shape.getBoundingRect();
|
||||||
}, null);
|
// }, null);
|
||||||
const position = rect ? [(rect.x + rect.width) / 2, (rect.y + rect.height) / 2] : [0, 0];
|
// const position = rect ? [(rect.x + rect.width) / 2, (rect.y + rect.height) / 2] : [0, 0];
|
||||||
const model = { id, name, type, elementList, composeList, position };
|
const position = [0, 0];
|
||||||
Idb.delete('composeList', model.id);
|
const stateList = [];
|
||||||
Idb.write('composeList', model);
|
const model = { id, name, type, shapeList, stateList, position };
|
||||||
Idb.list('composeList').then(list => {
|
|
||||||
|
Idb.delete('composeTemplateList', model.id);
|
||||||
|
Idb.write('composeTemplateList', model);
|
||||||
|
Idb.list('composeTemplateList').then(list => {
|
||||||
console.log(list);
|
console.log(list);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
@ -100,9 +100,9 @@ export default {
|
|||||||
}
|
}
|
||||||
if (this.$route.query.id) {
|
if (this.$route.query.id) {
|
||||||
setTimeout(_ => {
|
setTimeout(_ => {
|
||||||
Idb.select('composeList', this.$route.query.id).then(resp => {
|
Idb.select('composeTemplateList', this.$route.query.id).then(resp => {
|
||||||
this.$iscs.setMap([], {
|
this.$iscs.setMap([], {
|
||||||
elementList: resp.elementList||[],
|
elementList: resp.shapeList||[],
|
||||||
composeList: resp.composeList||[]
|
composeList: resp.composeList||[]
|
||||||
}, option);
|
}, option);
|
||||||
EventBus.$emit('getComposeElemList');
|
EventBus.$emit('getComposeElemList');
|
||||||
|
@ -9,16 +9,13 @@
|
|||||||
<el-card type="border-card" class="heightClass">
|
<el-card type="border-card" class="heightClass">
|
||||||
<div slot="header" class="clearfix">
|
<div slot="header" class="clearfix">
|
||||||
<!-- 组件id为{{ $route.query.id }} -->
|
<!-- 组件id为{{ $route.query.id }} -->
|
||||||
状态预览
|
状态编辑
|
||||||
</div>
|
</div>
|
||||||
<div class="stateList">
|
<div class="stateList">
|
||||||
<el-tabs v-model="statusTab" class="card" type="card" @tab-click="onSelectTab">
|
<el-tabs v-model="statusTab" class="card" type="card" @tab-click="onSelectTab">
|
||||||
<el-tab-pane v-for="(composeElem,index) in composeElemList" :key="index" :label="composeElem.name" :name="composeElem.code" :lazy="true">
|
<el-tab-pane v-for="(composeElem,index) in composeElemList" :key="index" :label="composeElem.name" :name="composeElem.code" :lazy="true">
|
||||||
<!-- <table-form :ref="'tableform'+composeElem.code" :compose-elem="composeElem" /> -->
|
<!-- <table-form :ref="'tableform'+composeElem.code" :compose-elem="composeElem" /> -->
|
||||||
<!-- stateList -->
|
<!-- stateList -->
|
||||||
<el-table>
|
|
||||||
|
|
||||||
</el-table>
|
|
||||||
</el-tab-pane>
|
</el-tab-pane>
|
||||||
</el-tabs>
|
</el-tabs>
|
||||||
</div>
|
</div>
|
||||||
|
Loading…
Reference in New Issue
Block a user