92 lines
3.7 KiB
Vue
92 lines
3.7 KiB
Vue
|
|
<template>
|
|||
|
|
<el-col :sm="24" :md="pzoption.mdwidth">
|
|||
|
|
<i class="iconfont icon-shezhi pull-right widgetset hidden-print" @click.stop="dialogInputVisible = true"></i>
|
|||
|
|
<i class="iconfont icon-shanchu pull-right widgetdel hidden-print" @click.stop="delWid(pzoption.wigdetcode)"></i>
|
|||
|
|
<el-form-item :label="pzoption.title">
|
|||
|
|
<el-button :icon="childpro.icon" @click="queryYB" :type="childpro.bttype" size="mini" style="vertical-align:bottom;">{{ childpro.placeholder }}</el-button>
|
|||
|
|
</el-form-item>
|
|||
|
|
<el-dialog title="组件属性" :visible.sync="dialogInputVisible">
|
|||
|
|
<el-form :model="childpro">
|
|||
|
|
<el-form-item label="按钮名称">
|
|||
|
|
<el-input v-model="childpro.placeholder" autocomplete="off"></el-input>
|
|||
|
|
</el-form-item>
|
|||
|
|
<el-form-item label="按钮图标">
|
|||
|
|
<el-input v-model="childpro.icon" autocomplete="off" ></el-input>
|
|||
|
|
</el-form-item>
|
|||
|
|
<el-form-item label="按钮样式">
|
|||
|
|
<el-select v-model="childpro.bttype" placeholder="请选择">
|
|||
|
|
<el-option value="primary"></el-option>
|
|||
|
|
<el-option value="success"></el-option>
|
|||
|
|
<el-option value="info"></el-option>
|
|||
|
|
<el-option value="danger"></el-option>
|
|||
|
|
</el-select>
|
|||
|
|
</el-form-item>
|
|||
|
|
<el-form-item label="按钮执行代码执行">
|
|||
|
|
<el-input v-model="childpro.jscode" :autosize="{ minRows: 6, maxRows: 9}" autocomplete="off" type="textarea"></el-input>
|
|||
|
|
</el-form-item>
|
|||
|
|
</el-form>
|
|||
|
|
</el-dialog>
|
|||
|
|
</el-col>
|
|||
|
|
|
|||
|
|
</template>
|
|||
|
|
<script>
|
|||
|
|
module.exports = {
|
|||
|
|
props: ['pzoption', 'index'],
|
|||
|
|
data: function () {
|
|||
|
|
return {
|
|||
|
|
dialogInputVisible: false,
|
|||
|
|
childpro: {
|
|||
|
|
placeholder: "搜索按钮",
|
|||
|
|
jscode: "app.GetYBData()",
|
|||
|
|
icon:"el-icon-search",
|
|||
|
|
bttype:"primary"
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
methods: {
|
|||
|
|
delWid: function (wigdetcode) {
|
|||
|
|
this.$root.nowwidget = {};//没这个删除不掉啊
|
|||
|
|
_.remove(this.$root.FormData.wigetitems, function (obj) {
|
|||
|
|
return obj.wigdetcode == wigdetcode;
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
senddata: function () {
|
|||
|
|
this.$emit('data-change', JSON.stringify(this.childpro));
|
|||
|
|
},
|
|||
|
|
queryYB: function () {
|
|||
|
|
try {
|
|||
|
|
let jscode = this.childpro.jscode;
|
|||
|
|
let func = new Function(jscode);
|
|||
|
|
func()
|
|||
|
|
} catch (e) {
|
|||
|
|
app.$notify({
|
|||
|
|
title: '成功',
|
|||
|
|
message: '解析JS代码有误',
|
|||
|
|
type: 'success'
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
mounted: function () {
|
|||
|
|
var chi = this;
|
|||
|
|
chi.$nextTick(function () {
|
|||
|
|
if (chi.$root.addchildwig) {
|
|||
|
|
chi.$root.addchildwig();//不能缺少
|
|||
|
|
}
|
|||
|
|
if (chi.pzoption.childpro.placeholder) {
|
|||
|
|
chi.childpro = chi.pzoption.childpro
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
},
|
|||
|
|
watch: {
|
|||
|
|
childpro: { //深度监听,可监听到对象、数组的变化
|
|||
|
|
handler(newV, oldV) {
|
|||
|
|
this.senddata();
|
|||
|
|
},
|
|||
|
|
deep: true
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
};
|
|||
|
|
</script>
|