|  |  | 
 |  |  |           <span class="mulsz" slot="label" | 
 |  |  |             ><i class="el-icon-headset"></i> è¯é³è¯¦æ
1</span | 
 |  |  |           > | 
 |  |  |           <div class="borderdiv">è¯é³è¯¦æ
1</div> | 
 |  |  |           <div class="borderdiv"> | 
 |  |  |             <div> | 
 |  |  |               <div class="leftside"> | 
 |  |  |                 <i class="el-icon-phone-outline"></i><span>说æåå°è¯´</span> | 
 |  |  |               </div> | 
 |  |  |               <div class="offside"> | 
 |  |  |                 <i class="el-icon-user"></i> | 
 |  |  |                 <div class="offside-value"> | 
 |  |  |                   <el-input v-model="input"></el-input> | 
 |  |  |                   <el-radio v-model="radio" label="1">å¤é项</el-radio> | 
 |  |  |                   <el-radio v-model="radio" label="2">å¤é项2</el-radio> | 
 |  |  |                   <el-radio v-model="radio" label="3">å¤é项3</el-radio> | 
 |  |  |                   <el-radio v-model="radio" label="4">å¤é项4</el-radio> | 
 |  |  |                 </div> | 
 |  |  |               </div> | 
 |  |  |             </div> | 
 |  |  |           </div> | 
 |  |  |         </el-tab-pane> | 
 |  |  |         <el-tab-pane> | 
 |  |  |           <span class="mulsz" slot="label" | 
 |  |  | 
 |  |  |     return { | 
 |  |  |       radio: "1", | 
 |  |  |       userid: "", | 
 |  |  |       input: "", | 
 |  |  |       radio: "2", | 
 |  |  |     }; | 
 |  |  |   }, | 
 |  |  |  | 
 |  |  | 
 |  |  | } | 
 |  |  | .borderdiv { | 
 |  |  |   min-height: 60vh; | 
 |  |  |   font-size: 20px; | 
 |  |  |   padding: 30px; | 
 |  |  |   .leftside { | 
 |  |  |     margin-bottom: 30px; | 
 |  |  |     span { | 
 |  |  |       width: 400px; | 
 |  |  |       margin-left: 20px; | 
 |  |  |       padding: 10px; | 
 |  |  |       color: #fff; | 
 |  |  |       background: rgb(110, 196, 247); | 
 |  |  |       border-radius: 10px; | 
 |  |  |     } | 
 |  |  |   } | 
 |  |  |   .offside { | 
 |  |  |     display: flex; | 
 |  |  |     flex-direction: row-reverse; | 
 |  |  |     .offside-value { | 
 |  |  |       padding: 10px; | 
 |  |  |       background: rgb(217, 173, 253); | 
 |  |  |       border-radius: 10px; | 
 |  |  |       color: #fff; | 
 |  |  |       margin-right: 20px; | 
 |  |  |     } | 
 |  |  |   } | 
 |  |  | } | 
 |  |  | ::v-deep.offside-value .el-radio__label { | 
 |  |  |   color: #fff; | 
 |  |  | } | 
 |  |  | .mulsz { | 
 |  |  |   font-size: 25px; | 
 
 |  |  | 
 |  |  |   <div class="Questionnairemanagement"> | 
 |  |  |     <!-- å·¦ä¾§æ  --> | 
 |  |  |     <div class="sidecolumn"> | 
 |  |  |       <div class="notebuttom"><i class="el-icon-chat-dot-square" />åçä¿¡</div> | 
 |  |  |       <div class="notebuttom" @click="handleAdd"> | 
 |  |  |         <i class="el-icon-chat-dot-square" />åçä¿¡ | 
 |  |  |       </div> | 
 |  |  |       <el-divider></el-divider> | 
 |  |  |       <div class="notestate"> | 
 |  |  |         <div class="state-text">çä¿¡ç¶æ</div> | 
 |  |  | 
 |  |  |           :class="classestag == 2 ? 'state-lines' : 'state-line'" | 
 |  |  |           @click="succeedfn" | 
 |  |  |         > | 
 |  |  |           <div class="value-left"><i class="el-icon-s-claim" />åéæå</div> | 
 |  |  |           <div class="value-left"> | 
 |  |  |             <i class="el-icon-circle-check" />åéæå | 
 |  |  |           </div> | 
 |  |  |           <div class="quantitycg">22</div> | 
 |  |  |         </div> | 
 |  |  |         <div | 
 |  |  |           :class="classestag == 3 ? 'state-lines' : 'state-line'" | 
 |  |  |           @click="losefn" | 
 |  |  |         > | 
 |  |  |           <div class="value-left"><i class="el-icon-warning" />åé失败</div> | 
 |  |  |           <div class="value-left"> | 
 |  |  |             <i class="el-icon-warning-outline" />åé失败 | 
 |  |  |           </div> | 
 |  |  |           <div class="quantitysb">22</div> | 
 |  |  |         </div> | 
 |  |  |         <div | 
 |  |  |           :class="classestag == 4 ? 'state-lines' : 'state-line'" | 
 |  |  |           @click="awaitfn" | 
 |  |  |         > | 
 |  |  |           <div class="value-left"><i class="el-icon-s-comment" />å¾
åé</div> | 
 |  |  |           <div class="value-left"><i class="el-icon-s-help" />å¾
åé</div> | 
 |  |  |           <div class="quantityd">22</div> | 
 |  |  |         </div> | 
 |  |  |       </div> | 
 |  |  | 
 |  |  |         console.log(this.userList); | 
 |  |  |       }); | 
 |  |  |     }, | 
 |  |  |     // const { pageNum, pageSize, ...params } = this.queryParams; | 
 |  |  |     submitsidecolumn() {}, | 
 |  |  |     deletefenlei() {}, | 
 |  |  |     // ä¾¿æ·æ ç¾ | 
 |  |  | 
 |  |  |       align-items: center; | 
 |  |  |       padding: 10px 10px; | 
 |  |  |       background: #88abfc; | 
 |  |  |       color: #fff; | 
 |  |  |       cursor: pointer; | 
 |  |  |       justify-content: space-between; | 
 |  |  |     } | 
 
 |  |  | 
 |  |  |     // æ ç¾ç¶æä¿®æ¹ | 
 |  |  |     handleStatusChange(row) { | 
 |  |  |       console.log(row.isupload); | 
 |  |  |       let text = row.isupload === "0" ? "å¯ç¨" : "åç¨"; | 
 |  |  |       let text = row.isupload == 0 ? "åç¨" : "å¯ç¨"; | 
 |  |  |       this.$modal | 
 |  |  |         .confirm('确认è¦"' + text + '""' + row.tagname + '"æ ç¾åï¼') | 
 |  |  |         .then(function () { | 
 |  |  | 
 |  |  |           this.$modal.msgSuccess(text + "æå"); | 
 |  |  |         }) | 
 |  |  |         .catch(function () { | 
 |  |  |           row.isupload = row.isupload === "0" ? "1" : "0"; | 
 |  |  |           row.isupload = row.isupload == 0 ? 1 : 0; | 
 |  |  |         }); | 
 |  |  |     }, | 
 |  |  |     /** æç´¢æé®æä½ */ | 
 
