yos_meida/src/HManagement/siteManage/paymentRules/index.vue

<template>
  <div>
    <div class="container normal-panel normal-margin  flex-between">
      <el-button class="inline-24" type="primary" icon="el-icon-edit" size="small" v-if="!isSave && tool.checkAuth($route.name,'update')" @click="onEdit" >编 辑</el-button>
      <el-button class="inline-24" type="warning" icon="el-icon-edit" size="small" v-else-if="isSave && tool.checkAuth($route.name,'update')" @click="onSave">保 存</el-button>
      <versionDefinition class="inline-24" v-if="tool.checkAuth($route.name,'versionDefinition')"></versionDefinition>
      <payOrders class="inline-24" v-if="tool.checkAuth($route.name,'payOrders')"></payOrders>
    </div>
    <div class="container normal-panel">
      <el-row :gutter="20">
        <el-form :model="form" :rules="rules" ref="form" label-width="120px" label-position="right" size="mini" >
          <el-col :span="18">
            <el-form-item label="是否开启付费:" prop="sys_payswitch" >
              <el-radio v-model="form.sys_payswitch" label='1' @input="isSave = true" :disabled="!isOpen">开启</el-radio>
              <el-radio v-model="form.sys_payswitch" label='0' @input="isSave = false" :disabled="!isOpen">关闭</el-radio>
            </el-form-item>
          </el-col>
          <el-col :span="18">
            <el-form-item label="到期提醒天数:" prop="sys_payremind" >
              <el-input v-model="form.sys_payremind" placeholder="请填写到期提醒天数" :disabled="!isSave"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="18">
            <el-form-item label="试用时间(月份):" prop="sys_trialperiod" >
              <el-input v-model="form.sys_trialperiod" type="number" placeholder="请填写试用时间" :disabled="!isSave"></el-input>
              <span style="font-size: 12px;color: #a8a9af">若为0，则无试用时间；</span>
            </el-form-item>
          </el-col>
          <el-col :span="18">
            <el-form-item label="付费说明:" prop="brandname" >
              <el-input v-model="form.sys_payinstructions" placeholder="请填写付费说明" :disabled="!isSave"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="18">
            <el-form-item label="付费类型:" prop="sys_payincidence" >
              <el-radio v-model="form.sys_payincidence" label='1' :disabled="!isSave">按账号付费</el-radio>
              <el-radio v-model="form.sys_payincidence" label='2' :disabled="!isSave">按主体付费</el-radio>
            </el-form-item>
          </el-col>
          <el-col :span="18">
            <el-form-item >
              <accountRule ref="accountRule" v-if="form.sys_payincidence == '1'" :disabled="isSave"></accountRule>
              <mainBodyRule ref="mainBodyRule" v-else :disabled="isSave"></mainBodyRule>
            </el-form-item>
          </el-col>
        </el-form>
      </el-row>
    </div>
  </div>

</template>

<script>
import edit from './modules/edit.vue'
import versionDefinition from './modules/versionDefinition.vue'
import accountRule from './modules/accountRule.vue'
import mainBodyRule from './modules/mainBodyRule.vue'
import payOrders from './modules/payOrders.vue'
export default {
  name: "index",
  components:{edit,versionDefinition,accountRule,mainBodyRule,payOrders},
  data(){
    return {
      form:{
        "sys_payincidence": 1, //付费影响范围（付费类型）1，按账号，2按主体
        "sys_payswitch": 1, //系统付费开关
        "sys_trialperiod": '', //系统试用时间（月份）
        "sys_payinstructions": "",
        "sys_payremind":''
      },
      rules:{
        sys_payswitch: [
          { required: true, message: '请选择是否开启付费', trigger: 'change' },
        ],
        sys_trialperiod: [
          { required: true, message: '请填写试用时间', trigger: 'blur' },
        ],
        sys_payincidence: [
          { required: true, message: '请选择付费范围', trigger: 'change' },
        ],
      },
      isSave:false,
      isOpen:false
    }
  },
  methods:{
    async queryData(){
      const res = await this.$api.requested({
        "classname": "webmanage.site.site",
        "method": "querySite_Parameter",
        "content": {},
      })
      console.log(res,'站点信息数据')
      this.form.sys_payswitch = res.data.sys_payswitch == '1'?'1':'0'
      this.form.sys_payinstructions = res.data.sys_payinstructions
      this.form.sys_trialperiod = res.data.sys_trialperiod
      this.form.sys_payincidence = res.data.sys_payincidence == '1'?'1':'2'
      this.form.sys_payremind = res.data.sys_payremind
      console.log(this.form,'表单数据')
      if (this.form.sys_payswitch == '0'){
        this.isSave = false
        this.isOpen = false
      }else {
        this.isSave = false
        this.isOpen = false
      }
    },
    save(){
      console.log(this.form)
    },
    onEdit(){
      this.isOpen = true
      this.isSave = true
    },
    onSave(){
      this.$refs.form.validate(async (valid)=>{
        if (!valid) return false
        this.form.sys_payswitch = this.form.sys_payswitch == '1'?1:0
        this.form.sys_payincidence = this.form.sys_payincidence == '1'?1:2
        const res = await this.$api.requested({
          "classname": "webmanage.site.site",
          "method": "updateSitePayInfo",
          "content": this.form,
        })
        this.tool.showMessage(res,()=>{
          this.isOpen = false
          this.isSave = false
          this.form.sys_payswitch = res.data.sys_payswitch == '1'?'1':'0'
          this.form.sys_payincidence = res.data.sys_payincidence == '1'?'1':'2'
          this.queryData()
          this.$refs.accountRule.listData()
          this.$refs.mainBodyRule.queryData()
        })

      })

    }

  },
  mounted() {
    this.queryData()
  }
}
</script>

<style scoped>

</style>