|
|
|
|
<link rel="stylesheet" href="../../../static/mdiy/css/model-list.css">
|
|
|
|
|
|
|
|
|
|
<div id="model-list" class="ms-mdiy-model-list" v-if="href == '列表'">
|
|
|
|
|
<el-container>
|
|
|
|
|
<el-header class="ms-header" height="50px">
|
|
|
|
|
<el-row>
|
|
|
|
|
<el-button size="small" icon="el-icon-plus" type="primary">保存</el-button>
|
|
|
|
|
<el-button type="danger" size="small" icon="el-icon-delete">删除</el-button>
|
|
|
|
|
<el-button class="ms-fr" size="small" icon="el-icon-refresh">刷新</el-button>
|
|
|
|
|
</el-row>
|
|
|
|
|
</el-header>
|
|
|
|
|
<el-container>
|
|
|
|
|
<el-header class="ms-tr ms-header">
|
|
|
|
|
<el-select v-model="value" placeholder="请选择" size="small">
|
|
|
|
|
</el-select>
|
|
|
|
|
<el-button size="small" icon="el-icon-search" type="primary">查询</el-button>
|
|
|
|
|
</el-header>
|
|
|
|
|
<el-main>
|
|
|
|
|
<el-table :data="tableData" border style="width: 100%">
|
|
|
|
|
<el-table-column label="规则名">
|
|
|
|
|
<template slot-scope="scope">
|
|
|
|
|
<el-button type="text" v-text="scope.row.data" @click="href='表单'"></el-button>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
<el-table-column prop="name" label="发送对象">
|
|
|
|
|
</el-table-column>
|
|
|
|
|
</el-table>
|
|
|
|
|
</el-main>
|
|
|
|
|
</el-container>
|
|
|
|
|
</el-container>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<script>
|
|
|
|
|
var modelListVue = new Vue({
|
|
|
|
|
el: "#model-list",
|
|
|
|
|
data: {
|
|
|
|
|
value: "", //
|
|
|
|
|
tableData: [{
|
|
|
|
|
data: '项目玩法',
|
|
|
|
|
name: '王小虎',
|
|
|
|
|
}, {
|
|
|
|
|
data: '综合评估',
|
|
|
|
|
name: '王小虎',
|
|
|
|
|
}, {
|
|
|
|
|
data: '产权出售',
|
|
|
|
|
name: '王小虎',
|
|
|
|
|
}, {
|
|
|
|
|
data: '兵不匹配移动端',
|
|
|
|
|
name: '王小虎',
|
|
|
|
|
}],
|
|
|
|
|
href: '列表', //切换页面
|
|
|
|
|
addInputType: {}, //添加中的表单项
|
|
|
|
|
},
|
|
|
|
|
watch: {
|
|
|
|
|
href: function(data) {
|
|
|
|
|
var that = this;
|
|
|
|
|
if(data == '表单') {
|
|
|
|
|
this.$nextTick(function() {
|
|
|
|
|
new Sortable(document.getElementById("ms-type-list"), {
|
|
|
|
|
group: {
|
|
|
|
|
name: 'shared',
|
|
|
|
|
pull: 'clone',
|
|
|
|
|
ghostClass: 'sortable-ghost', //设置拖动时候显示的样式
|
|
|
|
|
},
|
|
|
|
|
animation: 150,
|
|
|
|
|
sort: false,
|
|
|
|
|
onStart: function(event) {
|
|
|
|
|
//准备拖动时保存拖动选项的数据
|
|
|
|
|
that.addInputType = {
|
|
|
|
|
type: event.item.dataset.type,
|
|
|
|
|
title: event.item.dataset.title,
|
|
|
|
|
downList: [], //下拉列表
|
|
|
|
|
downActiveList: [], //多选列表
|
|
|
|
|
set: [], //设置
|
|
|
|
|
unit: '', //金额单位
|
|
|
|
|
fieldType: '', //字段类型
|
|
|
|
|
};
|
|
|
|
|
},
|
|
|
|
|
});
|
|
|
|
|
new Sortable(document.getElementById("ms-input-list"), {
|
|
|
|
|
group: {
|
|
|
|
|
name: 'shared',
|
|
|
|
|
pull: false,
|
|
|
|
|
ghostClass: 'sortable-ghost', //设置拖动时候显示的样式
|
|
|
|
|
},
|
|
|
|
|
animation: 150,
|
|
|
|
|
onAdd: function(event) {
|
|
|
|
|
//拖动成功后删除拖动过来的元素
|
|
|
|
|
event.item.parentNode.removeChild(event.item);
|
|
|
|
|
//想素组添加拖动过来的选项选项
|
|
|
|
|
modelFormVue.formItemList.splice(event.newIndex, 0, that.addInputType);
|
|
|
|
|
},
|
|
|
|
|
});
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
methods: {},
|
|
|
|
|
})
|
|
|
|
|
</script>
|