| ¶Ô±ÈÐÂÎļþ | 
 |  |  | 
 |  |  | <template> | 
 |  |  |   <div class="Questionnairemanagement"> | 
 |  |  |     <!-- å·¦ä¾§æ  --> | 
 |  |  |     <div class="sidecolumn"> | 
 |  |  |       <el-input placeholder="è¾å
¥å
³é®åè¿è¡è¿æ»¤" v-model="filterText"> | 
 |  |  |       </el-input> | 
 |  |  |  | 
 |  |  |       <el-tree | 
 |  |  |         class="filter-tree" | 
 |  |  |         :data="data" | 
 |  |  |         :props="defaultProps" | 
 |  |  |         default-expand-all | 
 |  |  |         :filter-node-method="filterNode" | 
 |  |  |         ref="tree" | 
 |  |  |       > | 
 |  |  |         <span class="custom-tree-node" slot-scope="{ node, data }"> | 
 |  |  |           <span>{{ node.label }}</span> | 
 |  |  |           <span> | 
 |  |  |             <el-button type="text" size="mini" @click="() => append(data)"> | 
 |  |  |               æ°å¢å级 | 
 |  |  |             </el-button> | 
 |  |  |             <el-button | 
 |  |  |               type="text" | 
 |  |  |               size="mini" | 
 |  |  |               @click="() => remove(node, data)" | 
 |  |  |             > | 
 |  |  |               å é¤ | 
 |  |  |             </el-button> | 
 |  |  |           </span> | 
 |  |  |         </span> | 
 |  |  |       </el-tree> | 
 |  |  |     </div> | 
 |  |  |     <!-- ä¸é¨æ°æ® --> | 
 |  |  |     <div class="leftvlue"> | 
 |  |  |       <div class="compile" v-for="item in list"> | 
 |  |  |         <div class="compile-title"> | 
 |  |  |           {{ item.name }}: <span>{{ item.uapiurl }}</span> | 
 |  |  |         </div> | 
 |  |  |         <div class="compile-value"> | 
 |  |  |           <div class="compile-min" v-for="itea in item.value"> | 
 |  |  |             <div> | 
 |  |  |               <el-input v-model="itea.value" placeholder="å
¥å注解"></el-input> | 
 |  |  |             </div> | 
 |  |  |             <div> | 
 |  |  |               <el-input v-model="itea.name" placeholder="å
