1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
| <template>
| <div>
| <!--el-card class="box-card"-->
| <div v-for="(question,i) in questions" :key="i" style="margin-left:12pt;margin-top:12pt">
| <div @click="handleRow">{{ (i+1).toString()+"、"+question.subject }}</div>
| <div @click="handleItem" v-for="(item,index) in question.items" :key="index">
| <el-radio v-model="question.radio" :label="index" >
| <div class="box-redio-span"> {{item.label}}</div>
| </el-radio>
| <el-input label.width="0px" v-if="item.input" style="display:inline;height:14pt"
| :placeholder="item.placeholder"
| v-model="item.content">
| </el-input>
| </div>
| </div>
| <!--/el-card-->
| </div>
| </template>
|
| <style>
| input.el-input__inner
| {
| display:inline;
| width:120pt;
| height:12pt;
| margin-right: 4pt;
| }
|
| .box-redio-span
| {
| display: inline-block;
| padding-right:12pt ;
| }
| .box-card {
| margin: 16px;
| width: 640px;
| }
| </style>
|
| <script>
| export default {
| name: "IvrQuestionMaint",
| data() {
| return {
| curindex:0,
| selectnode:null,
| selectitem:null,
| questions:
| [
| {
| radio:0,
| subject:"Element如何解决v-for和v-if不能在一个标签上使用",
| items:[
| {index:2,single:true,label:"xxxx2"},
| {index:3,single:false,label:"xxxx3",input1:true,content:"--222--",placeholder:"请输入具体数据2"},
| {index:4,single:false,label:"xxxx4"},
| {index:1,single:true,label:"其他",input:true,content:"",placeholder:"请输入具体数据"},
| ]
| },
| {
| radio:0,
| subject:"Element如何解决v-for和v-if不能在一个标签上使用",
| items:[
| {index:2,single:true,label:"xxxx2"},
| {index:3,single:false,label:"xxxx3",input1:true,content:"--222--",placeholder:"请输入具体数据2"},
| {index:4,single:false,label:"xxxx4"},
| {index:1,single:true,label:"其他",input:true,content:"",placeholder:"请输入具体数据"},
| ]
| },
| {
| radio:0,
| subject:"Element如何解决v-for和v-if不能在一个标签上使用",
| items:[
| {index:2,single:true,label:"xxxx2"},
| {index:3,single:false,label:"xxxx3",input1:true,content:"--222--",placeholder:"请输入具体数据2"},
| {index:4,single:false,label:"xxxx4"},
| {index:1,single:true,label:"其他",input:true,content:"",placeholder:"请输入具体数据"},
| ]
| }
| ]
| };
| },
| methods:{
| handleRow(evt)
| {
| if(this.selectnode)this.selectnode.style.border='none'
| this.selectnode=evt.target.parentNode
| this.selectnode.style.border="#ececec solid 1px"
| if(this.selectitem)this.selectitem.style.border='none'
| },
| handleItem(evt)
| {
| if(this.selectitem!=evt.target)
| {
| if(this.selectnode != evt.target.parentNode)
| {
| if(this.selectnode)this.selectnode.style.border='none'
| this.selectnode = evt.target.parentNode
| this.selectnode.style.border="#ececec solid 1px"
| }
| if(this.selectitem)this.selectitem.style.border='none'
| this.selectitem=evt.target
| this.selectitem.style.border="blue solid 1px"
| }
| }
| }
| };
| </script>
|
|
