cuixq 3 年 前
コミット
0566158a29
1 ファイル変更729 行追加0 行削除
  1. 729 0
      front-vue/src/views/system/accInf/accInf.vue

+ 729 - 0
front-vue/src/views/system/accInf/accInf.vue

@@ -0,0 +1,729 @@
+<template>
+  <div class="app-container zap-main">
+    <el-row class="zap-table-search">
+      <div class="zap-padding-end">
+        <right-toolbar
+          class="zap-right-toolbar"
+          :showSearch.sync="showSearch"
+          @queryTable="getList"
+          >收起</right-toolbar
+        >
+        <span class="zap-padding-start zap-font-title">所选条件:</span>
+        <div style="float: right; margin-right: 1%">
+          <el-button type="cyan" icon="el-icon-search" @click="handleQuery"
+            >搜索</el-button
+          >
+          <el-button icon="el-icon-refresh" @click="resetQuery" style="float: "
+            >重置</el-button
+          >
+        </div>
+      </div>
+      <hr style="margin-top: 16px" />
+      <el-form
+        :model="queryParams"
+        ref="queryForm"
+        :inline="true"
+        v-show="showSearch"
+        label-width="100px"
+      >
+        <el-form-item label="账户卡号" prop="paiAccno" size="large">
+          <el-input
+            v-model="queryParams.paiAccno"
+            placeholder="请输入账户卡号"
+            clearable
+            @keyup.enter.native="handleQuery"
+            maxlength="15"
+          />
+        </el-form-item>
+      </el-form>
+    </el-row>
+    <div class="zap-content zap-margin-top">
+      <el-button
+        type="primary"
+        icon="el-icon-plus"
+        @click="handleAdd"
+        v-hasPermi="['accInf:accInf:add']"
+        >添加对公账户</el-button
+      >
+    </div>
+
+    <el-table
+      class="zap-table"
+      v-loading="loading"
+      :data="accList"
+      @selection-change="handleSelectionChange"
+      stripe
+    >
+      <el-table-column label="序号" type="index" width="55" align="center" />
+      <el-table-column label="开户行" align="center" prop="paiBankName" />
+      <el-table-column
+        label="账户类型"
+        :formatter="formulaFormat"
+        align="center"
+        prop="paiAcctype"
+      />
+      <el-table-column label="账户卡号" align="center" prop="paiAccno" />
+      <el-table-column
+        label="账户状态"
+        :formatter="formulaFormatSend"
+        align="center"
+        prop="paiStatus"
+      />
+      <el-table-column
+        label="操作"
+        align="center"
+        class-name="small-padding fixed-width"
+      >
+        <template slot-scope="scope">
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-edit"
+            @click="handleUpdate(scope.row)"
+            v-hasPermi="['accInf:accInf:edit']"
+            v-if="scope.row.paiAcctype == '00' || scope.row.paiAcctype == '01'"
+            >修改</el-button
+          >
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-delete"
+            @click="handleDelete(scope.row)"
+            v-hasPermi="['accInf:accInf:delete']"
+            v-if="scope.row.paiAcctype == '01'"
+            >删除</el-button
+          >
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-withdrawal"
+            @click="handleWithdrawal(scope.row)"
+            v-if="
+              scope.row.paiAcctype == '06' ||
+              scope.row.paiAcctype == '07' ||
+              scope.row.paiAcctype == '08'
+            "
+            >提现</el-button
+          >
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-recharge"
+            @click="handleRecharge(scope.row)"
+            v-if="
+              scope.row.paiAcctype == '06' ||
+              scope.row.paiAcctype == '07' ||
+              scope.row.paiAcctype == '08'
+            "
+            >充值</el-button
+          >
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <pagination
+      v-show="total > 0"
+      :total="total"
+      :page.sync="queryParams.pageNum"
+      :limit.sync="queryParams.pageSize"
+      @pagination="getList"
+    />
+
+    <!-- 添加对公账户 -->
+    <el-dialog :title="title" :visible.sync="open" width="800px" append-to-body>
+      <el-form
+        ref="form"
+        :model="form"
+        :rules="rules"
+        label-width="120px"
+        :inline="true"
+      >
+        <el-form-item prop="smiType" label="开户银行" size="large">
+          <el-select
+            @change="changePayer"
+            v-model="form.paiBankName"
+            filterable
+            clearable
+            remote
+            reserve-keyword
+            placeholder="请选择开户银行"
+            :remote-method="getBankList"
+          >
+            <el-option
+              v-for="(item, index) in bankList"
+              :key="index"
+              :label="item.zcbiBankName"
+              :value="item.zcbiBankName"
+            >
+            </el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="分支行" prop="paiQlbankname" size="large">
+          <el-input
+            v-model="form.paiQlbankname"
+            clearable
+            style="width: 215px"
+            placeholder="请输入分支行"
+            maxlength="15"
+          />
+        </el-form-item>
+        <el-form-item label="账户名称" prop="scySocialCode" size="large">
+          <el-input
+            v-model="form.paiAccnoName"
+            disabled
+            clearable
+            style="width: 215px"
+            placeholder="请输入账户名称"
+            maxlength="18"
+          />
+        </el-form-item>
+        <el-form-item label="账户卡号" prop="paiAccno" size="large">
+          <el-input
+            v-model="form.paiAccno"
+            clearable
+            style="width: 215px"
+            placeholder="请输入账户卡号"
+            maxlength="22"
+          />
+        </el-form-item>
+      </el-form>
+      <el-row style="height: 109px" type="flex" align="middle" justify="center">
+        <el-button type="primary" plain @click="cancel">取 消</el-button>
+        <el-button type="primary" @click="submitForm">确 定</el-button>
+      </el-row>
+    </el-dialog>
+    <!-- 修改对公账户 -->
+    <el-dialog :title="title" :visible.sync="edit" width="800px" append-to-body>
+      <el-form
+        ref="form"
+        :model="form"
+        :rules="rules"
+        label-width="120px"
+        :inline="true"
+      >
+        <el-form-item prop="smiType" label="开户银行" size="large">
+          <el-select
+            @change="changePayer"
+            v-model="form.paiBankName"
+            :disabled="disableds"
+            filterable
+            clearable
+            remote
+            reserve-keyword
+            placeholder="请选择开户银行"
+            :remote-method="getBankList"
+          >
+            <el-option
+              v-for="(item, index) in bankList"
+              :key="index"
+              :label="item.zcbiBankName"
+              :value="item.zcbiBankName"
+            >
+            </el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="分支行" prop="paiQlbankname" size="large">
+          <el-input
+            v-model="form.paiQlbankname"
+            clearable
+            style="width: 215px"
+            placeholder="请输入分支行"
+            maxlength="15"
+          />
+        </el-form-item>
+        <el-form-item label="账户名称" prop="paiAccnoName" size="large">
+          <el-input
+            v-model="form.paiAccnoName"
+            disabled
+            clearable
+            style="width: 215px"
+            placeholder="请输入账户名称"
+            maxlength="18"
+          />
+        </el-form-item>
+        <el-form-item label="账户卡号" prop="paiAccno" size="large">
+          <el-input
+            v-model="form.paiAccno"
+            :disabled="disableds"
+            clearable
+            style="width: 215px"
+            placeholder="请输入账户卡号"
+            maxlength="22"
+          />
+        </el-form-item>
+      </el-form>
+      <el-row style="height: 109px" type="flex" align="middle" justify="center">
+        <el-button type="primary" plain @click="cancelEdit">取 消</el-button>
+        <el-button type="primary" @click="submitEdit">确 定</el-button>
+      </el-row>
+    </el-dialog>
+    <!-- 充值页面 -->
+    <el-dialog
+      :title="title"
+      :visible.sync="recharge"
+      width="800px"
+      append-to-body
+    >
+      <el-form
+        ref="form"
+        :model="form"
+        :rules="rules"
+        label-width="120px"
+        :inline="true"
+      >
+        <el-row type="flex" align="middle" class="zap-title"
+          ><span class="zap-title__prefix"></span
+          >复制以下信息,去银行客户端转账</el-row
+        >
+        <el-form-item label="开户银行" prop="paiBankName" size="large">
+          <el-input
+            v-model="form.paiBankName"
+            style="width: 215px"
+            placeholder="请输入开户银行"
+            maxlength="15"
+          />
+        </el-form-item>
+        <el-form-item label="分支行" prop="paiQlbankname" size="large">
+          <el-input
+            v-model="form.paiQlbankname"
+            clearable
+            style="width: 215px"
+            placeholder="请输入分支行"
+            maxlength="15"
+          />
+        </el-form-item>
+        <el-form-item label="账户名称" prop="paiAccnoName" size="large">
+          <el-input
+            v-model="form.paiAccnoName"
+            clearable
+            style="width: 215px"
+            placeholder="请输入账户名称"
+            maxlength="18"
+          />
+        </el-form-item>
+        <el-form-item label="账户卡号" prop="paiAccno" size="large">
+          <el-input
+            v-model="form.paiAccno"
+            clearable
+            style="width: 215px"
+            placeholder="请输入账户卡号"
+            maxlength="15"
+          />
+        </el-form-item>
+      </el-form>
+      <el-row style="height: 109px" type="flex" align="middle" justify="center">
+        <el-button type="primary" plain @click="cancelRecharge"
+          >确 认</el-button
+        >
+      </el-row>
+    </el-dialog>
+    <!-- 提现页面 -->
+    <el-dialog
+      :title="title"
+      :visible.sync="withdrawal"
+      width="800px"
+      append-to-body
+    >
+      <el-form
+        ref="form"
+        :model="form"
+        :rules="rules"
+        label-width="120px"
+        :inline="true"
+      >
+        <el-form-item label="账户卡号" prop="paiAccno" size="large">
+      <el-select
+            v-model="form.paiAccno"
+            :disabled="disableds"
+            filterable
+            clearable
+            remote
+            reserve-keyword
+            placeholder="请选择账户卡号"
+          >
+            <el-option
+              v-for="(item, index) in cardList"
+              :key="index"
+              :label="item.paiAccno"
+              :value="item.paiAccno"
+            >
+            </el-option>
+          </el-select>
+        </el-form-item>
+        <el-button
+          type="primary"
+          icon="el-icon-plus"
+          @click="handleAdd"
+          v-hasPermi="['accInf:accInf:add']"
+          >添加对公账户</el-button
+        >
+        <el-form-item label="开户银行" prop="paiBankName" size="large">
+          <el-input
+            v-model="form.paiBankName"
+            disabled
+            clearable
+            style="width: 215px"
+            placeholder="请输入开户银行"
+            maxlength="15"
+          />
+        </el-form-item>
+        <el-form-item label="分支行" prop="paiQlbankname" size="large">
+          <el-input
+            v-model="form.paiQlbankname"
+            disabled
+            clearable
+            style="width: 215px"
+            placeholder="请输入分支行"
+            maxlength="15"
+          />
+        </el-form-item>
+        <el-form-item label="账户名称" prop="paiAccnoName" size="large">
+          <el-input
+            v-model="form.paiAccnoName"
+            disabled
+            clearable
+            style="width: 215px"
+            placeholder="请输入账户名称"
+            maxlength="18"
+          />
+        </el-form-item>
+        <el-form-item label="提现金额" prop="amount" size="large">
+          <el-input
+            v-model="form.amount"
+            clearable
+            style="width: 215px"
+            placeholder="请输入提现金额"
+            maxlength="18"
+          />
+        </el-form-item>
+        <el-button type="primary" plain>全部提现</el-button>
+        <el-row type="flex" align="middle" class="zap-title"
+          ><span class="zap-title__prefix"></span>可提现金额:999,999,999</el-row
+        >
+      </el-form>
+      <el-row style="height: 109px" type="flex" align="middle" justify="center">
+        <el-button type="primary" plain @click="cancelWithdrawal"
+          >确 认</el-button
+        >
+      </el-row>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import {
+  listAcc,
+  addAcc,
+  updateAcc,
+  delAcc,
+  listBank,
+  detailsAcc,
+  listCard
+} from "@/api/system/accInf";
+
+export default {
+  name: "accInf",
+  data() {
+    return {
+      // id隐藏
+      isShow: false,
+      // 遮罩层
+      loading: true,
+      // 选中数组
+      ids: [],
+      // 非单个禁用
+      single: true,
+      // 非多个禁用
+      multiple: true,
+      // 显示搜索条件
+      showSearch: true,
+      //联系人隐藏
+      disabled: false,
+      disableds: false,
+      // 总条数
+      total: 0,
+      // 账户表格数据
+      accList: [],
+      //姓名
+      nameList: [],
+      bankList: [],
+      //字典
+      formulaOptions: [],
+      formulaOptionsSend: [],
+      UserList: [],
+      enclosureList: [],
+      sfzList: [],
+      // 弹出层标题
+      title: "",
+      // 是否显示弹出层
+      open: false,
+      // 是否显示弹出层
+      edit: false,
+      // 是否显示弹出层
+      recharge: false,
+      // 是否显示弹出层
+      withdrawal: false,
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        scyName: null,
+        smiType: null,
+        smiManager: null,
+        smiContract: null,
+        smiContractPhone: null,
+        sfsContent: null,
+        sfsIsDel: null,
+        sfsRemark: null,
+        ssId: null,
+        ssName: null,
+      },
+      // 表单参数
+      form: {},
+      // 表单校验
+      rules: {
+        paiBankName: [
+          {
+            required: true,
+            message: "开户银行不能为空",
+            trigger: ["change", "blur"],
+          },
+        ],
+        paiQlbankname: [
+          {
+            required: true,
+            message: "分支行不能为空",
+            trigger: ["change", "blur"],
+          },
+        ],
+        paiAccno: [
+          {
+            required: true,
+            message: "银行卡号不能为空",
+            trigger: ["change", "blur"],
+          },
+        ],
+      },
+    };
+  },
+  created() {
+    this.getList();
+    this.getBankList();
+    this.getDicts("pay_pai_acctype").then((response) => {
+      this.formulaOptions = response.data;
+    });
+    this.getDicts("pay_pai_status").then((response) => {
+      this.formulaOptionsSend = response.data;
+    });
+  },
+  methods: {
+    //切换账款类型
+    changePayer(value) {
+      if (value) {
+        this.$set(this.form, "paiQlbankname", value);
+      }
+    },
+    /** 查询账户列表 */
+    getList() {
+      this.loading = true;
+      listAcc(this.queryParams).then((response) => {
+        this.accList = response.data.records;
+        this.total = response.data.total;
+        this.loading = false;
+      });
+    },
+    // 取消按钮
+    cancel() {
+      this.open = false;
+    },
+    // 修改取消按钮
+    cancelEdit() {
+      this.edit = false;
+      this.reset();
+    },
+    // 充值取消按钮
+    cancelRecharge() {
+      this.recharge = false;
+      this.reset();
+    },
+    // 提现取消按钮
+    cancelWithdrawal() {
+      this.withdrawal = false;
+      this.reset();
+    },
+    // 表单重置
+    reset() {
+      this.form = {
+        scyId: null,
+        scyName: null,
+        smiType: null,
+        smiManager: null,
+        smiContract: null,
+        smiContractPhone: null,
+        sfsContent: null,
+        sfsIsDel: null,
+        createBy: null,
+        createTime: null,
+        updateBy: null,
+        updateTime: null,
+        sfsRemark: null,
+        ssId: null,
+        ssName: null,
+      };
+      this.noneBtnImg = false;
+      this.enclosureList = [];
+      this.sfzList = [];
+      this.resetForm("form");
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNum = 1;
+      this.getList();
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.resetForm("queryForm");
+      this.handleQuery();
+    },
+    // 多选框选中数据
+    handleSelectionChange(selection) {
+      this.ids = selection.map((item) => item.scyId);
+      this.single = selection.length !== 1;
+      this.multiple = !selection.length;
+    },
+    //资方类型
+    formulaFormat(row, column) {
+      return this.selectDictLabel(this.formulaOptions, row.paiAcctype);
+    },
+    //奖项
+    formulaFormatSend(row, column) {
+      return this.selectDictLabel(this.formulaOptionsSend, row.paiStatus);
+    },
+    //查询银行名称
+    getBankList(paiBankName) {
+      this.queryParams.paiBankName = paiBankName;
+      listBank(this.queryParams).then((response) => {
+        this.bankList = response.data.records;
+      });
+    },
+    /** 新增按钮操作 */
+    handleAdd() {
+      this.reset();
+      this.open = true;
+      detailsAcc().then((response) => {
+        console.log(response);
+        this.$set(this.form, "paiAccnoName", response.data.company);
+      });
+      this.title = "添加对公账户";
+    },
+    /** 修改按钮操作 */
+    handleUpdate(row) {
+      this.reset();
+      const paiId = row.paiId || this.ids;
+      detailsAcc(paiId).then((response) => {
+        this.form = response.data.sccInf[0];
+        this.edit = true;
+        if (response.data.sccInf[0].paiAcctype == "00") {
+          this.disableds = true;
+        }else{
+          this.disableds = false;
+        }
+        this.title = "修改对公账户";
+      });
+    },
+    /** 充值按钮操作 */
+    handleRecharge(row) {
+      this.reset();
+      const paiId = row.paiId || this.ids;
+      detailsAcc(paiId).then((response) => {
+        console.log(response.data);
+        this.form = response.data.sccInf[0];
+        this.recharge = true;
+        this.title = "充值转账";
+      });
+    },
+    /** 提现按钮操作 */
+    handleWithdrawal(row) {
+      this.reset();
+     listCard().then((response) => {
+         console.log(response)
+        this.cardList = response.data.records;
+      });
+      const paiId = row.paiId || this.ids;
+      detailsAcc(paiId).then((response) => {
+        this.form = response.data.sccInf[0];
+        this.withdrawal = true;
+        this.title = "提现";
+      });
+    },
+    /** 新增提交按钮 */
+    submitForm() {
+      this.$refs["form"].validate((valid) => {
+        console.log(this.form);
+        if (valid) {
+          const loading = this.$loading({
+            lock: true,
+            text: "Loading",
+            spinner: "el-icon-loading",
+            background: "rgba(0, 0, 0, 0.7)",
+          });
+          addAcc(this.form)
+            .then((response) => {
+              loading.close();
+              this.msgSuccess("新增成功");
+              this.open = false;
+              this.getList();
+            })
+            .catch((response) => {
+              loading.close();
+            });
+        }
+      });
+    },
+    /** 提交按钮 */
+    submitEdit() {
+      this.$refs["form"].validate((valid) => {
+        if (valid) {
+          const loading = this.$loading({
+            lock: true,
+            text: "Loading",
+            spinner: "el-icon-loading",
+            background: "rgba(0, 0, 0, 0.7)",
+          });
+          updateAcc(this.form)
+            .then((response) => {
+              loading.close();
+              this.msgSuccess("修改成功");
+              this.edit = false;
+              this.getList();
+            })
+            .catch((response) => {
+              loading.close();
+            });
+        }
+      });
+    },
+    /** 删除按钮操作 */
+    handleDelete(row) {
+      const paiId = row.paiId || this.ids;
+      const paiAccno = row.paiAccno;
+      this.$confirm(
+        '是否确认删除账户卡号为"' + paiAccno + '"的数据项?',
+        "警告",
+        {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning",
+        }
+      )
+        .then(function () {
+          return delAcc(paiId);
+        })
+        .then(() => {
+          this.getList();
+          this.msgSuccess("删除成功");
+        });
+    },
+  },
+};
+</script>