¥åå"></el-input> | 
 |  |  |             </div> | 
 |  |  |             <div @click="drawer = true">å±å¼ä¸çº§</div> | 
 |  |  |           </div> | 
 |  |  |         </div> | 
 |  |  |       </div> | 
 |  |  |     </div> | 
 |  |  |     <el-drawer | 
 |  |  |       title="ææ¯äºçº§" | 
 |  |  |       direction="btt" | 
 |  |  |       :visible.sync="drawer" | 
 |  |  |       :with-header="false" | 
 |  |  |     > | 
 |  |  |       <div class="compile-value"> | 
 |  |  |         <div class="compile-min" v-for="itea in 6"> | 
 |  |  |           <div> | 
 |  |  |             <el-input v-model="input" placeholder="å
¥å注解"></el-input> | 
 |  |  |           </div> | 
 |  |  |           <div> | 
 |  |  |             <el-input v-model="inputs" placeholder="å
¥åå"></el-input> | 
 |  |  |           </div> | 
 |  |  |         </div> | 
 |  |  |       </div> | 
 |  |  |     </el-drawer> | 
 |  |  |   </div> | 
 |  |  | </template> | 
 |  |  |  | 
 |  |  | <script> | 
 |  |  | let id = 1000; | 
 |  |  | export default { | 
 |  |  |   name: "Editinterface", | 
 |  |  |  | 
 |  |  |   watch: { | 
 |  |  |     filterText(val) { | 
 |  |  |       this.$refs.tree.filter(val); | 
 |  |  |     }, | 
 |  |  |   }, | 
 |  |  |  | 
 |  |  |   data() { | 
 |  |  |     const data = [ | 
 |  |  |       { | 
 |  |  |         id: 1, | 
 |  |  |         label: "æ£è
æå¡ä¸å¿", | 
 |  |  |         children: [ | 
 |  |  |           { | 
 |  |  |             id: 4, | 
 |  |  |             label: "æ£è
å表", | 
 |  |  |           }, | 
 |  |  |           { | 
 |  |  |             id: 21, | 
 |  |  |             label: "æ£è
æå¡", | 
 |  |  |           }, | 
 |  |  |         ], | 
 |  |  |       }, | 
 |  |  |       { | 
 |  |  |         id: 2, | 
 |  |  |         label: "ä¸çº§ 2", | 
 |  |  |         children: [ | 
 |  |  |           { | 
 |  |  |             id: 5, | 
 |  |  |             label: "äºçº§ 2-1", | 
 |  |  |           }, | 
 |  |  |           { | 
 |  |  |             id: 6, | 
 |  |  |             label: "äºçº§ 2-2", | 
 |  |  |           }, | 
 |  |  |         ], | 
 |  |  |       }, | 
 |  |  |       { | 
 |  |  |         id: 3, | 
 |  |  |         label: "ä¸çº§ 3", | 
 |  |  |         children: [ | 
 |  |  |           { | 
 |  |  |             id: 7, | 
 |  |  |             label: "äºçº§ 3-1", | 
 |  |  |           }, | 
 |  |  |           { | 
 |  |  |             id: 8, | 
 |  |  |             label: "äºçº§ 3-2", | 
 |  |  |           }, | 
 |  |  |         ], | 
 |  |  |       }, | 
 |  |  |     ]; | 
 |  |  |     return { | 
 |  |  |       drawer: false, | 
 |  |  |       input: "", | 
 |  |  |       inputs: "", | 
 |  |  |       // æ¥è¯¢åæ° | 
 |  |  |       queryParams: {}, | 
 |  |  |       currentRow: null, //éä¸è¡æ°æ® | 
 |  |  |       filterText: "", | 
 |  |  |  | 
 |  |  |       data: JSON.parse(JSON.stringify(data)), | 
 |  |  |       data: JSON.parse(JSON.stringify(data)), | 
 |  |  |  | 
 |  |  |       defaultProps: { | 
 |  |  |         children: "children", | 
 |  |  |         label: "label", | 
 |  |  |       }, | 
 |  |  |       list: [ | 
 |  |  |         { | 
 |  |  |           id: "23", | 
 |  |  |           name: "è·åæ£è
å表", | 
 |  |  |           uapiurl: "http://api", | 
 |  |  |           value: [ | 
 |  |  |             { name: "children", value: "注解" }, | 
 |  |  |             { name: "childrenone", value: "注解ä¸" }, | 
 |  |  |             { name: "childrentwo", value: "注解äº" }, | 
 |  |  |             { name: "childrenthree", value: "注解ä¸" }, | 
 |  |  |           ], | 
 |  |  |         }, | 
 |  |  |         { | 
 |  |  |           id: "13", | 
 |  |  |           name: "è·åæ£è
详æ
", | 
 |  |  |           uapiurl: "http://api/xqq", | 
 |  |  |           value: [ | 
 |  |  |             { name: "children", value: "注解" }, | 
 |  |  |             { name: "childrenone", value: "注解ä¸" }, | 
 |  |  |             { name: "childrentwo", value: "注解äº" }, | 
 |  |  |             { name: "childrenthree", value: "注解ä¸" }, | 
 |  |  |             { name: "childrenthree", value: "注解å" }, | 
 |  |  |           ], | 
 |  |  |         }, | 
 |  |  |       ], | 
 |  |  |     }; | 
 |  |  |   }, | 
 |  |  |   watch: {}, | 
 |  |  |   created() {}, | 
 |  |  |  | 
 |  |  |   methods: { | 
 |  |  |     filterNode(value, data) { | 
 |  |  |       if (!value) return true; | 
 |  |  |       return data.label.indexOf(value) !== -1; | 
 |  |  |     }, | 
 |  |  |     append(data) { | 
 |  |  |       const newChild = { id: id++, label: "å级", children: [] }; | 
 |  |  |       if (!data.children) { | 
 |  |  |         this.$set(data, "children", []); | 
 |  |  |       } | 
 |  |  |       data.children.push(newChild); | 
 |  |  |     }, | 
 |  |  |  | 
 |  |  |     remove(node, data) { | 
 |  |  |       const parent = node.parent; | 
 |  |  |       const children = parent.data.children || parent.data; | 
 |  |  |       const index = children.findIndex((d) => d.id === data.id); | 
 |  |  |       children.splice(index, 1); | 
 |  |  |     }, | 
 |  |  |   }, | 
 |  |  | }; | 
 |  |  | </script> | 
 |  |  |  | 
 |  |  | <style lang="scss" scoped> | 
 |  |  | .Questionnairemanagement { | 
 |  |  |   display: flex; | 
 |  |  | } | 
 |  |  | .sidecolumn { | 
 |  |  |   width: 300px; | 
 |  |  |   min-height: 100vh; | 
 |  |  |   text-align: center; | 
 |  |  |   //   display: flex; | 
 |  |  |   margin-top: 20px; | 
 |  |  |   margin: 20px; | 
 |  |  |   padding: 10px; | 
 |  |  |   background: #edf1f7; | 
 |  |  |   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); | 
 |  |  | } | 
 |  |  | ::v-deep .sidecolumn .el-tree { | 
 |  |  |   margin-top: 30px; | 
 |  |  |   background: none; | 
 |  |  | } | 
 |  |  |  | 
 |  |  | .leftvlue { | 
 |  |  |   //   display: flex; | 
 |  |  |   //   flex: 1; | 
 |  |  |   width: 80%; | 
 |  |  |   margin-top: 20px; | 
 |  |  |   //   margin: 20px; | 
 |  |  |   padding: 30px; | 
 |  |  |   background: #ffff; | 
 |  |  |   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); | 
 |  |  |   .compile { | 
 |  |  |     border: 1px solid #dcdfe6; | 
 |  |  |     padding: 15px; | 
 |  |  |     margin-top: 10px; | 
 |  |  |   } | 
 |  |  | } | 
 |  |  | .compile-value { | 
 |  |  |   display: flex; | 
 |  |  |   margin-top: 10px; | 
 |  |  |  | 
 |  |  |   .compile-min { | 
 |  |  |     border: 1px solid #dcdfe6; | 
 |  |  |     width: 150px; | 
 |  |  |     div { | 
 |  |  |       padding: 5px; | 
 |  |  |       text-align: center; | 
 |  |  |     } | 
 |  |  |   } | 
 |  |  | } | 
 |  |  | .compile-min div:nth-child(3) { | 
 |  |  |   padding: 0; | 
 |  |  |   margin: 5px; | 
 |  |  |   background: bisque; | 
 |  |  |   border-radius: 3px; | 
 |  |  | } | 
 |  |  | </style> | 
 
 |  |  | 
 |  |  |         </el-row> | 
 |  |  |       </div> | 
 |  |  |       <el-divider></el-divider> | 
 |  |  |  | 
 |  |  |        | 
 |  |  |       <div> | 
 |  |  |         <h5>äºå·è¡¨</h5> | 
 |  |  |         <el-row :gutter="10" class="mb8"> | 
 
 |  |  | 
 |  |  |       [process.env.VUE_APP_BASE_API]: { | 
 |  |  |         target1: `http://192.168.1.4:8080`, | 
 |  |  |         target: `http://192.168.1.4:8080`, | 
 |  |  |         // target: `http://www.hxsoft.com:8080`, | 
 |  |  |         changeOrigin: true, | 
 |  |  |         pathRewrite: { | 
 |  |  |           ['^' + process.env.VUE_APP_BASE_API]: '' |