新增页面

马宇豪

2025-01-23 e735896a68d8c1742859a06d7bc1c7c1bb61f57d

 src/views/specialOperationsPay/notCoalPay/components/addDialog.vue

@@ -8,58 +8,76 @@
    :before-close="handleClose"
  >
    <div class="infoTitle">
      <div>考试点名称：XXXXX</div>
      <div style="margin-left: 15px">管辖行政区划：XXXxxxx</div>
      <div>组织架构名称：<span style="font-weight: bolder">{{deptName}}</span></div>
      <div style="margin-left: 15px">管辖行政区划：<span style="font-weight: bolder">{{districtName}}</span></div>
    </div>
    <el-form ref="dataForm" :model="dataForm"  :rules="rules" label-position="right" label-width="150px" style="padding-right: 50px" element-loading-text="保存中...">
      <el-form-item label="批次名称:" prop="batchName">
        <el-input v-model.trim="dataForm.batchName"/>
      </el-form-item>
<!--      <el-form-item label="所属区划:" prop="districtCode">-->
<!--        <el-select v-model="dataForm.districtCode" placeholder="行政区划" @change="getNewCategoryList">-->
<!--          <el-option-->
<!--            v-for="item in areaList"-->
<!--            :key="item.id"-->
<!--            :label="item.name"-->
<!--            :value="item.code">-->
<!--          </el-option>-->
<!--        </el-select>-->
<!--      </el-form-item>-->
<!--      <el-form-item label="考试点:" prop="deptId">-->
<!--        <el-select v-model="dataForm.deptId" size="small" placeholder="请选择考试点">-->
<!--          <el-option-->
<!--            v-for="item in examList"-->
<!--            :key="item.siteId"-->
<!--            :label="item.siteName"-->
<!--            :value="item.siteId">-->
<!--          </el-option>-->
<!--        </el-select>-->
<!--      </el-form-item>-->
      <el-form-item label="所属缴费周期：" prop="year">
        <div style="display: flex">
          <el-select v-model="dataForm.year" placeholder="请选择年份" style="width: 150px" clearable>
            <el-option
              v-for="item in yearList"
              :key="item.id"
              :label="item.label"
              :value="item.label">
            </el-option>
          </el-select>
          <el-date-picker
            v-model="dataForm.year"
            type="year"
            value-format="yyyy"
            placeholder="选择年">
          </el-date-picker>
          <el-select v-model="dataForm.quarter" placeholder="请选择季度" style="width: 150px;margin-left: 5px" clearable>
            <el-option
              v-for="item in quarterList"
              :key="item.id"
              :label="item.label"
              :value="item.label">
              :value="item.id">
            </el-option>
          </el-select>
        </div>
      </el-form-item>
      <el-form-item label="缴费类型:" prop="type">
        <el-radio-group v-model="dataForm.type" @change="changeRadio" v-removeAriaHidden>
      <el-form-item label="缴费类型:" prop="payType">
        <el-radio-group v-model="dataForm.payType" @change="changeRadio" v-removeAriaHidden>
          <el-radio
            v-for="item in payType"
            v-for="item in payTypeList"
            :key="item.id"
            :label="item.id"
          >{{item.label}}</el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item v-if="dataForm.type === 1 || dataForm.type === 3 || dataForm.type === 4 "  label="理论类别:"  prop="deal" style="margin-left: 85px">
          <el-select v-model="dataForm.deal" placeholder="请选择" style="width: 84%" clearable>
      <el-form-item v-if="dataForm.payType === 1 || dataForm.payType === 3 || dataForm.payType === 4"  label="理论类别:" prop="dealId">
          <el-select v-model="dataForm.dealId" placeholder="请选择" style="width: 100%" clearable>
            <el-option
              v-for="item in dealList"
              :key="item.id"
              :label="item.label"
              :label="item.subjectName"
              :value="item.id">
            </el-option>
          </el-select>
      </el-form-item>
      <el-form-item v-if="dataForm.type === 2 || dataForm.type === 3" label="实操类别:" prop="operation" style="margin-left: 85px">
          <el-select v-model="dataForm.operation" placeholder="请选择" style="width: 84%" clearable>
      <el-form-item v-if="dataForm.payType === 2 || dataForm.payType === 3" label="实操类别:" prop="operateId">
          <el-select v-model="dataForm.operateId" placeholder="请选择" style="width: 100%" clearable>
            <el-option
              v-for="item in operationList"
              :key="item.id"
              :label="item.label"
              :label="item.subjectName"
              :value="item.id">
            </el-option>
          </el-select>
@@ -74,6 +92,8 @@

<script >
import { addPlat, updatePlat } from '@/api/onlineEducation/plat'
import {addNonCoalPay, getNotCoalPayCategory} from "@/api/specialOperationsPay/notCoalPay";
import store from "@/store";

