|  | @@ -1,7 +1,12 @@
 | 
	
		
			
				|  |  |  <template>
 | 
	
		
			
				|  |  |    <div class="chioseWrap">
 | 
	
		
			
				|  |  |      <el-form :inline="true" ref="payForm" :model="payForm">
 | 
	
		
			
				|  |  | -      <el-form-item prop="payType" :rules="[{required: true, message: '请选择支付方式', trigger: 'change'}]">
 | 
	
		
			
				|  |  | +      <el-form-item
 | 
	
		
			
				|  |  | +        prop="payType"
 | 
	
		
			
				|  |  | +        :rules="[
 | 
	
		
			
				|  |  | +          { required: true, message: '请选择支付方式', trigger: 'change' }
 | 
	
		
			
				|  |  | +        ]"
 | 
	
		
			
				|  |  | +      >
 | 
	
		
			
				|  |  |          <el-select
 | 
	
		
			
				|  |  |            v-model.trim="payForm.payType"
 | 
	
		
			
				|  |  |            style="width: 180px"
 | 
	
	
		
			
				|  | @@ -18,7 +23,11 @@
 | 
	
		
			
				|  |  |          :header-cell-style="{ background: '#EDEEF0', color: '#444' }"
 | 
	
		
			
				|  |  |          :data="tableList"
 | 
	
		
			
				|  |  |        >
 | 
	
		
			
				|  |  | -        <el-table-column align="center" prop="platformServeName" label="产品名称">
 | 
	
		
			
				|  |  | +        <el-table-column
 | 
	
		
			
				|  |  | +          align="center"
 | 
	
		
			
				|  |  | +          prop="platformServeName"
 | 
	
		
			
				|  |  | +          label="产品名称"
 | 
	
		
			
				|  |  | +        >
 | 
	
		
			
				|  |  |          </el-table-column>
 | 
	
		
			
				|  |  |          <el-table-column align="center" label="学员上限">
 | 
	
		
			
				|  |  |            <template slot-scope="scope">
 | 
	
	
		
			
				|  | @@ -32,34 +41,43 @@
 | 
	
		
			
				|  |  |          </el-table-column>
 | 
	
		
			
				|  |  |          <el-table-column align="center" prop="num" label="数量">
 | 
	
		
			
				|  |  |          </el-table-column>
 | 
	
		
			
				|  |  | -        <el-table-column
 | 
	
		
			
				|  |  | -          align="center"
 | 
	
		
			
				|  |  | -          label="原价(元)"
 | 
	
		
			
				|  |  | -        >
 | 
	
		
			
				|  |  | +        <el-table-column align="center" label="原价(元)">
 | 
	
		
			
				|  |  |            <template slot-scope="scope">
 | 
	
		
			
				|  |  |              {{ scope.row.rechargeAmount | hasMoneyFormat }}
 | 
	
		
			
				|  |  |            </template>
 | 
	
		
			
				|  |  |          </el-table-column>
 | 
	
		
			
				|  |  | -        <el-table-column
 | 
	
		
			
				|  |  | -          align="center"
 | 
	
		
			
				|  |  | -          label="支付价格(元)"
 | 
	
		
			
				|  |  | -        >
 | 
	
		
			
				|  |  | +        <el-table-column align="center" label="支付价格(元)">
 | 
	
		
			
				|  |  |            <template slot-scope="scope">
 | 
	
		
			
				|  |  | -            <span style="color: red;">{{ scope.row.value | hasMoneyFormat }}</span>
 | 
	
		
			
				|  |  | +            <span style="color: red;">{{
 | 
	
		
			
				|  |  | +              scope.row.value | hasMoneyFormat
 | 
	
		
			
				|  |  | +            }}</span>
 | 
	
		
			
				|  |  |            </template>
 | 
	
		
			
				|  |  |          </el-table-column>
 | 
	
		
			
				|  |  |        </el-table>
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | -      <el-form-item prop="checked" :rules="[{required: true, message: '请阅读并同意协议', trigger: 'change'}]">
 | 
	
		
			
				|  |  | +      <el-form-item
 | 
	
		
			
				|  |  | +        prop="checked"
 | 
	
		
			
				|  |  | +        :rules="[
 | 
	
		
			
				|  |  | +          { required: true, message: '请阅读并同意协议', trigger: 'change' }
 | 
	
		
			
				|  |  | +        ]"
 | 
	
		
			
				|  |  | +      >
 | 
	
		
			
				|  |  |          <el-checkbox v-model="payForm.checked" @change="onCheckChange">
 | 
	
		
			
				|  |  |          </el-checkbox>
 | 
	
		
			
				|  |  | -          <span style="color: #606266; padding-left: 5px;cursor: pointer;" @click="onCheckBox">我已阅读并同意</span>
 | 
	
		
			
				|  |  | -          <span @click.stop="onLookContract" style="color: #01C1B5;cursor: pointer;">《产品及服务协议》</span>
 | 
	
		
			
				|  |  | +        <span
 | 
	
		
			
				|  |  | +          style="color: #606266; padding-left: 5px;cursor: pointer;"
 | 
	
		
			
				|  |  | +          @click="onCheckBox"
 | 
	
		
			
				|  |  | +          >我已阅读并同意</span
 | 
	
		
			
				|  |  | +        >
 | 
	
		
			
				|  |  | +        <span
 | 
	
		
			
				|  |  | +          @click.stop="onLookContract"
 | 
	
		
			
				|  |  | +          style="color: #01C1B5;cursor: pointer;"
 | 
	
		
			
				|  |  | +          >《产品及服务协议》</span
 | 
	
		
			
				|  |  | +        >
 | 
	
		
			
				|  |  |        </el-form-item>
 | 
	
		
			
				|  |  |      </el-form>
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  |      <span slot="footer" class="dialog-footer">
 | 
	
		
			
				|  |  | -      <el-button @click="$listeners.close();">取 消</el-button>
 | 
	
		
			
				|  |  | +      <el-button @click="$listeners.close()">取 消</el-button>
 | 
	
		
			
				|  |  |        <el-button @click="onMemberPay" type="primary">确 定</el-button>
 | 
	
		
			
				|  |  |      </span>
 | 
	
		
			
				|  |  |  
 | 
	
	
		
			
				|  | @@ -85,17 +103,23 @@
 | 
	
		
			
				|  |  |        width="500px"
 | 
	
		
			
				|  |  |        append-to-body
 | 
	
		
			
				|  |  |      >
 | 
	
		
			
				|  |  | -      <payment :tableList="tableList" :orderNo="orderNo" v-on="$listeners" :codeUrl="codeUrl" @close="onPaymentClose" />
 | 
	
		
			
				|  |  | +      <payment
 | 
	
		
			
				|  |  | +        :tableList="tableList"
 | 
	
		
			
				|  |  | +        :orderNo="orderNo"
 | 
	
		
			
				|  |  | +        v-on="$listeners"
 | 
	
		
			
				|  |  | +        :codeUrl="codeUrl"
 | 
	
		
			
				|  |  | +        @close="onPaymentClose"
 | 
	
		
			
				|  |  | +      />
 | 
	
		
			
				|  |  |      </el-dialog>
 | 
	
		
			
				|  |  |    </div>
 | 
	
		
			
				|  |  |  </template>
 | 
	
		
			
				|  |  |  <script>
 | 
	
		
			
				|  |  |  // import { recharge } from '../api'
 | 
	
		
			
				|  |  | -import { vaildStudentUrl } from '@/utils/validate'
 | 
	
		
			
				|  |  | -import payment from '@/views/productService/model/payment'
 | 
	
		
			
				|  |  | +import { vaildStudentUrl } from "@/utils/validate";
 | 
	
		
			
				|  |  | +import payment from "@/views/productService/model/payment";
 | 
	
		
			
				|  |  |  import previewProtocol from "@/views/tenantSetting/model/previewProtocol";
 | 
	
		
			
				|  |  | -import { tenantInfoRePay, getContract } from '../api'
 | 
	
		
			
				|  |  | -import { getTenantId } from '@/utils/auth'
 | 
	
		
			
				|  |  | +import { tenantInfoRePay, getContract } from "../api";
 | 
	
		
			
				|  |  | +import { getTenantId } from "@/utils/auth";
 | 
	
		
			
				|  |  |  export default {
 | 
	
		
			
				|  |  |    props: ["value", "tenantInfo"],
 | 
	
		
			
				|  |  |    components: { payment, previewProtocol },
 | 
	
	
		
			
				|  | @@ -103,7 +127,7 @@ export default {
 | 
	
		
			
				|  |  |      return {
 | 
	
		
			
				|  |  |        payForm: {
 | 
	
		
			
				|  |  |          payType: null,
 | 
	
		
			
				|  |  | -        checked: null,
 | 
	
		
			
				|  |  | +        checked: null
 | 
	
		
			
				|  |  |        },
 | 
	
		
			
				|  |  |        fileContent: null,
 | 
	
		
			
				|  |  |        lookVisible: false,
 | 
	
	
		
			
				|  | @@ -116,90 +140,130 @@ export default {
 | 
	
		
			
				|  |  |      };
 | 
	
		
			
				|  |  |    },
 | 
	
		
			
				|  |  |    async mounted() {
 | 
	
		
			
				|  |  | -    if(this.value) {
 | 
	
		
			
				|  |  | -      const { contractPrice, originalPrice, ...res } = this.tenantInfo
 | 
	
		
			
				|  |  | -      this.tableList = [{
 | 
	
		
			
				|  |  | -        ...res,
 | 
	
		
			
				|  |  | -        num: this.value,
 | 
	
		
			
				|  |  | -        rechargeAmount: this.value * originalPrice,
 | 
	
		
			
				|  |  | -        value: this.value * contractPrice
 | 
	
		
			
				|  |  | -      }]
 | 
	
		
			
				|  |  | +    if (this.value) {
 | 
	
		
			
				|  |  | +      const { contractPrice, originalPrice, ...res } = this.tenantInfo;
 | 
	
		
			
				|  |  | +      this.tableList = [
 | 
	
		
			
				|  |  | +        {
 | 
	
		
			
				|  |  | +          ...res,
 | 
	
		
			
				|  |  | +          num: this.value,
 | 
	
		
			
				|  |  | +          rechargeAmount: this.value * originalPrice,
 | 
	
		
			
				|  |  | +          value: this.value * contractPrice
 | 
	
		
			
				|  |  | +        }
 | 
	
		
			
				|  |  | +      ];
 | 
	
		
			
				|  |  |      }
 | 
	
		
			
				|  |  |    },
 | 
	
		
			
				|  |  |    methods: {
 | 
	
		
			
				|  |  |      onCheckChange() {
 | 
	
		
			
				|  |  | -      if(!this.payForm.checked) {
 | 
	
		
			
				|  |  | -        this.payForm.checked = null
 | 
	
		
			
				|  |  | +      if (!this.payForm.checked) {
 | 
	
		
			
				|  |  | +        this.payForm.checked = null;
 | 
	
		
			
				|  |  |        }
 | 
	
		
			
				|  |  |      },
 | 
	
		
			
				|  |  |      onCheckBox() {
 | 
	
		
			
				|  |  | -      if(this.payForm.checked) {
 | 
	
		
			
				|  |  | -        this.payForm.checked = null
 | 
	
		
			
				|  |  | +      if (this.payForm.checked) {
 | 
	
		
			
				|  |  | +        this.payForm.checked = null;
 | 
	
		
			
				|  |  |        } else {
 | 
	
		
			
				|  |  | -        this.payForm.checked = true
 | 
	
		
			
				|  |  | +        this.payForm.checked = true;
 | 
	
		
			
				|  |  |        }
 | 
	
		
			
				|  |  |      },
 | 
	
		
			
				|  |  |      onMemberPay() {
 | 
	
		
			
				|  |  | -      this.$refs.payForm.validate(async (_) => {
 | 
	
		
			
				|  |  | -        if(_) {
 | 
	
		
			
				|  |  | +      this.$refs.payForm.validate(async _ => {
 | 
	
		
			
				|  |  | +        if (_) {
 | 
	
		
			
				|  |  |            try {
 | 
	
		
			
				|  |  | -            console.log(this.value, 'this.value')
 | 
	
		
			
				|  |  | -            const res = await tenantInfoRePay({ id: getTenantId(), val: this.value })
 | 
	
		
			
				|  |  | +            console.log(this.value, "this.value");
 | 
	
		
			
				|  |  | +            const res = await tenantInfoRePay({
 | 
	
		
			
				|  |  | +              id: getTenantId(),
 | 
	
		
			
				|  |  | +              val: this.value
 | 
	
		
			
				|  |  | +            });
 | 
	
		
			
				|  |  |              // console.log(res)
 | 
	
		
			
				|  |  | -            if(res.data.amount == 0 && res.data.orderNo) {
 | 
	
		
			
				|  |  | -              this.$message.success('您已成功缴费')
 | 
	
		
			
				|  |  | -              this.onPaymentClose(true)
 | 
	
		
			
				|  |  | -              this.$listeners.getList()
 | 
	
		
			
				|  |  | -              return
 | 
	
		
			
				|  |  | +            if (res.data.amount == 0 && res.data.orderNo) {
 | 
	
		
			
				|  |  | +              this.$message.success("您已成功缴费");
 | 
	
		
			
				|  |  | +              this.onPaymentClose(true);
 | 
	
		
			
				|  |  | +              this.$listeners.getList();
 | 
	
		
			
				|  |  | +              return;
 | 
	
		
			
				|  |  |              }
 | 
	
		
			
				|  |  | -            const payForm = this.payForm
 | 
	
		
			
				|  |  | +            const payForm = this.payForm;
 | 
	
		
			
				|  |  |              // 二维码页面, 唤起支付页面
 | 
	
		
			
				|  |  | -            const { orderNo, sign, amount, orderBody, orderSubject } = res.data.payMap
 | 
	
		
			
				|  |  | -            this.orderNo = orderNo
 | 
	
		
			
				|  |  | -            this.codeUrl = vaildStudentUrl() + '/#/payCenter?orderNo=' + orderNo + '&sign=' + sign + '&amount=' + amount + '&payType=' + payForm.payType + '&orderBody=' + orderBody + '&orderSubject=' + orderSubject + '&platform=tenant'
 | 
	
		
			
				|  |  | -            console.log(this.codeUrl, 'codeUrl')
 | 
	
		
			
				|  |  | -            this.payMentVisible = true
 | 
	
		
			
				|  |  | -          } catch(e) {}
 | 
	
		
			
				|  |  | +            const {
 | 
	
		
			
				|  |  | +              orderNo,
 | 
	
		
			
				|  |  | +              sign,
 | 
	
		
			
				|  |  | +              amount,
 | 
	
		
			
				|  |  | +              orderBody,
 | 
	
		
			
				|  |  | +              orderSubject,
 | 
	
		
			
				|  |  | +              tenantId,
 | 
	
		
			
				|  |  | +              returnUrl,
 | 
	
		
			
				|  |  | +              notifyUrl
 | 
	
		
			
				|  |  | +            } = res.data.payMap;
 | 
	
		
			
				|  |  | +            this.orderNo = orderNo;
 | 
	
		
			
				|  |  | +            this.codeUrl =
 | 
	
		
			
				|  |  | +              vaildStudentUrl() +
 | 
	
		
			
				|  |  | +              "/#/payCenter?orderNo=" +
 | 
	
		
			
				|  |  | +              orderNo +
 | 
	
		
			
				|  |  | +              "&sign=" +
 | 
	
		
			
				|  |  | +              sign +
 | 
	
		
			
				|  |  | +              "&amount=" +
 | 
	
		
			
				|  |  | +              amount +
 | 
	
		
			
				|  |  | +              "&payType=" +
 | 
	
		
			
				|  |  | +              payForm.payType +
 | 
	
		
			
				|  |  | +              "&orderBody=" +
 | 
	
		
			
				|  |  | +              orderBody +
 | 
	
		
			
				|  |  | +              "&orderSubject=" +
 | 
	
		
			
				|  |  | +              orderSubject +
 | 
	
		
			
				|  |  | +              "&platform=tenant" +
 | 
	
		
			
				|  |  | +              "&tenantId=" +
 | 
	
		
			
				|  |  | +              tenantId +
 | 
	
		
			
				|  |  | +              "&returnUrl=" +
 | 
	
		
			
				|  |  | +              returnUrl +
 | 
	
		
			
				|  |  | +              "¬ifyUrl=" +
 | 
	
		
			
				|  |  | +              notifyUrl;
 | 
	
		
			
				|  |  | +            console.log(this.codeUrl, "codeUrl");
 | 
	
		
			
				|  |  | +            this.payMentVisible = true;
 | 
	
		
			
				|  |  | +          } catch (e) {}
 | 
	
		
			
				|  |  |          }
 | 
	
		
			
				|  |  | -      })
 | 
	
		
			
				|  |  | +      });
 | 
	
		
			
				|  |  |      },
 | 
	
		
			
				|  |  |      onClose(done) {
 | 
	
		
			
				|  |  | -      this.onPaymentClose(false, done)
 | 
	
		
			
				|  |  | +      this.onPaymentClose(false, done);
 | 
	
		
			
				|  |  |      },
 | 
	
		
			
				|  |  |      async onLookContract() {
 | 
	
		
			
				|  |  |        // 如果有协议则不需要重新请求
 | 
	
		
			
				|  |  | -      if(!this.fileContent) {
 | 
	
		
			
				|  |  | +      if (!this.fileContent) {
 | 
	
		
			
				|  |  |          try {
 | 
	
		
			
				|  |  | -          const tenantId = this.$helpers.tenantId
 | 
	
		
			
				|  |  | -          const res = await getContract({ id: tenantId, type: 1, renewCount: this.value })
 | 
	
		
			
				|  |  | -          this.fileContent = res.data
 | 
	
		
			
				|  |  | -        } catch(e) {}
 | 
	
		
			
				|  |  | +          const tenantId = this.$helpers.tenantId;
 | 
	
		
			
				|  |  | +          const res = await getContract({
 | 
	
		
			
				|  |  | +            id: tenantId,
 | 
	
		
			
				|  |  | +            type: 1,
 | 
	
		
			
				|  |  | +            renewCount: this.value
 | 
	
		
			
				|  |  | +          });
 | 
	
		
			
				|  |  | +          this.fileContent = res.data;
 | 
	
		
			
				|  |  | +        } catch (e) {}
 | 
	
		
			
				|  |  |        }
 | 
	
		
			
				|  |  | -      this.lookVisible = true
 | 
	
		
			
				|  |  | +      this.lookVisible = true;
 | 
	
		
			
				|  |  |      },
 | 
	
		
			
				|  |  |      onPaymentClose(hideTip = false, callBack) {
 | 
	
		
			
				|  |  | -      if(hideTip) {
 | 
	
		
			
				|  |  | -        this.payMentVisible = false
 | 
	
		
			
				|  |  | -        this.$emit('close')
 | 
	
		
			
				|  |  | -        return
 | 
	
		
			
				|  |  | +      if (hideTip) {
 | 
	
		
			
				|  |  | +        this.payMentVisible = false;
 | 
	
		
			
				|  |  | +        this.$emit("close");
 | 
	
		
			
				|  |  | +        return;
 | 
	
		
			
				|  |  |        }
 | 
	
		
			
				|  |  |        this.$confirm(`是否支付完成?`, "提示", {
 | 
	
		
			
				|  |  |          confirmButtonText: "已完成支付",
 | 
	
		
			
				|  |  |          cancelButtonText: "未完成支付",
 | 
	
		
			
				|  |  | -        type: "warning",
 | 
	
		
			
				|  |  | -      }).then(async (res) => {
 | 
	
		
			
				|  |  | -        if(typeof callBack == 'function') {
 | 
	
		
			
				|  |  | -          callBack()
 | 
	
		
			
				|  |  | -        }
 | 
	
		
			
				|  |  | -        this.payMentVisible = false
 | 
	
		
			
				|  |  | -      }).catch(e => {
 | 
	
		
			
				|  |  | -        if(typeof callBack == 'function') {
 | 
	
		
			
				|  |  | -          callBack()
 | 
	
		
			
				|  |  | -        }
 | 
	
		
			
				|  |  | -        this.payMentVisible = false
 | 
	
		
			
				|  |  | -      });
 | 
	
		
			
				|  |  | +        type: "warning"
 | 
	
		
			
				|  |  | +      })
 | 
	
		
			
				|  |  | +        .then(async res => {
 | 
	
		
			
				|  |  | +          if (typeof callBack == "function") {
 | 
	
		
			
				|  |  | +            callBack();
 | 
	
		
			
				|  |  | +          }
 | 
	
		
			
				|  |  | +          this.payMentVisible = false;
 | 
	
		
			
				|  |  | +        })
 | 
	
		
			
				|  |  | +        .catch(e => {
 | 
	
		
			
				|  |  | +          if (typeof callBack == "function") {
 | 
	
		
			
				|  |  | +            callBack();
 | 
	
		
			
				|  |  | +          }
 | 
	
		
			
				|  |  | +          this.payMentVisible = false;
 | 
	
		
			
				|  |  | +        });
 | 
	
		
			
				|  |  |      }
 | 
	
		
			
				|  |  | -  },
 | 
	
		
			
				|  |  | +  }
 | 
	
		
			
				|  |  |  };
 | 
	
		
			
				|  |  |  </script>
 | 
	
		
			
				|  |  |  <style lang="less" scoped>
 |