<template>
|
<div class="stencils">
|
<!-- 上部 -->
|
<div class="stencils-top">
|
<div class="basic">待选问题</div>
|
<div class="top-menu">
|
<div class="search-box">
|
<el-form :inline="true" :model="formInline" class="demo-form-inline">
|
<el-form-item label="语言" prop="status">
|
<el-select v-model="formInline.status" placeholder="请选择">
|
<el-option
|
v-for="item in languagelist"
|
:key="item.value"
|
:label="item.label"
|
:value="item.value"
|
>
|
</el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="问题主旨">
|
<el-input
|
v-model="formInline.user"
|
placeholder="问题主旨"
|
></el-input>
|
</el-form-item>
|
<el-form-item label="关联指标">
|
<el-input
|
v-model="formInline.user"
|
placeholder="关联指标"
|
></el-input>
|
</el-form-item>
|
<el-form-item>
|
<el-button type="primary" icon="el-icon-search" @click="onSubmit"
|
>搜索</el-button
|
>
|
</el-form-item>
|
</el-form>
|
</div>
|
<div
|
style="
|
height: 300px;
|
border: 0.5px solid #aeafb1;
|
overflow-x: hidden;
|
overflow-y: scroll;
|
"
|
>
|
<div class="menu-list" v-for="item in 13">
|
<div>用药是否规范</div>
|
<div class="menu-icon" @click="menudeletei(index)">
|
<i class="el-icon-plus" />
|
</div>
|
</div>
|
</div>
|
</div>
|
</div>
|
<!-- 下部 -->
|
<div class="stencils-bottom">
|
<div class="issue">
|
<div class="basics">已选择问题</div>
|
<div style="margin: 10px; font-size: 20px">体检通知</div>
|
<div
|
style="
|
height: 350px;
|
margin: 10px;
|
border: 0.5px solid #aeafb1;
|
overflow-x: hidden;
|
overflow-y: scroll;
|
"
|
>
|
<div class="menu-list" v-for="item in 13">
|
<div>用药是否规范</div>
|
<div class="menu-icons" @click="menudeletei(index)">
|
<i class="el-icon-delete" />
|
</div>
|
</div>
|
</div>
|
<div class="issue-button">
|
<el-button type="primary" icon="el-icon-circle-plus-outline"
|
>关系图</el-button
|
>
|
<el-button type="primary" icon="el-icon-s-claim">保存</el-button>
|
</div>
|
</div>
|
<div class="particulars">
|
<div class="headline">
|
<div class="basics">问题配置</div>
|
<div class="headbottom">
|
<el-button
|
type="primary"
|
icon="el-icon-circle-plus-outline"
|
@click="addzbiao"
|
>添加指标</el-button
|
>
|
<el-button type="primary" icon="el-icon-s-claim">保存</el-button>
|
</div>
|
</div>
|
<div
|
class="valuetop"
|
v-for="(item, index) in deployList"
|
:key="item.id"
|
>
|
<div class="val-text">
|
<div>
|
有无复查 <span>{{ item.name }}</span>
|
</div>
|
<div class="text-icon" @click="deletei(index)">
|
<i class="el-icon-delete" />
|
</div>
|
</div>
|
<div class="val-bon">
|
<el-form ref="form" :model="item" label-width="90px">
|
<el-form-item label="节点ID">
|
<el-input v-model="item.id"></el-input>
|
</el-form-item>
|
<el-form-item label="节点描述">
|
<el-input v-model="item.name"></el-input>
|
</el-form-item>
|
<el-form-item label="文本提示">
|
<el-input type="textarea" v-model="item.valuetop"></el-input>
|
</el-form-item>
|
<el-form-item label="语音地址">
|
<el-input v-model="item.name"></el-input>
|
</el-form-item>
|
<el-form-item label="跳转问题号">
|
<el-input v-model="item.name"></el-input>
|
</el-form-item>
|
<el-form-item label="播报类型">
|
<el-radio-group v-model="item.resource">
|
<el-radio label="混合优先"></el-radio>
|
<el-radio label="文字优先"></el-radio>
|
</el-radio-group>
|
</el-form-item>
|
<el-form-item label="指标类型">
|
<el-radio-group v-model="item.resource">
|
<el-radio label="选项"></el-radio>
|
<el-radio label="文本"></el-radio>
|
<el-radio label="数组"></el-radio>
|
</el-radio-group>
|
</el-form-item>
|
<el-form-item label="指标名称">
|
<el-input v-model="item.name"></el-input>
|
</el-form-item>
|
<el-form-item label="指标值">
|
<el-input v-model="item.name"></el-input>
|
</el-form-item>
|
<el-form-item label="适用规则">
|
<el-radio-group v-model="item.resources">
|
<el-radio label="基础"></el-radio>
|
<el-radio label="自定义"></el-radio>
|
</el-radio-group>
|
</el-form-item>
|
<el-form-item
|
label="自定义规则"
|
v-if="item.resources == '自定义'"
|
>
|
<el-input type="textarea" v-model="item.valuetop"></el-input>
|
</el-form-item>
|
</el-form>
|
</div>
|
</div>
|
</div>
|
</div>
|
</div>
|
</template>
|
|
<script>
|
export default {
|
data() {
|
return {
|
deployList: [
|
{
|
id: 1,
|
name: "有",
|
valuetop:
|
"(?!.*忘|.*不|.*没)^.*(是|有|对|做|作|检|查|复诊|好|参加|复诊|去(过|好|了|完|医院)|来(过|了|医院))|没错|对呀|可能|(已经|早)去了|开了药|腰带|吊带|要的|(?<!没)有的|表带,10;要,5",
|
},
|
{
|
id: 2,
|
name: "不知道",
|
valuetop:
|
"(不|没|谁|鬼|怎么).*(病|可能|知道|了解|清楚|懂|明白|确认|确定|晓得|知晓|认得|识得|印象|熟悉|记|会|关心|关注|注意|告诉|通知|听)",
|
},
|
],
|
languagelist: [
|
{
|
value: 1,
|
label: "普通话",
|
},
|
{
|
value: 2,
|
label: "粤语",
|
},
|
{
|
value: 3,
|
label: "英语",
|
},
|
], //语言列表
|
formInline: {
|
user: "",
|
region: "",
|
},
|
};
|
},
|
|
created() {},
|
|
methods: {
|
deletei(index) {
|
console.log(index);
|
this.deployList.splice(index, 1);
|
},
|
addzbiao() {
|
const ids = this.deployList.length + 1;
|
console.log(ids);
|
this.deployList.push({
|
id: ids,
|
name: "",
|
valuetop: "",
|
});
|
},
|
onSubmit() {
|
console.log("submit!");
|
},
|
},
|
};
|
</script>
|
|
<style lang="scss" scoped>
|
.stencils-top {
|
.basic {
|
height: 50px;
|
margin: 15px;
|
border-radius: 8px;
|
margin-bottom: 0;
|
padding: 0 20px 20px 20px;
|
line-height: 50px;
|
background: #bee2ff;
|
justify-content: space-between;
|
}
|
.top-menu {
|
margin: 15px;
|
margin-top: 0;
|
height: 400px;
|
border-radius: 4px;
|
padding: 10px 30px 10px 30px;
|
background: #f2f5fc;
|
border: 1px solid #dcdfe6;
|
-webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12),
|
0 0 6px 0 rgba(0, 0, 0, 0.04);
|
.menu-list {
|
display: flex;
|
justify-content: space-between;
|
padding: 5px;
|
border-bottom: 0.5px solid #bfc0c2;
|
}
|
}
|
}
|
.stencils-bottom {
|
display: flex;
|
justify-content: space-between;
|
.issue {
|
width: 37%;
|
margin-left: 15px;
|
height: 500px;
|
background: #f2f5fc;
|
.menu-list {
|
display: flex;
|
justify-content: space-between;
|
padding: 5px;
|
border-bottom: 0.5px solid #bfc0c2;
|
}
|
.basics {
|
height: 50px;
|
border-radius: 8px;
|
padding-left: 20px;
|
line-height: 50px;
|
background: #bee2ff;
|
justify-content: space-between;
|
}
|
}
|
.issue-button {
|
margin: 10px;
|
text-align: right;
|
}
|
.particulars {
|
width: 59%;
|
margin-right: 15px;
|
background: #f2f5fc;
|
|
.headline {
|
display: flex;
|
height: 50px;
|
padding: 0 20px 20px 20px;
|
line-height: 50px;
|
background: #bee2ff;
|
justify-content: space-between;
|
}
|
.valuetop {
|
.val-text {
|
display: flex;
|
height: 50px;
|
margin: 15px;
|
margin-bottom: 0;
|
// padding: 0 20px 20px 20px;
|
padding: 0 20px;
|
align-items: center;
|
background: #bee2ff;
|
justify-content: space-between;
|
.text-icon {
|
width: 35px;
|
height: 35px;
|
line-height: 35px;
|
text-align: center;
|
background: #fafafa;
|
cursor: pointer;
|
border-radius: 5px;
|
}
|
}
|
.val-bon {
|
margin: 15px;
|
margin-top: 0;
|
padding: 30px;
|
background: #f2f5fc;
|
border: 1px solid #dcdfe6;
|
-webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12),
|
0 0 6px 0 rgba(0, 0, 0, 0.04);
|
}
|
}
|
}
|
}
|
.menu-icon {
|
cursor: pointer;
|
width: 20px;
|
height: 20px;
|
line-height: 20px;
|
text-align: center;
|
margin-right: 10px;
|
background: #78baf0;
|
color: #fff;
|
border-radius: 2px;
|
}
|
.menu-icons {
|
cursor: pointer;
|
width: 20px;
|
height: 20px;
|
line-height: 20px;
|
text-align: center;
|
margin-right: 10px;
|
background: #f7603a;
|
color: #fff;
|
border-radius: 2px;
|
}
|
</style>
|
