|   | 
| <!DOCTYPE HTML> | 
| <html xmlns:th="http://www.thymeleaf.org"> | 
| <head> | 
|     <meta charset="utf-8"> | 
|     <META HTTP-EQUIV="Pragma" CONTENT="no-cache"> | 
|     <meta name="renderer" content="webkit|ie-comp|ie-stand"> | 
|     <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> | 
|     <meta name="viewport" | 
|           content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" /> | 
|     <meta http-equiv="Cache-Control" content="no-siteapp" /> | 
|     <!-- 本框架基本脚本和样式 --> | 
|     <script type="text/javascript" th:src="@{/js/systools/MBaseVue.js}"></script> | 
|     <link rel="stylesheet" th:href="@{/plugin/element-ui/index.css}"> | 
|     <link rel="stylesheet" th:href="@{/plugin/bootstrap-3.3.5/css/bootstrap.min.css}"> | 
|     <link th:href="@{/css/styleOne/style.min.css}" rel="stylesheet" type="text/css"/> | 
|   | 
|     <style type="text/css"> | 
|         .loadingbig { | 
|             max-width: 100%; | 
|         } | 
|   | 
|     </style> | 
|   | 
| </head> | 
| <script> | 
|   | 
| </script> | 
|   | 
|   | 
| <body> | 
| <div class="ibox-content" id="app" v-cloak> | 
|     <form class="form-horizontal" id="dataform" | 
|           onsubmit="javascripr:return false;"> | 
|   | 
|   | 
|   | 
|   | 
|   | 
|   | 
|   | 
|             <template v-for="question in questions"> | 
|   | 
|                 <div v-if="question.type=='标题'"  class="form-group"> | 
|                     <label class="col-md-2 control-label">{{question.question}}</label> | 
|                 </div> | 
|   | 
|   | 
|                 <div class="form-group" v-if="question.type=='文本'" > | 
|                     <label class="col-md-2 control-label">{{question.question}}</label> | 
|                     <div class="col-md-8"> | 
|                         <el-input  v-model="question.vipAnswer.answerText"  ></el-input> | 
|                     </div> | 
|                 </div> | 
|   | 
|   | 
|                 <div class="form-group" v-if="question.type=='单选'" > | 
|                     <label class="col-md-2 control-label">{{question.question}}</label> | 
|                     <div class="col-md-8"> | 
|                         <el-select v-model="question.vipAnswer.answerId" placeholder="请选择"> | 
|                             <el-option | 
|                                     v-for="item in question.answers" | 
|                                     :key="item.id" | 
|                                     :label="item.answer" | 
|                                     :value="item.id"> | 
|                             </el-option> | 
|                         </el-select> | 
|                     </div> | 
|                 </div> | 
|   | 
|                 <div class="form-group" v-if="question.type=='多选'" > | 
|                     <label class="col-md-2 control-label">{{question.question}}</label> | 
|                     <div class="col-md-8"> | 
|                         <el-checkbox-group v-model="question.vipAnswer.answerId"> | 
|                             <template  v-for="item in question.answers" > | 
|                              <el-checkbox  v-bind:label="item.answer" v-bind:value="item.id" ></el-checkbox> | 
|                             </template> | 
|                         </el-checkbox-group> | 
|                     </div> | 
|                 </div> | 
|             </template> | 
|   | 
|   | 
|         <el-row   justify="center" type="flex"> | 
|                 <el-button  type="info" @click="closeFram()"     >关闭</el-button> | 
|             <el-button  type="primary" @click="submit()"     >保存</el-button> | 
|         </el-row> | 
|             <!-- 测试 --> | 
|   | 
|         </form> | 
|     </div> | 
| </div> | 
|   | 
| <script type="text/javascript" th:src="@{/js/plugin/jquery-2.1.4.min.js}"></script> | 
| <script type="text/javascript" th:src="@{/js/plugin/jquery.query.js}"></script> | 
| <script type="text/javascript" th:src="@{/plugin/bootstrap-3.3.5/js/bootstrap.min.js}"></script> | 
| <script type="text/javascript" th:src="@{/js/systools/AjaxProxyVue.js}"></script> | 
| <script type="text/javascript" th:src="@{/js/plugin/vue.js}"></script> | 
| <script type="text/javascript" th:src="@{/plugin/element-ui/index.js}"></script> | 
|   | 
| <script> | 
|   | 
|   | 
|     var id = $.query.get("id"); | 
|     var app = new Vue({ | 
|         el: '#app', | 
|         data: { | 
|             id: id, | 
|             questions: [{ | 
|                 answers: [{}], | 
|                 category: "", | 
|                 id: "", | 
|                 orderField: "", | 
|                 question: "", | 
|                 type: "", | 
|                 vipAnswer: {vipAnswer:'',answerId:''}, | 
|             }] | 
|         }, | 
|         created: function () { | 
|             this.loadInfo(); | 
|         }, | 
|   | 
|         mounted: function () { | 
|   | 
|         }, | 
|   | 
|         methods: { | 
|             loadInfo: function () { | 
|                 console.log('加载服务器数据'); | 
|                 var _this = this; | 
|                 AjaxProxy.requst({ | 
|                     app:_this, | 
|                     async: false, | 
|                     url: basePath + '/admin/vipInfo/getVipQuestions?id=' + id, | 
|                     callback: function (data) { | 
|                         var questions= data.mapInfo.questions; | 
|                         for(let i =0;i<questions.length;i++){ | 
|                             if(questions[i].vipAnswer==null){ | 
|                                 questions[i].vipAnswer={vipAnswer:'',answerId:''}; | 
|                             } | 
|                             if(questions[i].type=='多选'){ | 
|                                 if(questions[i].vipAnswer){ | 
|                                     questions[i].vipAnswer.answerId=questions[i].vipAnswer.answerId.split(","); | 
|                                 } | 
|                             }else if(questions[i].type=='单选'){ | 
|                                 if(questions[i].vipAnswer){ | 
|                                     questions[i].vipAnswer.answerId= parseInt( | 
|                                         questions[i].vipAnswer.answerId | 
|                                     ) ; | 
|                                 } | 
|                             } | 
|                         } | 
|                         _this.questions = questions; | 
|                     } | 
|                 }); | 
|   | 
|   | 
|             } | 
|             , | 
|             submit: function () { | 
|                 console.log("提交"); | 
|                 let _this = this; | 
|                 let vipAnswers=[]; | 
|                 for(let i=0; i<_this.questions.length ; i++){ | 
|                     var quesion=_this.questions[i]; | 
|   | 
|                     let vipAnswer=quesion.vipAnswer.answerId; | 
|                     if(quesion.type=='多选'){ | 
|                         vipAnswer=quesion.vipAnswer.answerId.join(","); | 
|                     } | 
|                     let obj={ | 
|                         quesionId:quesion.id, | 
|                         vipId:id, | 
|                         answerId:vipAnswer, | 
|                         answerText:quesion.vipAnswer.answerText, | 
|                     } | 
|   | 
|                     vipAnswers.push(obj); | 
|                 } | 
|                 var params = { | 
|                     id:id, | 
|                     vipAnswers:vipAnswers | 
|                 } | 
|   | 
|   | 
|                 if (_this.validate(params)) { | 
|                     AjaxProxy.requst({ | 
|                         app: _this, | 
|                         data: params, | 
|                         url: basePath + '/admin/vipInfo/modifyVipArchives', | 
|                         callback: function (data) { | 
|                             _this.$message({ | 
|                                 message: data.info, | 
|                                 type: 'success', | 
|                                 onClose: function () { | 
|                                     _this.closeFram(); | 
|                                 } | 
|                             }); | 
|                             parent.myGrid.serchData(); | 
|                         } | 
|                     }); | 
|                 } | 
|             } | 
|             , | 
|             closeFram:function(){ | 
|                 parent.layer.close(parent.layer.getFrameIndex(window.name)); | 
|             }, | 
|             validate: function (params) { | 
|   | 
|                 return true; | 
|             } | 
|             , | 
|   | 
|   | 
|         }, | 
|         filters: | 
|             { | 
|                 format: function (value, patten) { | 
|                     if (!value) return ''; | 
|                     return MTools.formatDate(value, patten) | 
|                 } | 
|                 , | 
|             } | 
|         , | 
|   | 
|         updated: function () { | 
|             //兼容微信6.74+ios12的软键盘不回弹bug | 
|             $("input,textarea,select").blur(function () { | 
|                 setTimeout(function () { | 
|                     var scrollHeight = document.documentElement.scrollTop || document.body.scrollTop || 0; | 
|                     window.scrollTo(0, Math.max(scrollHeight - 1, 0)); | 
|                 }, 50) | 
|             }) | 
|         } | 
|         , | 
|     }) | 
|   | 
|   | 
| </script> | 
| <!-- index js --> | 
| </body> | 
| </html>  |