export default {
  name: 'addUser',
@@ -83,45 +103,19 @@
    return {
      dialogVisible: false,
      dialogStatus: '',

      deptName: '',
      districtName: '',
      rules: {
        batchName: [{ required: true, message: '请输入批次名称', trigger: 'blur' }],
        year: [{ required: true, message: '请选择缴费周期', trigger: 'blur' }],
        type: [{ required: true, message: '请选择缴费类型', trigger: 'blur' }],
        operation: [{ required: true, message: '请选择实操类别', trigger: 'blur' }],
        deal: [{ required: true, message: '请选择理论类别', trigger: 'blur' }],
        quarter: [{ required: true, message: '请选择缴费周期', trigger: 'blur' }],
        payType: [{ required: true, message: '请选择季度', trigger: 'blur' }],
        operateId: [{ required: true, message: '请选择实操类别', trigger: 'blur' }],
        dealId: [{ required: true, message: '请选择理论类别', trigger: 'blur' }],
      },
      dataForm: {},
      yearList: [
        {
          id: 0,
          label: '2024年'
        },
        {
          id: 1,
          label: '2025年'
        },
        {
          id: 2,
          label: '2026年'
        },
        {
          id: 3,
          label: '2027年'
        },
        {
          id: 4,
          label: '2028年'
        },
        {
          id: 5,
          label: '2029年'
        },
        {
          id: 6,
          label: '2030年'
        },
      ],
      areaList: [],
      examList: [],
      quarterList: [
        {
          id: 1,
@@ -140,7 +134,7 @@
          label: '第四季度'
        },
      ],
      payType: [
      payTypeList: [
        {
          id: 1,
          label: '初训理论'
@@ -166,10 +160,15 @@

  },
  methods: {
    openDialog (type, data) {
      this.resetDataForm();
      this.dialogVisible = true;
      this.dialogStatus = type;
    openDialog (type, data, areaList, examList) {
      const userInfo = store.getters && store.getters.userInfo
      this.deptName = userInfo.dept.deptName
      this.districtName = userInfo.district.districtName
      this.resetDataForm(userInfo)
      this.areaList = areaList
      this.examList = examList
      this.dialogVisible = true
      this.dialogStatus = type
      if(this.dialogStatus == 'edit') {
        this.dataForm = data;
      }
@@ -177,10 +176,35 @@
        this.$refs['dataForm'].clearValidate()
      })
    },
    getCateGoryList(type) {
      getNotCoalPayCategory({categoryType: type,districtCode: this.dataForm.districtCode?this.dataForm.districtCode:''}).then((res) => {
        if (res.code == 200) {
          if(type == 1){
            this.dealList = res.rows
          }else{
            this.operationList = res.rows
          }
        }
      })
    },

    // getNewCategoryList(val){
    //   if(this.dataForm.payType){
    //     this.changeRadio(this.dataForm.payType)
    //   }
    // },

    changeRadio(val){
      console.log('val',val)
      this.dataForm.deal = null
      this.dataForm.operation = null
      if(val ==3){
        this.getCateGoryList(1)
        this.getCateGoryList(2)
      }else if(val == 1 || val == 4){
        this.getCateGoryList(1)
      }else{
        this.getCateGoryList(2)
      }
      this.dataForm.dealId = null
      this.dataForm.operateId = null
    },
    handleClose() {
      this.dialogVisible = false;
@@ -190,21 +214,29 @@
      this.$refs["dataForm"].validate( async valid => {
        if (valid) {
          if(this.dialogStatus == 'add'){
            console.log("this.dataForm",this.dataForm)
            // const res = await addPlat(this.dataForm);
            // if(res.code == 200) {
            //   this.$emit("getList");
            //   this.dialogVisible = false;
            //   this.$message({
            //     type:'success',
            //     message: '新增成功'
            //   })
            // }else{
            //   this.$message({
            //     type:'warning',
            //     message: res.msg
            //   })
            // }
            if(this.dataForm.payType == 3){
              this.dataForm.nonCoalPayCategoryList = [this.transFormObj(this.dealList.find(i=>i.id == this.dataForm.dealId)),this.transFormObj(this.operationList.find(i=>i.id == this.dataForm.operateId))]
            }else if(this.dataForm.payType == 1 || this.dataForm.payType == 4){
              this.dataForm.nonCoalPayCategoryList = [this.transFormObj(this.dealList.find(i=>i.id == this.dataForm.dealId))]
            }else{
              this.dataForm.nonCoalPayCategoryList = [this.transFormObj(this.operationList.find(i=>i.id == this.dataForm.operateId))]
            }
            this.dataForm.amount = this.dataForm.nonCoalPayCategoryList.map(i=>i.categoryAmount).reduce((acc, current) => acc + current, 0)
            const {dealId, operateId, ...data} = this.dataForm
            const res = await addNonCoalPay(data);
            if(res.code == 200) {
              this.$emit("getList");
              this.dialogVisible = false;
              this.$message({
                type:'success',
                message: '新增成功'
              })
            }else{
              this.$message({
                type:'warning',
                message: res.msg
              })
            }
          }else {
            // const res = await updatePlat(this.dataForm);
            // if(res.code == 200) {
@@ -225,8 +257,22 @@
      })

    },
    resetDataForm() {

    transFormObj(obj){
      return {
        categoryAmount: obj.amount,
        categoryType: obj.categoryType,
        categoryId: obj.id
      }
    },

    resetDataForm(info) {
      this.dataForm = {
        payPersonType: 1,
        districtCode: info.district.districtCode,
        deptId: info.dept.deptId,
        dealId: null,
        operateId: null
      }
    },
  }
@@ -239,7 +285,6 @@
  margin-bottom:20px;
  display: flex;
  justify-content: space-around;
  font-weight: 800;
  font-size: 16px
}