emis-frontend/src/views/emis/emisSiteAccount/batchAddAccount.vue

<template>
  <div >
       <el-form ref="form" :model="form" :rules="rules" label-width="80px">
         <el-row :gutter="0" style="display: flex;flex-wrap: wrap;">
          <el-col :span="24">
            <el-form-item label="币种" prop="currency">
              <el-select v-model="form.currency" filterable placeholder="请选择币种" disabled>
                <el-option
                  v-for="dict in dict.type.sys_currency_type"
                  :key="dict.value"
                  :label="dict.label"
                  :value="dict.value"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="24">
          <el-form-item label="开户网点" prop="startSite">
              <el-button type="primary"  @click="handleSelectSite">选择网点</el-button>
              <el-input v-model="form.selSiteNameStr" type="textarea" rows="5" disabled placeholder="站点列表" />
            </el-form-item>
          </el-col>


        </el-row>
      </el-form>
      <div style="text-align: center;margin-bottom: 10px;">
        <el-button type="primary" @click="submitForm">确 定</el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>


    <el-dialog :key="resetRefreshId" :title="titleSiteSelectTreeForm" :visible.sync="openSiteSelectTreeForm" width="40%" :destroy-on-close="true" v-dialogDrag append-to-body>
        <EmisSiteSelectTreePicker  :isAddSite="isAddSite" :selectSiteCode="form.selSiteCodeStr" :selectSiteName="form.selSiteNameStr"  @on-changed="onSelectSiteTreeCheckChange" @on-cancel="onCancelSelectSiteTreeForm"></EmisSiteSelectTreePicker>
    </el-dialog>

  </div>
</template>

<script>
import { batchAddEmisSiteAccount,getHasAddSite } from "@/api/emis/emisSiteAccount";
import EmisSiteSelectTreePicker from '@/views/emis/EmisBaseTools/EmisSiteSelectTreePicker.vue';

import { parseTime,genJsSeqNo,getUUID } from "@/utils/custom";

export default {
  name: "emisSiteAccountForm",
  props:{
    id:{
        type:Number
    }
  },
  components: {  EmisSiteSelectTreePicker },
  dicts: [ 'sys_currency_type'
  ],
  data() {
    return {
      resetRefreshId:null,
      emisSiteAccountOptions: [],

      isAddSite:false,
      titleSiteSelectTreeForm:null,
      openSiteSelectTreeForm:false,

      // 遮罩层
      loading: true,
      // 表单参数
      form: {},
      // 表单校验
      rules: {
        id: [
          { required: true, message: "id不能为空", trigger: "blur" }
        ],
      }
    };
  },
   watch: {
      "id": {
        handler (newValue, oldValue) {
          this.id = newValue;
          this.initData();
        },
        deep: true
      }
  },
  created() {
    this.initData();
  },

  methods: {
    initData() {
      this.form.currency="CNY";
    },
    // 取消按钮
    cancel() {
      this.reset();
      this.$emit("on-cancel");
    },
    // 表单重置
    reset() {
      this.form = {
        id: null,
        accCode: null,
        siteCode: null,
        selSiteCodeStr:'',
        selSiteNameStr:'',
        centerCode: null,
        curMoney: null,
        frozenMoney: null,
        confirmMoney: null,
        watchMoney: null,
        closeMoney: null,
        earnestMoney: null,
        currency: null,
        startDate: null,
        blOpen: null,
        blLock: null,
        blClear: null,
        clearSiteCode: null,
        clearDate: null,
        clearManCode: null,
        remark: null,
        delFlag: null,
        createBy: null,
        createTime: null,
        updateBy: null,
        updateTime: null,
        createSite: null,
        updateSite: null
      };
      this.resetForm("form");
    },

     // 选择网点
   async handleSelectSite(){

      // 获取已经开户的网点
      const res=await getHasAddSite();
      this.form.selSiteCodeStr=res.data;

      this.resetRefreshId='siteTree-'+getUUID();
      this.isAddSite=true;
      this.titleSiteSelectTreeForm='选择网点';
      this.openSiteSelectTreeForm=true;
    },
    onSelectSiteTreeCheckChange(item){
        this.openSiteSelectTreeForm=false;
        this.form.selSiteNameStr=item.selectSiteNameStr;
        this.form.selSiteCodeStr=item.selectSiteCodeStr;
        console.log(item)
    },
    onCancelSelectSiteTreeForm(){
      this.openSiteSelectTreeForm=false;
    },
    /** 提交按钮 */
    submitForm() {
      this.$refs["form"].validate(valid => {
        if (valid) {
          if(this.form.selSiteCodeStr){
            // 批量开户
            this.form.siteCode=this.form.selSiteCodeStr;
            batchAddEmisSiteAccount(this.form).then(response => {
                  this.$modal.msgSuccess("开户成功");
                  this.$emit("on-changed");
            });
          }
        }
      });
    },

  }
};
</script>