| <!doctype html> | 
| <html xmlns:th="http://www.thymeleaf.org" xmlns:matrix="http://www.w3.org/1999/xhtml"> | 
| <head> | 
|     <meta charset="utf-8"> | 
|     <meta http-equiv="X-UA-Compatible" content="IE=edge"> | 
|   | 
|     <meta | 
|             content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" | 
|             name="viewport"/> | 
|     <title th:text="${session.userInfo.shopName }"></title> | 
|   | 
|     <!-- Set render engine for 360 browser --> | 
|     <meta name="renderer" content="webkit"> | 
|     <script type="text/javascript" th:src="@{/js/plugin/jquery-2.1.4.min.js}"></script> | 
|     <script type="text/javascript" th:src="@{/js/systools/DDMBase.js}"></script> | 
|     <link rel="stylesheet" th:href="@{/plugin/amazingUI/css/amazeui.min.css}"> | 
|     <link rel="stylesheet" th:href="@{/plugin/amazingUI/css/app.css}"> | 
|     <link rel="stylesheet" type="text/css" th:href="@{/css/dingUserVip.css}"> | 
|     <style type="text/css"> | 
|         .loadingbig { | 
|             max-width: 100%; | 
|         } | 
|   | 
|     </style> | 
|   | 
| </head> | 
| <script> | 
|   | 
| </script> | 
|   | 
|   | 
| <body> | 
| <!-- 商品列表页面 --> | 
| <div class="wrap"> | 
|     <!-- 头部开始 --> | 
|     <header data-am-widget="header" | 
|             class="am-header color-w back-m1 am-header-fixed"> | 
|         <div class="am-header-left am-header-nav"> | 
|             <a th:href="@{/admin/redirect/hive/mobile/CRM-account}" class=""> <i | 
|                     class="am-header-icon am-icon-chevron-left"></i> | 
|             </a> | 
|         </div> | 
|   | 
|         <h1 class="am-header-title"> | 
|             <a href="#title-link" class="">客户档案</a> | 
|         </h1> | 
|   | 
|     </header> | 
|     <!-- 头部结束 --> | 
|   | 
|     <!-- 订单内容 --> | 
|     <div class="main main2" id="app"> | 
|         <form class="am-form am-form-horizontal" method="post" id="dataform" onsubmit="javascripr:return false;"> | 
|   | 
|             <div class="am-input-group am-form-group  am-input-group-primary am-g bot"> | 
|                 <div class="am-u-sm-12"> | 
|                     <span class="am-input-group-label ">会员姓名</span> | 
|                 </div> | 
|                 <div class="am-u-sm-12"> | 
|                     <input autocomplete="off"   type="text" class="am-form-field " th:value="${session.lookVipInfo.vipName}" | 
|                            readonly="readonly"/> | 
|                 </div> | 
|             </div> | 
|   | 
|   | 
|             <template v-for="question in questions"> | 
|                 <div v-if="question.type=='标题'" | 
|                      class="am-input-group am-form-group  am-input-group-primary am-g bot"> | 
|                     <div class="am-u-sm-12"> | 
|                         <span class="am-input-group-label">{{question.question}}</span> | 
|                     </div> | 
|                 </div> | 
|   | 
|   | 
|                 <div v-if="question.type=='文本'" class="am-input-group am-form-group  am-input-group-primary am-g bot"> | 
|                     <div class="am-u-sm-12"> | 
|                         <span class="am-input-group-label">{{question.question}}</span> | 
|                     </div> | 
|                     <div class="am-u-sm-12"> | 
|                         <input autocomplete="off"   type="text" v-model="question.vipAnswer.answerText" class="am-form-field "> | 
|                     </div> | 
|                 </div> | 
|   | 
|                 <div v-if="question.type=='单选'" class="am-input-group am-form-group  am-input-group-primary am-g bot"> | 
|                     <div class="am-u-sm-12"> | 
|                         <span class="am-input-group-label">{{question.question}}</span> | 
|                     </div> | 
|                     <div class="am-u-sm-12"> | 
|                         <select v-model="question.vipAnswer.answerId"> | 
|                             <option v-for="item in question.answers" v-bind:value="item.id" >{{item.answer}}</option> | 
|                         </select> | 
|                     </div> | 
|                 </div> | 
|   | 
|                 <div v-if="question.type=='多选'" class="am-input-group am-form-group  am-input-group-primary am-g bot"> | 
|                     <div class="am-u-sm-12"> | 
|                         <span class="am-input-group-label">{{question.question}}</span> | 
|                     </div> | 
|                     <div class="am-u-sm-12"> | 
|                         <div class="am-checkbox"> | 
|                             <template  v-for="item in question.answers" > | 
|                                 <div class="am-checkbox"> | 
|                                     <label> | 
|                                         <input autocomplete="off"   type="checkbox"  v-model="question.vipAnswer.answerId"  v-bind:value="item.id" > {{item.answer}} | 
|                                     </label> | 
|                                 </div> | 
|                             </template> | 
|                         </div> | 
|                     </div> | 
|                 </div> | 
|   | 
|   | 
|   | 
|   | 
|             </template> | 
|   | 
|   | 
|             <div class="inputBtn"> | 
|                 <input autocomplete="off"   type="button" @click="submit()" class="am-btn btn-m1 am-radius am-btn-block" | 
|                        value="保存"></input> | 
|             </div> | 
|             <!-- 测试 --> | 
|   | 
|         </form> | 
|     </div> | 
| </div> | 
|   | 
| <script | 
|         th:src="@{/plugin/amazingUI/js/amazeui.widgets.helper.js}"></script> | 
| <script th:src="@{/plugin/amazingUI/js/amazeui.min.js}"></script> | 
| <script th:src="@{/js/systools/mobile/AjaxProxyVue-mobile.js}"></script> | 
| <script type="text/javascript" th:src="@{/js/plugin/vue.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:''}, | 
|             }] | 
|         }, | 
|         created: function () { | 
|             this.loadInfo(); | 
|         }, | 
|   | 
|         mounted: function () { | 
|   | 
|         }, | 
|   | 
|         methods: { | 
|   | 
|   | 
|             loadInfo: function () { | 
|   | 
|                 console.log('加载服务器数据'); | 
|                 var _this = this; | 
|                 AjaxProxy.requst({ | 
|                     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) { | 
|                            layer.open({ | 
|                                content: data.info | 
|                                ,time: 2 //2秒后自动关闭 | 
|   | 
|                             }); | 
|                         } | 
|                     }); | 
|                 } | 
|             } | 
|             , | 
|             validate: function (params) { | 
|   | 
|                 return true; | 
|             } | 
|             , | 
|   | 
|   | 
|         }, | 
|   | 
|     }) | 
|   | 
|   | 
| </script> | 
| <!-- index js --> | 
| </body> | 
| </html>  |