safecheck-client 3.0.39-23 → 3.0.39-24

package/src/filiale/siyang/android/PhoneInsurancePurchaseDetail.vue

@@ -1,498 +1,531 @@
-<template>
-  <div class="auto clearfix">
-    <div class="row app-row col-xs-12 col-sm-6 col-md-6">
-      <div class="col-xs-4 col-sm-4 col-md-4">
-        <img src="../../../assets/add.png" style="width: 20px;margin-bottom: 5px" alt="">
-        <span class="text-left font">客户编号</span>
-      </div>
-      <div class="col-xs-8 col-sm-8 col-md-8">
-        <p class="text-left show-font">{{ model.f_userinfo_code }}</p>
-      </div>
-    </div>
-    <div class="row app-row col-xs-12 col-sm-6 col-md-6">
-      <div class="col-xs-4 col-sm-4 col-md-4">
-        <img src="../../../assets/add.png" style="width: 20px;margin-bottom: 5px" alt="">
-        <span class="text-left font">客户姓名</span>
-      </div>
-      <div class="col-xs-8 col-sm-8 col-md-8">
-        <input type="text" class="form-control show-font" v-model="model.f_user_name" placeholder="请输入客户姓名">
-      </div>
-    </div>
-    <div class="row app-row col-xs-12 col-sm-12 col-md-12">
-      <div class="col-xs-4 col-sm-2 col-md-2">
-        <img src="../../../assets/add.png" style="width: 20px;margin-bottom: 5px" alt="">
-        <span class="text-left font">客户地址</span>
-      </div>
-      <div class="col-xs-8 col-sm-10 col-md-10">
-        <input type="text" class="form-control show-font" v-model="model.f_address" placeholder="请输入客户地址">
-      </div>
-    </div>
-    <div class="row app-row col-xs-12 col-sm-6 col-md-6">
-      <div class="col-xs-4 col-sm-4 col-md-4">
-        <img src="../../../assets/add.png" style="width: 20px;margin-bottom: 5px" alt="">
-        <span class="text-left font">客户电话</span>
-      </div>
-      <div class="col-xs-8 col-sm-8 col-md-8">
-        <input type="number" class="form-control show-font" v-model="model.f_user_phone" placeholder="请输入电话号码">
-      </div>
-    </div>
-    <div class="row app-row col-xs-12 col-sm-6 col-md-6">
-      <div class="col-xs-4 col-sm-4 col-md-4">
-        <img src="../../../assets/add.png" style="width: 20px;margin-bottom: 5px" alt="">
-        <span class="text-left font">身份证号</span>
-      </div>
-      <div class="col-xs-8 col-sm-8 col-md-8">
-        <input type="text" class="form-control show-font" v-model="model.f_idnumber" placeholder="请输入身份证号">
-      </div>
-    </div>
-    <div class="row app-row col-xs-12 col-sm-6 col-md-6">
-      <div class="col-xs-4 col-sm-4 col-md-4">
-        <img src="../../../assets/add.png" style="width: 20px;margin-bottom: 5px" alt="">
-        <span class="text-left font">保单号</span>
-      </div>
-      <div class="col-xs-8 col-sm-8 col-md-8">
-        <input type="number" class="form-control show-font"  v-model="model.f_ins_number" placeholder="请输入保单号">
-      </div>
-    </div>
-    <div class="row app-row col-xs-12 col-sm-6 col-md-6">
-      <div class="col-xs-4 col-sm-4 col-md-4">
-        <img src="../../../assets/add.png" style="width: 20px;margin-bottom: 5px" alt="">
-        <span class="text-left font">上期保费截至日期</span>
-      </div>
-      <div class="col-xs-8 col-sm-8 col-md-8">
-        <p class="text-left show-font">{{ model.f_last_insexpiration_date }}</p>
-      </div>
-    </div>
-    <div class="row app-row col-xs-12 col-sm-6 col-md-6">
-      <div class="col-xs-4 col-sm-4 col-md-4">
-        <img src="../../../assets/add.png" style="width: 20px;margin-bottom: 5px" alt="">
-        <span class="text-left font">投保日期</span>
-      </div>
-      <div class="col-xs-8 col-sm-8 col-md-8">
-        <datepicker :value.sync="model.f_ins_start_date" v-model="model.f_ins_start_date" :format="'yyyy-MM-dd'"
-                    placeholder="请选择投保日期" style="width: 60%">
-        </datepicker>
-      </div>
-    </div>
-    <div class="row app-row col-xs-12 col-sm-6 col-md-6">
-      <div class="col-xs-4 col-sm-4 col-md-4">
-        <img src="../../../assets/add.png" style="width: 20px;margin-bottom: 5px" alt="">
-        <span class="text-left font">购买年限</span>
-      </div>
-      <div class="col-xs-8 col-sm-8 col-md-8">
-        <input type="number" placeholder="购买年限" style="width: 60%" class="form-control show-font" v-model="model.f_salecount">
-      </div>
-    </div>
-    <div class="row app-row col-xs-12 col-sm-6 col-md-6">
-      <div class="col-xs-4 col-sm-4 col-md-4">
-        <img src="../../../assets/add.png" style="width: 20px;margin-bottom: 5px" alt="">
-        <span class="text-left font">购买日期</span>
-      </div>
-      <div class="col-xs-8 col-sm-8 col-md-8">
-        <datepicker :value.sync="create_date" v-model="create_date" :format="'yyyy-MM-dd'"
-                    placeholder="购买日期" style="width: 60%">
-        </datepicker>
-      </div>
-    </div>
-    <div class="row app-row col-xs-12 col-sm-6 col-md-6">
-      <div class="col-xs-4 col-sm-4 col-md-4">
-        <img src="../../../assets/add.png" style="width: 20px;margin-bottom: 5px" alt="">
-        <span class="text-left font">到期日期</span>
-      </div>
-      <div class="col-xs-8 col-sm-8 col-md-8">
-        <datepicker :value.sync="model.f_expiration_date" v-model="model.f_expiration_date" :format="'yyyy-MM-dd'"
-                    placeholder="到期日期" style="width: 60%">
-        </datepicker>
-      </div>
-    </div>
-    <div class="row app-row col-xs-12 col-sm-6 col-md-6">
-      <div class="col-xs-4 col-sm-4 col-md-4">
-        <img src="../../../assets/add.png" style="width: 20px;margin-bottom: 5px" alt="">
-        <span class="text-left font">金额</span>
-      </div>
-      <div class="col-xs-8 col-sm-8 col-md-8">
-        <input type="number" class="form-control show-font" v-model="model.f_money" placeholder="请输入金额">
-      </div>
-    </div>
-    <div class="row app-row col-xs-12 col-sm-6 col-md-6">
-      <div class="col-xs-4 col-sm-4 col-md-4">
-        <img src="../../../assets/add.png" style="width: 20px;margin-bottom: 5px" alt="">
-        <span class="text-left font">保险险种</span>
-      </div>
-      <div class="col-xs-8 col-sm-8 col-md-8">
-        <input-select
-          class="select select_list"
-          :value.sync="model.f_insurance_type"
-          v-model="model.f_insurance_type"
-          :options="insuranceTtype"
-          :valueSingle="true"
-        ></input-select>
-      </div>
-    </div>
-    <div class="row app-row col-xs-12 col-sm-6 col-md-6">
-      <div class="col-xs-4 col-sm-4 col-md-4">
-        <img src="../../../assets/add.png" style="width: 20px;margin-bottom: 5px" alt="">
-        <span class="text-left font">售卖人员</span>
-      </div>
-      <div class="col-xs-8 col-sm-8 col-md-8">
-        <input-select
-          class="select select_list"
-          :value.sync="model.f_sale_person"
-          v-model="model.f_sale_person"
-          :options="paymans"
-          :valueSingle="true"
-        ></input-select>
-      </div>
-    </div>
-    <div class="row app-row col-xs-12">
-      <div class="col-xs-4 col-sm-4 col-md-4">
-        <img src="../../../assets/add.png" style="width: 20px;" alt="">
-        <span class="text-left font">备注</span>
-      </div>
-      <div class="col-xs-8 col-sm-8 col-md-8">
-        <input class="form-control show-font" v-model="model.f_comments" placeholder="备注">
-      </div>
-    </div>
-    <div class="col-xs-12 text-center  app-row">
-      <button type="button" class="btn btn-lg btn-font btn-color" style="width: 22%;" @click="commitBefore()">确认</button>
-    </div>
-    <modal v-if="showmOrder" :show.sync="showmOrder" v-ref:modal :large="true"
-           :backdrop="false" title="保险收费">
-      <header slot="modal-header" class="modal-header">
-        <button type="button" class="close" @click="closeModel"><span>&times;</span></button>
-        <h4 class="modal-title">保险收费</h4>
-      </header>
-      <article slot="modal-body" class="modal-body clearfix">
-        <div  class="form-group col-sm-12 panel panel-info">
-          <div class="form-group col-sm-6">
-            <label class="col-sm-4 control-label">收款方式：</label>
-            <div class="col-sm-8">
-              <input-select
-                class="select select_list"
-                :value.sync="model.f_payment"
-                v-model="model.f_payment"
-                :options="payTypes"
-                :valueSingle="true"></input-select>
-            </div>
-          </div>
-        </div>
-        <div v-if="zfCode" style="margin-top: 20px; text-align: center;">
-          <div id="qrcode" style="margin-top: 25px;width: 266px;height: 266px"></div>
-        </div>
-      </article>
-      <footer slot="modal-footer" class="modal-footer">
-        <button type="button" class="btn btn-primary" :disabled="isSubmitting" @click="commitCharge()">
-          {{ isSubmitting ? '确认中...' : '确认' }}
-        </button>
-      </footer>
-    </modal>
-  </div>
-</template>
-<script>
-import { HttpResetClass } from 'vue-client'
-import * as Util from '../../../components/Util'
-import Vue from 'vue'
-import QRCode from 'qrcodejs2'
-export default {
-  title: '手机单户抄表',
-  data() {
-    return {
-      paymanshow:this.$appdata.getSingleValue('app增值收费售卖人员'),
-      paymans:[],
-      orderinfo:{},
-      f_user_type:'',
-      insuranceTtype:[],
-      payTypes: this.$appdata.getParam('移动端支付方式'),
-      create_date:Util.getNowDate(),
-      isCommit:false,
-      order: {}, // 订单信息
-      f_out_trade_no: '',
-      showmOrder:false,
-      zfCode:false,
-      isSubmitting: false, // 添加防重复提交标志
-      isSaveing:false    // 添加防重复提交标志
-    }
-  },
-  props: {
-    data: {
-      type: Object,
-      default: function () {
-        return {
-        }
-      }
-    },
-    model: {
-      type: Object,
-      default: {}
-    }
-  },
-  ready() {
-    new HttpResetClass().load('post', `${this.$androidUtil.getProxyUrl()}/rs/sql/tel_singleTable_OrderBy`, {
-      data: {
-        items: 'tu.*',
-        tablename: 't_userinfo ui left join t_userfees tu on tu.f_userinfo_id=ui.f_userinfo_id and tu.f_state = \'有效\' ',
-        condition: `ui.f_userinfo_id  = '${this.model.f_userinfo_id}'`,
-        orderitem: '1'
-      }
-    }).then(response => {
-      if (response.data.length > 0) {
-        this.model.f_last_insexpiration_date = response.data[0].f_expiration_date
-      }
-    })
-    Vue.set(this.model, 'f_money', 0)
-    Vue.set(this.model, 'f_fee_type', '')
-    Vue.set(this.model, 'f_comments', '')
-    Vue.set(this.model, 'f_salecount', 1)
-    Vue.set(this.model, 'f_ins_number', '')
-    Vue.set(this.model, 'f_idnumber', '')
-    Vue.set(this.model, 'f_ins_start_date', Util.toStandardDateString())
-    Vue.set(this.model, 'f_expiration_date', '')
-    Vue.set(this.model, 'f_payment', 'app二维码收款')
-    this.getType()
-    this.getEmp()
-  },
-  methods: {
-    getEmp () {
-      let val = {source: 'this.getParentByType($organization$).getChildByName($销售人$).getUsers()',
-        userid: `${Vue.user.id}`}
-      let http = new HttpResetClass()
-      http.load('POST', `${this.$androidUtil.getProxyUrl()}/rs/search`, {data: val}, {resolveMsg: null, rejectMsg: null}).then((res) => {
-        res.data.forEach((item) => {
-          this.paymans.push({label: item.name, value: item.name})
-        })
-      })
-    },
-    //获取保险类型
-    async getType() {
-      let data = {
-        tablename: 't_userfiles',
-        condition: `f_userinfo_id = '${this.model.f_userinfo_id}'`
-      }
-      let res = await new HttpResetClass().load('post', this.$androidUtil.getProxyUrl() + '/rs/sql/tel_singleTable', {data: data}, {
-        resolveMsg: null,
-        rejectMsg: '获取数据失败'
-      })
-      let str = res.data[0].f_gasproperties
-      if (str === '居民用气') {
-        this.insuranceTtype = this.$appdata.getParam('居民燃气意外险')
-      }else {
-        this.insuranceTtype = this.$appdata.getParam('非居民燃气意外险')
-      }
-    },
-    closeModel(){
-      this.showmOrder = false
-      this.isSubmitting = false
-    },
-    commitBefore(){
-      if (!this.model.f_money) {
-        this.$showMessage('金额未填写，请填写后重新尝试。')
-        return
-      }else {
-        //转为数字类型
-        this.model.f_money = Number(this.model.f_money)
-      }
-      if (this.paymanshow && !this.model.f_sale_person) {
-        return this.$showMessage(`请选择售卖人员！`)
-      }
-      if (!this.model.f_ins_start_date) {
-        this.$showMessage('投保日期未选择，请选择后重新尝试。')
-        return
-      }
-      if (!this.model.f_expiration_date) {
-        this.$showMessage('到期日期未选择，请选择后重新尝试。')
-        return
-      }
-      if (!this.model.f_insurance_type) {
-        this.$showMessage('保险险种未填写，请填写后重新尝试。')
-        return
-      }
-      this.showmOrder = true
-    },
-    async commitCharge() {
-      // 防止重复提交
-      if (this.isSubmitting) {
-        return
-      }
-      if(this.model.f_payment ==''){
-        this.$showMessage('请选择支付方式。')
-        return
-      }
-      this.isSubmitting = true // 设置提交状态
-      try {
-        if (this.model.f_payment.includes('二维码')) {
-          await this.openQrcode()
-        } else {
-          await this.commit()
-          this.isSubmitting = false // 非二维码支付时在这里重置
-        }
-      } catch (error) {
-        console.error('提交失败:', error)
-        this.$showMessage('提交失败')
-        this.isSubmitting = false // 重置提交状态
-      }
-    },
-    async getOrderInformation() {
-      console.log('查询订单信息！！！')
-      let http = new HttpResetClass()
-      let res = await http.load('POST', `${this.$androidUtil.getProxyUrl()}/wx/rs/pay/microPayOrderStatus`, {
-        "filiale": "siyang",
-        "flag": "microPayRongHaoJsbc",
-        "f_out_trade_no": `${this.f_out_trade_no}`,
-        "posid": this.$androidUtil.getDeviceIEMI()
-      }, {
-        resolveMsg: null,
-        rejectMsg: '订单查询失败！！！'
-      })
-      // 支付成功
-      if (res.data.trade_state.includes('已支付')) {
-        this.orderinfo = res.data
-        clearTimeout(this.orderInterval)
-        this.$showMessage('支付成功！！！')
-        await this.commit()
-        this.clearQrCode()
-        this.closeModel()
-      }else{
-        //重新查询订单状态
-        this.orderInterval = setTimeout(() => {
-          this.getOrderInformation()
-        }, 3000)
-      }
-    },
-    async openQrcode() {
-      this.clearQrCode()
-      let data = {
-        tablename: 't_userfiles',
-        condition: `f_userinfo_id = '${this.model.f_userinfo_id}'`
-      }
-      let res = await new HttpResetClass().load('post', this.$androidUtil.getProxyUrl() + '/rs/sql/tel_singleTable', {data: data}, {
-        resolveMsg: null,
-        rejectMsg: '获取数据失败'
-      })
-      let reqdata = {
-        "filiale": "siyang",
-        "flag": "microPayRongHaoJsbc",
-        "money": this.model.f_money,
-        "proinfo": "保险收费",
-        "f_userinfo_id": this.model.f_userinfo_id,
-        "f_userfiles_id": res.data[0].f_userfiles_id,
-        "f_user_id": res.data[0].f_user_id,
-        "posid": this.$androidUtil.getDeviceIEMI()
-      }
-      new HttpResetClass().load('POST', `${this.$androidUtil.getProxyUrl()}/wx/rs/pay/jsApiPay`, reqdata).then(res => {
-        if (res.data.result_code.includes('SUCCESS')) {
-          this.order = res.data
-          this.f_out_trade_no = res.data.f_out_trade_no
-          this.zfCode = true
-          this.$nextTick(() => {
-            this.qrcode(res.data.qr_code)
-          })
-          this.getOrderInformation()
-        } else {
-          this.$showMessage('网络异常。。。')
-        }
-      })
-    },
-    qrcode(url) {
-      new QRCode('qrcode', {
-        text: url, // 设置二维码内容或跳转地址
-        width: 266, // 设置宽度，单位像素
-        height: 266, // 设置高度，单位像素
-        correctLevel: QRCode.CorrectLevel.L //容错率，L/M/Hs
-      })
-    },
-    clearQrCode() {
-      if (document.getElementById('qrcode')) {
-        document.getElementById('qrcode').innerHTML = ''
-      }
-    },
-    async commit() {
-      try {
-        let commit_data = this.model
-        commit_data.f_sale_person = this.model.f_sale_person ? this.model.f_sale_person :Vue.user.name
-        commit_data.f_buy_date = this.create_date
-        commit_data.f_total_ins_charge = 0
-        commit_data.f_operatorid = Vue.user.id
-        commit_data.f_operator = Vue.user.name
-        commit_data.f_operate_date = Util.toStandardTimeString()
-        commit_data.f_state = '有效'
-        commit_data.f_orgid = Vue.user.orgid
-        commit_data.f_orgname = Vue.user.orgs
-        commit_data.f_depid = Vue.user.depids
-        commit_data.f_depname = Vue.user.deps
-        commit_data.f_serial_id = this.orderinfo.f_out_trade_no
-        commit_data.order=this.order
-
-        const response = await new HttpResetClass().load('post', `${this.$androidUtil.getProxyUrl()}/api/af-revenue/logic/saveInsInfo`, { data: commit_data })
-        this.$showMessage('提交成功')
-        this.orderinfo = {}
-        this.showmOrder = false
-      } catch (error) {
-        console.error('提交失败:', error)
-        this.$showMessage('提交失败')
-        this.showmOrder = false
-      }
-    },
-  },
-  watch: {
-    'model.f_ins_start_date'(new_var) {
-      if (new_var && this.model.f_salecount) {
-        this.model.f_expiration_date = Number(new_var.substring(0, 4)) + Number(this.model.f_salecount) + new_var.substring(4)
-      }
-    },
-    'model.f_salecount'(new_var) {
-      if(!this.model.f_ins_start_date){
-        this.model.f_ins_start_date = Util.toStandardDateString()
-      }
-
-      if (this.model.f_ins_start_date && new_var) {
-        this.model.f_expiration_date = Number(this.model.f_ins_start_date.substring(0, 4)) + Number(new_var) + this.model.f_ins_start_date.substring(4)
-      }
-    }
-  }
-}
-</script>
-<style scoped>
-.mt-5 {
-  margin-top: 5px;
-}
-
-.mt-10 {
-  margin-top: 10px;
-}
-
-.mt-20 {
-  margin-top: 20px;
-}
-
-.app-row {
-  background-color: white;
-  padding: 10px 10px 0 10px;
-  border-bottom: 1px solid rgba(235, 235, 235, 0.5);
-}
-
-.app-row-none-border {
-  background-color: white;
-  padding: 10px 10px 0 10px;
-}
-
-.font {
-  font: 15px PingFang-SC-Medium;
-  color: #666666;
-}
-
-.show-font {
-  font: 15px PingFang-SC-Medium;
-  color: #333333
-}
-
-.btn-font {
-  font: 600 16px PingFang-SC-Bold;
-  color: #499EDF;
-}
-
-.btn-color {
-  background-color: #FFFFFF;
-  border-radius: 10px;
-  border: 1px solid #499EDF;
-}
-</style>
+<template>
+  <div class="auto clearfix">
+    <div class="row app-row col-xs-12 col-sm-6 col-md-6">
+      <div class="col-xs-4 col-sm-4 col-md-4">
+        <img src="../../../assets/add.png" style="width: 20px;margin-bottom: 5px" alt="">
+        <span class="text-left font">客户编号</span>
+      </div>
+      <div class="col-xs-8 col-sm-8 col-md-8">
+        <p class="text-left show-font">{{ model.f_userinfo_code }}</p>
+      </div>
+    </div>
+    <div class="row app-row col-xs-12 col-sm-6 col-md-6">
+      <div class="col-xs-4 col-sm-4 col-md-4">
+        <img src="../../../assets/add.png" style="width: 20px;margin-bottom: 5px" alt="">
+        <span class="text-left font">客户姓名</span>
+      </div>
+      <div class="col-xs-8 col-sm-8 col-md-8">
+        <input type="text" class="form-control show-font" v-model="model.f_user_name" placeholder="请输入客户姓名">
+      </div>
+    </div>
+    <div class="row app-row col-xs-12 col-sm-12 col-md-12">
+      <div class="col-xs-4 col-sm-2 col-md-2">
+        <img src="../../../assets/add.png" style="width: 20px;margin-bottom: 5px" alt="">
+        <span class="text-left font">客户地址</span>
+      </div>
+      <div class="col-xs-8 col-sm-10 col-md-10">
+        <input type="text" class="form-control show-font" v-model="model.f_address" placeholder="请输入客户地址">
+      </div>
+    </div>
+    <div class="row app-row col-xs-12 col-sm-6 col-md-6">
+      <div class="col-xs-4 col-sm-4 col-md-4">
+        <img src="../../../assets/add.png" style="width: 20px;margin-bottom: 5px" alt="">
+        <span class="text-left font">客户电话</span>
+      </div>
+      <div class="col-xs-8 col-sm-8 col-md-8">
+        <input type="number" class="form-control show-font" v-model="model.f_user_phone" placeholder="请输入电话号码">
+      </div>
+    </div>
+    <div class="row app-row col-xs-12 col-sm-6 col-md-6">
+      <div class="col-xs-4 col-sm-4 col-md-4">
+        <img src="../../../assets/add.png" style="width: 20px;margin-bottom: 5px" alt="">
+        <span class="text-left font">身份证号</span>
+      </div>
+      <div class="col-xs-8 col-sm-8 col-md-8">
+        <input type="text" class="form-control show-font" v-model="model.f_idnumber" placeholder="请输入身份证号">
+      </div>
+    </div>
+    <div class="row app-row col-xs-12 col-sm-6 col-md-6">
+      <div class="col-xs-4 col-sm-4 col-md-4">
+        <img src="../../../assets/add.png" style="width: 20px;margin-bottom: 5px" alt="">
+        <span class="text-left font">保单号</span>
+      </div>
+      <div class="col-xs-8 col-sm-8 col-md-8">
+        <input type="number" class="form-control show-font"  v-model="model.f_ins_number" placeholder="请输入保单号">
+      </div>
+    </div>
+    <div class="row app-row col-xs-12 col-sm-6 col-md-6">
+      <div class="col-xs-4 col-sm-4 col-md-4">
+        <img src="../../../assets/add.png" style="width: 20px;margin-bottom: 5px" alt="">
+        <span class="text-left font">上期保费截至日期</span>
+      </div>
+      <div class="col-xs-8 col-sm-8 col-md-8">
+        <p class="text-left show-font">{{ model.f_last_insexpiration_date }}</p>
+      </div>
+    </div>
+    <div class="row app-row col-xs-12 col-sm-6 col-md-6">
+      <div class="col-xs-4 col-sm-4 col-md-4">
+        <img src="../../../assets/add.png" style="width: 20px;margin-bottom: 5px" alt="">
+        <span class="text-left font">投保日期</span>
+      </div>
+      <div class="col-xs-8 col-sm-8 col-md-8">
+        <datepicker :value.sync="model.f_ins_start_date" v-model="model.f_ins_start_date" :format="'yyyy-MM-dd'"
+                    placeholder="请选择投保日期" style="width: 60%">
+        </datepicker>
+      </div>
+    </div>
+    <div class="row app-row col-xs-12 col-sm-6 col-md-6">
+      <div class="col-xs-4 col-sm-4 col-md-4">
+        <img src="../../../assets/add.png" style="width: 20px;margin-bottom: 5px" alt="">
+        <span class="text-left font">购买年限</span>
+      </div>
+      <div class="col-xs-8 col-sm-8 col-md-8">
+        <input type="number" placeholder="购买年限" style="width: 60%" class="form-control show-font" v-model="model.f_salecount">
+      </div>
+    </div>
+    <div class="row app-row col-xs-12 col-sm-6 col-md-6">
+      <div class="col-xs-4 col-sm-4 col-md-4">
+        <img src="../../../assets/add.png" style="width: 20px;margin-bottom: 5px" alt="">
+        <span class="text-left font">购买日期</span>
+      </div>
+      <div class="col-xs-8 col-sm-8 col-md-8">
+        <datepicker :value.sync="create_date" v-model="create_date" :format="'yyyy-MM-dd'"
+                    placeholder="购买日期" style="width: 60%">
+        </datepicker>
+      </div>
+    </div>
+    <div class="row app-row col-xs-12 col-sm-6 col-md-6">
+      <div class="col-xs-4 col-sm-4 col-md-4">
+        <img src="../../../assets/add.png" style="width: 20px;margin-bottom: 5px" alt="">
+        <span class="text-left font">到期日期</span>
+      </div>
+      <div class="col-xs-8 col-sm-8 col-md-8">
+        <datepicker :value.sync="model.f_expiration_date" v-model="model.f_expiration_date" :format="'yyyy-MM-dd'"
+                    placeholder="到期日期" style="width: 60%">
+        </datepicker>
+      </div>
+    </div>
+    <div class="row app-row col-xs-12 col-sm-6 col-md-6">
+      <div class="col-xs-4 col-sm-4 col-md-4">
+        <img src="../../../assets/add.png" style="width: 20px;margin-bottom: 5px" alt="">
+        <span class="text-left font">金额</span>
+      </div>
+      <div class="col-xs-8 col-sm-8 col-md-8">
+        <input type="number" class="form-control show-font" v-model="model.f_money" placeholder="请输入金额">
+      </div>
+    </div>
+    <div class="row app-row col-xs-12 col-sm-6 col-md-6">
+      <div class="col-xs-4 col-sm-4 col-md-4">
+        <img src="../../../assets/add.png" style="width: 20px;margin-bottom: 5px" alt="">
+        <span class="text-left font">保险险种</span>
+      </div>
+      <div class="col-xs-8 col-sm-8 col-md-8">
+        <input-select
+          class="select select_list"
+          :value.sync="model.f_insurance_type"
+          v-model="model.f_insurance_type"
+          :options="insuranceTtype"
+          :valueSingle="true"
+        ></input-select>
+      </div>
+    </div>
+    <div class="row app-row col-xs-12 col-sm-6 col-md-6">
+      <div class="col-xs-4 col-sm-4 col-md-4">
+        <img src="../../../assets/add.png" style="width: 20px;margin-bottom: 5px" alt="">
+        <span class="text-left font">售卖人员</span>
+      </div>
+      <div class="col-xs-8 col-sm-8 col-md-8">
+        <input-select
+          class="select select_list"
+          :value.sync="model.f_sale_person"
+          v-model="model.f_sale_person"
+          :options="paymans"
+          :valueSingle="true"
+        ></input-select>
+      </div>
+    </div>
+    <div class="row app-row col-xs-12">
+      <div class="col-xs-4 col-sm-4 col-md-4">
+        <img src="../../../assets/add.png" style="width: 20px;" alt="">
+        <span class="text-left font">备注</span>
+      </div>
+      <div class="col-xs-8 col-sm-8 col-md-8">
+        <input class="form-control show-font" v-model="model.f_comments" placeholder="备注">
+      </div>
+    </div>
+    <div class="col-xs-12 text-center  app-row">
+      <button type="button" class="btn btn-lg btn-font btn-color" style="width: 22%;" @click="commitBefore()">确认</button>
+    </div>
+    <modal v-if="showmOrder" :show.sync="showmOrder" v-ref:modal :large="true"
+           :backdrop="false" title="保险收费">
+      <header slot="modal-header" class="modal-header">
+        <button type="button" class="close" @click="closeModel"><span>&times;</span></button>
+        <h4 class="modal-title">保险收费</h4>
+      </header>
+      <article slot="modal-body" class="modal-body clearfix">
+        <div  class="form-group col-sm-12 panel panel-info">
+          <div class="form-group col-sm-6">
+            <label class="col-sm-4 control-label">收款方式：</label>
+            <div class="col-sm-8">
+              <input-select
+                class="select select_list"
+                :value.sync="model.f_payment"
+                v-model="model.f_payment"
+                :options="payTypes"
+                :valueSingle="true"></input-select>
+            </div>
+          </div>
+        </div>
+        <div v-if="zfCode" style="margin-top: 20px; text-align: center;">
+          <div id="qrcode" style="margin-top: 25px;width: 266px;height: 266px"></div>
+        </div>
+      </article>
+      <footer slot="modal-footer" class="modal-footer">
+        <button type="button" class="btn btn-primary" :disabled="isSubmitting" @click="commitCharge()">
+          {{ isSubmitting ? '确认中...' : '确认' }}
+        </button>
+      </footer>
+    </modal>
+  </div>
+</template>
+<script>
+import { HttpResetClass } from 'vue-client'
+import * as Util from '../../../components/Util'
+import Vue from 'vue'
+import QRCode from 'qrcodejs2'
+export default {
+  title: '手机单户抄表',
+  data() {
+    return {
+      paymanshow:this.$appdata.getSingleValue('app增值收费售卖人员'),
+      paymans:[],
+      orderinfo:{},
+      f_user_type:'',
+      insuranceTtype:[],
+      payTypes: this.$appdata.getParam('移动端支付方式'),
+      create_date:Util.getNowDate(),
+      isCommit:false,
+      order: {}, // 订单信息
+      f_out_trade_no: '',
+      showmOrder:false,
+      zfCode:false,
+      isSubmitting: false, // 添加防重复提交标志
+      isSaveing:false,    // 添加防重复提交标志
+      isCheckingOrder: false,
+    }
+  },
+  props: {
+    data: {
+      type: Object,
+      default: function () {
+        return {
+        }
+      }
+    },
+    model: {
+      type: Object,
+      default: {}
+    }
+  },
+  ready() {
+    new HttpResetClass().load('post', `${this.$androidUtil.getProxyUrl()}/rs/sql/tel_singleTable_OrderBy`, {
+      data: {
+        items: 'tu.*',
+        tablename: 't_userinfo ui left join t_userfees tu on tu.f_userinfo_id=ui.f_userinfo_id and tu.f_state = \'有效\' ',
+        condition: `ui.f_userinfo_id  = '${this.model.f_userinfo_id}'`,
+        orderitem: '1'
+      }
+    }).then(response => {
+      if (response.data.length > 0) {
+        this.model.f_last_insexpiration_date = response.data[0].f_expiration_date
+      }
+    })
+    Vue.set(this.model, 'f_money', 0)
+    Vue.set(this.model, 'f_fee_type', '')
+    Vue.set(this.model, 'f_comments', '')
+    Vue.set(this.model, 'f_salecount', 1)
+    Vue.set(this.model, 'f_ins_number', '')
+    Vue.set(this.model, 'f_idnumber', '')
+    Vue.set(this.model, 'f_ins_start_date', Util.toStandardDateString())
+    Vue.set(this.model, 'f_expiration_date', '')
+    Vue.set(this.model, 'f_payment', 'app二维码收款')
+    this.getType()
+    this.getEmp()
+  },
+  methods: {
+    getEmp () {
+      let val = {source: 'this.getParentByType($organization$).getChildByName($销售人$).getUsers()',
+        userid: `${Vue.user.id}`}
+      let http = new HttpResetClass()
+      http.load('POST', `${this.$androidUtil.getProxyUrl()}/rs/search`, {data: val}, {resolveMsg: null, rejectMsg: null}).then((res) => {
+        res.data.forEach((item) => {
+          this.paymans.push({label: item.name, value: item.name})
+        })
+      })
+    },
+    //获取保险类型
+    async getType() {
+      let data = {
+        tablename: 't_userfiles',
+        condition: `f_userinfo_id = '${this.model.f_userinfo_id}'`
+      }
+      let res = await new HttpResetClass().load('post', this.$androidUtil.getProxyUrl() + '/rs/sql/tel_singleTable', {data: data}, {
+        resolveMsg: null,
+        rejectMsg: '获取数据失败'
+      })
+      let str = res.data[0].f_gasproperties
+      if (str === '居民用气') {
+        this.insuranceTtype = this.$appdata.getParam('居民燃气意外险')
+      }else {
+        this.insuranceTtype = this.$appdata.getParam('非居民燃气意外险')
+      }
+    },
+    closeModel(){
+      this.showmOrder = false
+      this.isSubmitting = false
+      if (this.orderInterval) {
+        clearTimeout(this.orderInterval)
+        this.orderInterval = null
+      }
+    },
+    commitBefore(){
+      if (!this.model.f_money) {
+        this.$showMessage('金额未填写，请填写后重新尝试。')
+        return
+      }else {
+        //转为数字类型
+        this.model.f_money = Number(this.model.f_money)
+      }
+      if (this.paymanshow && !this.model.f_sale_person) {
+        return this.$showMessage(`请选择售卖人员！`)
+      }
+      if (!this.model.f_ins_start_date) {
+        this.$showMessage('投保日期未选择，请选择后重新尝试。')
+        return
+      }
+      if (!this.model.f_expiration_date) {
+        this.$showMessage('到期日期未选择，请选择后重新尝试。')
+        return
+      }
+      if (!this.model.f_insurance_type) {
+        this.$showMessage('保险险种未填写，请填写后重新尝试。')
+        return
+      }
+      this.showmOrder = true
+    },
+    async commitCharge() {
+      // 防止重复提交
+      if (this.isSubmitting) {
+        return
+      }
+      if(this.model.f_payment ==''){
+        this.$showMessage('请选择支付方式。')
+        return
+      }
+      this.isSubmitting = true // 设置提交状态
+      try {
+        if (this.model.f_payment.includes('二维码')) {
+          await this.openQrcode()
+        } else {
+          await this.commit()
+          this.isSubmitting = false // 非二维码支付时在这里重置
+        }
+      } catch (error) {
+        console.error('提交失败:', error)
+        this.$showMessage('提交失败')
+        this.isSubmitting = false // 重置提交状态
+      }
+    },
+    async getOrderInformation() {
+      console.log('查询订单信息！！！')
+      // 添加标志位，防止重复执行
+      if (this.isCheckingOrder) {
+        return;
+      }
+      try {
+        this.isCheckingOrder = true;
+        let http = new HttpResetClass()
+        let res = await http.load('POST', `${this.$androidUtil.getProxyUrl()}/wx/rs/pay/microPayOrderStatus`, {
+          "filiale": "siyang",
+          "flag": "microPayRongHaoJsbc",
+          "f_out_trade_no": `${this.f_out_trade_no}`,
+          "posid": this.$androidUtil.getDeviceIEMI()
+        }, {
+          resolveMsg: null,
+          rejectMsg: '订单查询失败！！！'
+        })
+        // 支付成功
+        if (res.data.trade_state.includes('已支付')) {
+          this.orderinfo = res.data
+          clearTimeout(this.orderInterval)
+          this.$showMessage('支付成功！！！')
+          await this.commit()
+          this.clearQrCode()
+          this.closeModel()
+        } else if (res.data.trade_state.includes("已退款")) {
+          this.$showMessage("已退款，请重新下单支付！！！");
+          this.clearQrCode();
+          this.closeModel()
+          if (this.orderInterval) {
+            clearTimeout(this.orderInterval);
+            this.orderInterval = null
+          }
+        }else{
+          this.isCheckingOrder = false
+          //重新查询订单状态
+          this.orderInterval = setTimeout(() => {
+            this.getOrderInformation()
+          }, 3000)
+        }
+      } catch (error) {
+        console.error("查询订单状态失败:", error);
+        if (this.orderInterval) {
+          clearTimeout(this.orderInterval);
+          this.orderInterval = null
+        }
+        this.isCheckingOrder = false; // 发生错误时重置标志位
+      } finally {
+        // 确保在非轮询状态下重置标志位
+        if (!this.orderInterval) {
+          this.isCheckingOrder = false;
+        }
+      }
+    },
+    async openQrcode() {
+      this.clearQrCode()
+      let data = {
+        tablename: 't_userfiles',
+        condition: `f_userinfo_id = '${this.model.f_userinfo_id}'`
+      }
+      let res = await new HttpResetClass().load('post', this.$androidUtil.getProxyUrl() + '/rs/sql/tel_singleTable', {data: data}, {
+        resolveMsg: null,
+        rejectMsg: '获取数据失败'
+      })
+      let reqdata = {
+        "filiale": "siyang",
+        "flag": "microPayRongHaoJsbc",
+        "money": this.model.f_money,
+        "proinfo": "保险收费",
+        "f_userinfo_id": this.model.f_userinfo_id,
+        "f_userfiles_id": res.data[0].f_userfiles_id,
+        "f_user_id": res.data[0].f_user_id,
+        "posid": this.$androidUtil.getDeviceIEMI()
+      }
+      new HttpResetClass().load('POST', `${this.$androidUtil.getProxyUrl()}/wx/rs/pay/jsApiPay`, reqdata).then(res => {
+        if (res.data.result_code.includes('SUCCESS')) {
+          this.order = res.data
+          this.f_out_trade_no = res.data.f_out_trade_no
+          this.zfCode = true
+          this.$nextTick(() => {
+            this.qrcode(res.data.qr_code)
+          })
+          this.getOrderInformation()
+        } else {
+          this.$showMessage('网络异常。。。')
+        }
+      })
+    },
+    qrcode(url) {
+      new QRCode('qrcode', {
+        text: url, // 设置二维码内容或跳转地址
+        width: 266, // 设置宽度，单位像素
+        height: 266, // 设置高度，单位像素
+        correctLevel: QRCode.CorrectLevel.L //容错率，L/M/Hs
+      })
+    },
+    clearQrCode() {
+      if (document.getElementById('qrcode')) {
+        document.getElementById('qrcode').innerHTML = ''
+      }
+    },
+    async commit() {
+      try {
+        let commit_data = this.model
+        commit_data.f_sale_person = this.model.f_sale_person ? this.model.f_sale_person :Vue.user.name
+        commit_data.f_buy_date = this.create_date
+        commit_data.f_total_ins_charge = 0
+        commit_data.f_operatorid = Vue.user.id
+        commit_data.f_operator = Vue.user.name
+        commit_data.f_operate_date = Util.toStandardTimeString()
+        commit_data.f_state = '有效'
+        commit_data.f_orgid = Vue.user.orgid
+        commit_data.f_orgname = Vue.user.orgs
+        commit_data.f_depid = Vue.user.depids
+        commit_data.f_depname = Vue.user.deps
+        commit_data.f_serial_id = this.orderinfo.f_out_trade_no
+        commit_data.order=this.order
+
+        const response = await new HttpResetClass().load('post', `${this.$androidUtil.getProxyUrl()}/api/af-revenue/logic/saveInsInfo`, { data: commit_data })
+        this.$showMessage('提交成功')
+        this.orderinfo = {}
+        this.showmOrder = false
+      } catch (error) {
+        console.error('提交失败:', error)
+        this.$showMessage('提交失败')
+        this.showmOrder = false
+      }
+    },
+  },
+  watch: {
+    'model.f_ins_start_date'(new_var) {
+      if (new_var && this.model.f_salecount) {
+        this.model.f_expiration_date = Number(new_var.substring(0, 4)) + Number(this.model.f_salecount) + new_var.substring(4)
+      }
+    },
+    'model.f_salecount'(new_var) {
+      if(!this.model.f_ins_start_date){
+        this.model.f_ins_start_date = Util.toStandardDateString()
+      }
+
+      if (this.model.f_ins_start_date && new_var) {
+        this.model.f_expiration_date = Number(this.model.f_ins_start_date.substring(0, 4)) + Number(new_var) + this.model.f_ins_start_date.substring(4)
+      }
+    }
+  }
+}
+</script>
+<style scoped>
+.mt-5 {
+  margin-top: 5px;
+}
+
+.mt-10 {
+  margin-top: 10px;
+}
+
+.mt-20 {
+  margin-top: 20px;
+}
+
+.app-row {
+  background-color: white;
+  padding: 10px 10px 0 10px;
+  border-bottom: 1px solid rgba(235, 235, 235, 0.5);
+}
+
+.app-row-none-border {
+  background-color: white;
+  padding: 10px 10px 0 10px;
+}
+
+.font {
+  font: 15px PingFang-SC-Medium;
+  color: #666666;
+}
+
+.show-font {
+  font: 15px PingFang-SC-Medium;
+  color: #333333
+}
+
+.btn-font {
+  font: 600 16px PingFang-SC-Bold;
+  color: #499EDF;
+}
+
+.btn-color {
+  background-color: #FFFFFF;
+  border-radius: 10px;
+  border: 1px solid #499EDF;
+}
+</style>