|  |  | 
 |  |  |     <style> | 
 |  |  |  | 
 |  |  |         .el-aside { | 
 |  |  |             background-color: #D3DCE6; | 
 |  |  |             background-color: #fff; | 
 |  |  |             color: #333; | 
 |  |  |         } | 
 |  |  |         .el-main { | 
 |  |  |             background-color: #E9EEF3; | 
 |  |  |             background-color: #fff; | 
 |  |  |             color: #333; | 
 |  |  |         } | 
 |  |  |         body > .el-container { | 
 |  |  | 
 |  |  |  | 
 |  |  | <body> | 
 |  |  | <div class="ibox-content" id="app" v-cloak> | 
 |  |  |  | 
 |  |  |     <el-container> | 
 |  |  |         <el-aside width="50%"> | 
 |  |  |             <el-row style="padding: 20px"> | 
 |  |  | 
 |  |  |                         <el-row style="display:flex;"> | 
 |  |  |                             <el-col> | 
 |  |  |                                 <el-form-item label="奖品图片:" :label-width="formLabelWidth"> | 
 |  |  |                                     {{formSelect.jptp}} | 
 |  |  |                                     <img :src="formSelect.jptp" style="max-width: 200px;"> | 
 |  |  |                                 </el-form-item> | 
 |  |  |                             </el-col> | 
 |  |  |                             <el-col> | 
 |  |  | 
 |  |  |                     </el-form> | 
 |  |  |                 </el-col> | 
 |  |  |             </el-row> | 
 |  |  |  | 
 |  |  |             <el-row style="padding: 20px"> | 
 |  |  |                 <p class="el-big-title">收货地址</p> | 
 |  |  |             </el-row> | 
 |  |  |             <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="120px"> | 
 |  |  |                 <el-row style="padding: 10px"> | 
 |  |  |                     <el-col class="col-sm-10" > | 
 |  |  |                         <el-form-item label="收货人:" prop="shr"> | 
 |  |  |                             <el-input v-model="ruleForm.shr"></el-input> | 
 |  |  |                         <el-form-item label="收货人:" prop="consignee"> | 
 |  |  |                             <el-input v-model="ruleForm.consignee" :disabled="(formSelect.state == 3 ? true:false)"></el-input> | 
 |  |  |                         </el-form-item> | 
 |  |  |                     </el-col> | 
 |  |  |                 </el-row> | 
 |  |  |                 <el-row style="padding: 10px"> | 
 |  |  |                     <el-col class="col-sm-10" > | 
 |  |  |                         <el-form-item label="联系电话:" prop="lxdh"> | 
 |  |  |                             <el-input v-model="ruleForm.lxdh"></el-input> | 
 |  |  |                         <el-form-item label="联系电话:" prop="consigneePhone"> | 
 |  |  |                             <el-input v-model="ruleForm.consigneePhone" :disabled="(formSelect.state == 3 ? true:false)"></el-input> | 
 |  |  |                         </el-form-item> | 
 |  |  |                     </el-col> | 
 |  |  |                 </el-row> | 
 |  |  |                 <el-row style="padding: 10px"> | 
 |  |  |                     <el-col class="col-sm-10" > | 
 |  |  |                         <el-form-item label="收货地址:" prop="shdz"> | 
 |  |  |                             <el-input v-model="ruleForm.shdz"></el-input> | 
 |  |  |                         <el-form-item label="收货地址:" prop="consigneeAddress"> | 
 |  |  |                             <el-input v-model="ruleForm.consigneeAddress" :disabled="(formSelect.state == 3 ? true:false)"></el-input> | 
 |  |  |                         </el-form-item> | 
 |  |  |                     </el-col> | 
 |  |  |                 </el-row> | 
 |  |  | 
 |  |  |                     </el-col> | 
 |  |  |                 </el-row> | 
 |  |  |                 <el-row style="padding: 10px"> | 
 |  |  |                     <el-col class="col-sm-10"  v-show='false'> | 
 |  |  |                         <el-form-item label="快递公司编码:"> | 
 |  |  |                             <el-input v-model="ruleForm.kdgs" :disabled="(formSelect.state == 3 ? true:false)"></el-input> | 
 |  |  |                         </el-form-item> | 
 |  |  |                     </el-col> | 
 |  |  |                     <el-col class="col-sm-10" > | 
 |  |  |                         <el-form-item label="快递公司:" prop="kdgs"> | 
 |  |  |                             <el-input v-model="ruleForm.kdgs"></el-input> | 
 |  |  |                         <el-form-item label="快递公司" prop="kdgs"> | 
 |  |  |                             <el-select v-model="ruleForm.kdgs" :disabled="(formSelect.state == 3 ? true:false)"  placeholder="请选择" filterable> | 
 |  |  |                                 <el-option v-for="item in logisticsList " :key="item.code" :label="item.name" :value="item.code"> | 
 |  |  |                                 </el-option> | 
 |  |  |                             </el-select> | 
 |  |  |                         </el-form-item> | 
 |  |  |                     </el-col> | 
 |  |  |                 </el-row> | 
 |  |  |                 <el-row style="padding: 10px"> | 
 |  |  |                     <el-col class="col-sm-10" > | 
 |  |  |                         <el-form-item label="快递单号:" prop="kddh"> | 
 |  |  |                             <el-input v-model="ruleForm.kddh"></el-input> | 
 |  |  |                             <el-input :disabled="(formSelect.state == 3 ? true:false)" v-model="ruleForm.kddh"></el-input> | 
 |  |  |                         </el-form-item> | 
 |  |  |                     </el-col> | 
 |  |  |                 </el-row> | 
 |  |  |                 <el-row style="padding: 10px"> | 
 |  |  |                     <el-col class="col-sm-12 text-center"> | 
 |  |  |                         <el-button type="primary" v-if="formSelect.state == 1"  @click="dataSubmit('ruleForm')">发货</el-button> | 
 |  |  |                         <el-button type="primary" v-if="formSelect.djfs == 2 && formSelect.state != 3"  @click="dataSubmit('ruleForm')">发货</el-button> | 
 |  |  |                         <el-button type="danger" @click="cancelSubmit">关闭</el-button> | 
 |  |  |                     </el-col> | 
 |  |  |                 </el-row> | 
 |  |  | 
 |  |  |             </el-row> | 
 |  |  |  | 
 |  |  |             <el-row style="padding: 10px"> | 
 |  |  |                 <el-steps :active="active" simple> | 
 |  |  |                     <el-step :title="item.title" :icon="item.icon" v-for="item in stepData" :key ="item.index"></el-step> | 
 |  |  |                 </el-steps> | 
 |  |  |                 <div class="block"> | 
 |  |  |                     <el-timeline :reverse="reverse"> | 
 |  |  |                         <el-timeline-item | 
 |  |  |                                 v-for="(activity, index) in activities" | 
 |  |  |                                 :key="index" | 
 |  |  |                                 :timestamp="activity.timestamp" placement="top"> | 
 |  |  |                             <el-card> | 
 |  |  |                                 <p>{{activity.content}}</p> | 
 |  |  |                             </el-card> | 
 |  |  |                         </el-timeline-item> | 
 |  |  |                     </el-timeline> | 
 |  |  |                 </div> | 
 |  |  |             </el-row> | 
 |  |  |  | 
 |  |  |         </el-main> | 
 |  |  | 
 |  |  |                 hdbh: '', | 
 |  |  |                 djfs: '', | 
 |  |  |                 state: '', | 
 |  |  |                 djsj: '' | 
 |  |  |                 djsj: '', | 
 |  |  |             }, | 
 |  |  |             //物流信息 | 
 |  |  |             logisticsList:[], | 
 |  |  |             ruleForm : { | 
 |  |  |                 shr:'', | 
 |  |  |                 lxdh:'', | 
 |  |  |                 shdz:'', | 
 |  |  |                 consignee:'', | 
 |  |  |                 consigneePhone:'', | 
 |  |  |                 consigneeAddress:'', | 
 |  |  |                 kdgs:'', | 
 |  |  |                 kddh:'', | 
 |  |  |             }, | 
 |  |  |             active: 0, // 控制步骤条及填写条目的显示 | 
 |  |  |             stepData: [{index: 0, title: '步骤1', icon: 'el-icon-edit'}, | 
 |  |  |                 {index: 1, title: '步骤2', icon: 'el-icon-edit'}, | 
 |  |  |                 {index: 2, title: '步骤3', icon: 'el-icon-edit'}], | 
 |  |  |             //物流跟踪 | 
 |  |  |             reverse: true, | 
 |  |  |             activities: [], | 
 |  |  |  | 
 |  |  |             rules : { | 
 |  |  |                 shr : [ | 
 |  |  |                 consignee : [ | 
 |  |  |                     { required: true, message: '请输入收货人', trigger: 'blur' } | 
 |  |  |                 ], | 
 |  |  |                 lxdh : [ | 
 |  |  |                 consigneePhone : [ | 
 |  |  |                     { required: true, message: '请输入联系电话', trigger: 'blur' } | 
 |  |  |                 ], | 
 |  |  |                 shdz : [ | 
 |  |  |                 consigneeAddress : [ | 
 |  |  |                     { required: true, message: '请输入收货地址', trigger: 'blur' } | 
 |  |  |                 ], | 
 |  |  |                 kdgs : [ | 
 |  |  |                     { required: true, message: '请选择快递公司', trigger: 'blur' } | 
 |  |  |                     { required: true, message: '请选择快递公司', trigger: 'change' } | 
 |  |  |                 ], | 
 |  |  |                 kddh : [ | 
 |  |  |                     { required: true, message: '请输入快递单号', trigger: 'blur' } | 
 |  |  | 
 |  |  |         }, | 
 |  |  |         created: function () { | 
 |  |  |             this.loadInfo(); | 
 |  |  |             this.getlogisticsList(); | 
 |  |  |         }, | 
 |  |  |         mounted: function () { | 
 |  |  |         }, | 
 |  |  |         methods: { | 
 |  |  |             //加载分类 | 
 |  |  |             //加载 | 
 |  |  |             loadInfo() { | 
 |  |  |                 let _this = this; | 
 |  |  |                 //加载配置 | 
 |  |  | 
 |  |  |                     url: basePath + '/admin/activitySignWriteoff/findSignWriteoff', | 
 |  |  |                     callback: function (data) { | 
 |  |  |                         _this.formSelect = data.mapInfo.signWriteoffVo; | 
 |  |  |                         _this.ruleForm.consignee = data.mapInfo.signWriteoffVo.consignee; | 
 |  |  |                         _this.ruleForm.consigneePhone = data.mapInfo.signWriteoffVo.consigneePhone; | 
 |  |  |                         _this.ruleForm.consigneeAddress = data.mapInfo.signWriteoffVo.consigneeAddress; | 
 |  |  |                         _this.ruleForm.kdgs = data.mapInfo.signWriteoffVo.logisticsCompany; | 
 |  |  |                         _this.ruleForm.kddh = data.mapInfo.signWriteoffVo.logisticsNum; | 
 |  |  |                         _this.activities = data.mapInfo.signWriteoffVo.activities; | 
 |  |  |                     } | 
 |  |  |                 }); | 
 |  |  |             }, | 
 |  |  |             //核销 | 
 |  |  |             // 下拉框数据源---快递公司 | 
 |  |  |             getlogisticsList() { | 
 |  |  |                 let _this = this; | 
 |  |  |                 AjaxProxy.requst({ | 
 |  |  |                     app: _this, | 
 |  |  |                     contentType: 'application/x-www-form-urlencoded', | 
 |  |  |                     data:{ | 
 |  |  |                         type: '快递公司' | 
 |  |  |                     }, | 
 |  |  |                     url: basePath + '/admin/dataDictionary/showDataDictionary', | 
 |  |  |                     callback: function (data) { | 
 |  |  |                         _this.logisticsList = data.rows; | 
 |  |  |                     } | 
 |  |  |                 }); | 
 |  |  |             }, | 
 |  |  |             //发货 | 
 |  |  |             dataSubmit : function(formName) { | 
 |  |  |                 const _this = this; | 
 |  |  |                 let flag = false; | 
 |  |  |                 _this.$refs[formName].validate((valid) => { | 
 |  |  |                     if (!valid) { | 
 |  |  |                         flag = true; | 
 |  |  |                         return; | 
 |  |  |                     } | 
 |  |  |                 }); | 
 |  |  |                 if (flag) { | 
 |  |  |                     return; | 
 |  |  |                 } | 
 |  |  |                 let resultData = { | 
 |  |  |                     writeoffId : writeoffId, | 
 |  |  |                     writeOffCode : _this.ruleForm.writeOffCode, | 
 |  |  |                     shr : _this.ruleForm.consignee, | 
 |  |  |                     lxdh : _this.ruleForm.consigneePhone, | 
 |  |  |                     shdz : _this.ruleForm.consigneeAddress, | 
 |  |  |                     kdgs : _this.ruleForm.kdgs, | 
 |  |  |                     kddh : _this.ruleForm.kddh, | 
 |  |  |                 } | 
 |  |  |                 AjaxProxy.requst({ | 
 |  |  |                     app: _this, | 
 |  |  |                     data: resultData, | 
 |  |  |                     url: basePath + '/admin/activitySignWriteoff/writeoffCodeSubmit', | 
 |  |  |                     url: basePath + '/admin/activitySignWriteoff/logisticsSubmit', | 
 |  |  |                     callback: function (data) { | 
 |  |  |                         _this.$message({ | 
 |  |  |                             message: data.info, | 
 |  |  |                             type: 'success', | 
 |  |  |                         }); | 
 |  |  |                         _this.loadInfo(); | 
 |  |  |                     } | 
 |  |  |                 }); | 
 |  |  |             }, | 
 |  |  |  | 
 |  |  |             //关闭 | 
 |  |  |             cancelSubmit() { | 
 |  |  |                 this.closeFrame(); | 
 |  |  |             }, | 
 |  |  |             closeFrame() { | 
 |  |  |                 parent.layer.close(parent.layer.getFrameIndex(window.name)); | 
 |  |  |                 parent.location.reload(); | 
 |  |  |             }, | 
 |  |  |         } | 
 |  |  |     }) |