Infsea.vue

<template>
  <div class="eibs-tab">

    <c-col :span="12" class="col-left">
      <c-col :span="24">
        <el-form-item label="交易代码" prop="cod">
          <c-input v-model="model.cod" placeholder="请输入交易代码" style="width: 100%" />
        </el-form-item>
      </c-col>
    </c-col>
    <!------------- 右 ---------->
    <c-col :span="12" class="col-right">
      <c-col :span="24">
        <el-form-item label="所属业务品种" prop="bus">
          <c-select v-model="model.bus" style="width:100%" placeholder="请选择所属业务品种" dbCode="BUSTXT" />
        </el-form-item>
      </c-col>
    </c-col>

    <c-col :span="24">
      <c-col :span="12" style="text-align: left">
        <el-button type="primary" size="small" @click="Add()">新增</el-button>
      </c-col>
      <c-col :span="12" style="text-align: right">
        <el-button size="small" @click="handleReset">重置</el-button>
        <el-button type="primary" icon="el-icon-search" size="small" :loading="searchLoading" @click="onSearch()">查询
        </el-button>
      </c-col>
    </c-col>
    <c-col :span="24">
      <c-paging-table :data="atpData" :columns="atpColumns" :pageNumber="model.pageNum" :pageSize="model.pageSize"
        :total="model.total" v-on:queryFunc="queryFunc" :border="true">
        <c-table-column fixed="right" prop="op" label="操作" width="240px">
          <template slot-scope="{ scope }">
            <c-button style="margin-left: 0" size="small" type="info" @click="atpInfo(scope.row)">详情</c-button>
            <c-button style="margin-left: 5px" size="small" type="primary" @click="Edit(scope.row)">修改</c-button>
            <c-button size="small" style="margin-left: 5px" type="danger" @click="atpDelete(scope.row)">删除</c-button>
          </template>
        </c-table-column>
      </c-paging-table>
    </c-col>
    <c-col>
      <el-dialog :title="dialogNam[atpTyp]" :visible.sync="dialog" center>
        <c-col>
          <el-form ref="form" :model="form" label-suffix="：" :rules="rules" :disabled="isDisabled">
            <c-col :span="12" style="padding-right: 20px;">
              <c-col :span="20">
                <el-form-item label="交易代码" prop="cod" :label-width="formLabelWidth">
                  <c-input v-model="form.cod" placeholder="请输入交易代码" style="width: 100%" :disabled="atpTyp == 'edit'" />
                </el-form-item>
                <br />
              </c-col>
              <c-col :span="20">
                <el-form-item label="所属业务品种" prop="bus" :label-width="'120px'">
                  <c-select v-model="form.bus" style="width:100%" placeholder="请选择所属业务品种" dbCode="BUSTXT"
                    :disabled="atpTyp == 'edit'" />
                </el-form-item>
                <br />
              </c-col>
              <c-col :span="20">
                <el-form-item label="授权方式" prop="reltyp" :label-width="formLabelWidth">
                  <c-select style="width: 100%" v-model="form.reltyp" placeholder="请选择授权方式" dbCode="RELTYP"
                    @change="onChangeToNull" />
                </el-form-item>
                <br />
              </c-col>
              <c-col :span="20">
                <el-form-item label="处理时间" prop="dealtim" :label-width="formLabelWidth">
                  <c-input v-model="form.dealtim" placeholder="请输入处理时间" style="width: 100%" />
                </el-form-item>
                <br />
              </c-col>
              <c-col :span="20">
                <el-form-item label="所属角色" prop="roleids" :label-width="formLabelWidth">
                  <c-select multiple style="width: 100%" v-model="form.roleids" placeholder="请选择所属角色" dbCode="ROLNAM"/>
                </el-form-item>
                <br />
              </c-col>
              <c-col :span="20">
                <el-form-item label="是否参与任务分配" prop="bustrnflg" :label-width="'150px'">
                  <el-radio v-model="form.bustrnflg" label="X">是</el-radio>
                  <el-radio v-model="form.bustrnflg" label="">否</el-radio>
                </el-form-item>
                <br />
              </c-col>
              <c-col :span="20">
                <el-form-item label="能否创建新业务" prop="concreflg" :label-width="'120px'">
                  <el-radio v-model="form.concreflg" label="X">是</el-radio>
                  <el-radio v-model="form.concreflg" label="">否</el-radio>
                </el-form-item>
                <br />
              </c-col>
              <c-col :span="20">
                <el-form-item label="能否临时结算" prop="sepflg" :label-width="'120px'">
                  <el-radio v-model="form.sepflg" label="X">是</el-radio>
                  <el-radio v-model="form.sepflg" label="">否</el-radio>
                </el-form-item>
                <br />
              </c-col>
              <c-col :span="20">
                <el-form-item label="是否需要历史数据" prop="dtaflg" :label-width="'150px'">
                  <el-radio v-model="form.dtaflg" label="X">是</el-radio>
                  <el-radio v-model="form.dtaflg" label="">否</el-radio>
                </el-form-item>
              </c-col>
            </c-col>
            <c-col :span="12" style="padding-left: 20px;">
              <c-col :span="20">
                <el-form-item label="交易名称" prop="codnam" :label-width="'120px'">
                  <c-input v-model="form.codnam" placeholder="请输入交易名称" style="width: 100%"
                    :disabled="atpTyp == 'edit'" />
                </el-form-item>
                <br />
              </c-col>
              <c-col :span="20">
                <el-form-item label="关联业务表" prop="lnkobj" :label-width="'120px'">
                  <c-input v-model="form.lnkobj" placeholder="请输入关联业务表" style="width: 100%"
                    :disabled="atpTyp == 'edit'" />
                </el-form-item>
                <br />
              </c-col>
              <c-col :span="20">
                <el-form-item label="授权金额类型" prop="relamt" :label-width="'120px'">
                  <c-select style="width: 100%" v-model="form.relamt" placeholder="请选择授权金额类型" dbCode="RELAMT"
                    :disabled="form.reltyp != '2'" />
                </el-form-item>
                <br />
              </c-col>
              <c-col :span="20">
                <el-form-item label="完备性检查" prop="ccstyp" :label-width="formLabelWidth">
                  <c-select style="width: 100%" v-model="form.ccstyp" placeholder="请选择完备性检查" dbCode="COSTYP" />
                </el-form-item>
                <br />
              </c-col>
              <c-col :span="20">
                <el-form-item label="交易发起端" prop="negflg" :label-width="formLabelWidth">
                  <c-select style="width: 100%" v-model="form.negflg" placeholder="请选择交易发起端">
                    <el-option v-for="item in negflg" :key="item.value" :label="item.label" :value="item.value" />
                  </c-select>
                </el-form-item>
                <br />
              </c-col>
              <c-col :span="20">
                <el-form-item label="能否创建子业务" prop="subflg" :label-width="'120px'">
                  <el-radio v-model="form.subflg" label="X">是</el-radio>
                  <el-radio v-model="form.subflg" label="">否</el-radio>
                </el-form-item>
                <br />
              </c-col>
              <c-col :span="20">
                <el-form-item label="能否处理来报" prop="rouflg" :label-width="'120px'">
                  <el-radio v-model="form.rouflg" label="X">是</el-radio>
                  <el-radio v-model="form.rouflg" label="">否</el-radio>
                </el-form-item>
                <br />
              </c-col>
              <c-col :span="20">
                <el-form-item label="能否后台运行" prop="jobflg" :label-width="'120px'">
                  <el-radio v-model="form.jobflg" label="X">是</el-radio>
                  <el-radio v-model="form.jobflg" label="">否</el-radio>
                </el-form-item>
                <br />
              </c-col>
            </c-col>
          </el-form>
        </c-col>
        <span slot="footer" class="model-footer">
          <c-button type="primary" @click="atpAdd" v-if="atpTyp =='add'">确 定</c-button>
          <c-button type="primary" @click="atpEdit" v-if="atpTyp =='edit'">确 定</c-button>
          <c-button @click="dialog = false" v-if="atpTyp !='info'">取 消</c-button>
          <c-button @click="dialog = false" v-if="atpTyp =='info'">返 回</c-button>
        </span>
      </el-dialog>
    </c-col>
  </div>
</template>

<script>
  import Utils from "~/utils";
  import Atp, {
    Pattern
  } from "./Atp.js";
  import CodeTable from "~/config/CodeTable";

  import {
    queryByPage,
    queryCod,
    queryById,
    add,
    edit,
    deleteById
  } from "~/service/manage/atp.js";

  export default {
    name: "",
    props: ["model"],
    inject: ["root"],
    data() {
      return {
        negflg: [{
            label: '收单行登记',
            value: 'X'
          },
          {
            label: '收单行经办',
            value: 'Y'
          },
          {
            label: '押汇中心代做',
            value: 'Z'
          },
        ],
        rules: Pattern,
        atpData: [],
        atpColumns: [{
            label: '所属业务品种',
            prop: 'bus',
            width: 'auto'
          },
          {
            label: '关联业务表',
            prop: 'lnkobj',
            width: 'auto'
          },
          {
            label: '交易代码',
            prop: 'cod',
            width: 'auto'
          },
          {
            label: '交易名称',
            prop: 'codnam',
            width: 'auto'
          },
          {
            label: '授权方式',
            prop: 'reltyp',
            width: 'auto'
          },
          {
            label: '授权金额类型',
            prop: 'relamt',
            width: '160'
          },
          {
            label: '是否参与任务分配',
            prop: 'bustrnflg',
            width: '160'
          },
        ],
        dialogNam: {
          'add': '交易信息新增',
          'edit': '交易信息修改',
          'info': '交易信息详情'
        },
        dialog: false,
        form: new Atp().data,
        atpTyp: "",
        isDisabled: false,
        formLabelWidth: "100px",
        searchLoading: false
      };
    },
    created() {
      this.onDblatpSearch()
    },
    computed: {},
    activated() {
      const {
        update
      } = this.$route.params
      if (update) {
        this.onDblatpSearch()
      }
    },
    methods: {
      onChangeToNull() {
        this.form.relamt = "";
      },
      handleReset() {
        this.root.$refs.modelForm.resetFields();
      },
      onSearch() {
        this.model.pageSize = PageSize;
        this.model.pageNum = 1;
        this.onDblatpSearch();
      },
      onDblatpSearch() {
        this.searchLoading = true;
        queryByPage(this.model).then(res => {
          if (res.respCode == SUCCESS) {
            const list = res.data.list
            this.atpData = list
            this.model.pageNum = res.data.pageNumber
            this.model.pageSize = res.data.pageSize
            this.model.total = res.data.total
            this.searchLoading = false;
          } else {
            this.searchLoading = false;
            this.$notify.error("查询失败");
          }
        })
      },
      queryFunc(pageNumber, pageSize) {
        this.model.pageNum = pageNumber
        this.model.pageSize = pageSize
        this.onDblatpSearch()
      },
      atptypeChange(val) {
        this.model.fectyp = val;
      },
      atpCodesByKey(key) {
        return codes[key] || [];
      },
      atpAdd() {
        this.$refs.form.validate((validated) => {
          if (validated) {
            queryCod(this.form).then((res) => {
              if (!res.data) {
                add(this.form).then((res) => {
                  this.$notify.success("新增记录成功！");
                  this.dialog = false;
                  this.onSearch();
                }).catch((err) => {
                  this.$notify.error("新增记录失败！");
                });
              } else {
                return this.$notify.error("交易信息代码重复！")
              }
            })
          }
        })
      },
      atpEdit() {
        this.$refs.form.validate((validated) => {
          if (validated) {
            edit(this.form)
              .then((res) => {
                this.$notify.success("修改记录成功！");
                this.dialog = false;
                this.onSearch();
              })
              .catch((err) => {
                this.$notify.error("修改记录失败！");
              });
          }
        })
      },
      //查看弹窗
      atpInfo(row) {
        queryById(row)
          .then((res) => {
            this.isDisabled = true;
            this.form = res.data;
            this.atpTyp = "info";
            this.dialog = true;
          })
          .catch((err) => {
            this.$notify.error("数据查询失败");
          });
      },
      Edit(row) {
        queryById(row)
          .then((res) => {
            this.isDisabled = false;
            this.form = res.data;
            this.atpTyp = "edit";
            this.dialog = true;
          })
          .catch((err) => {
            this.$notify.error("数据查看失败");
          });
      },
      Add() {
        this.isDisabled = false;
        this.atpTyp = "add";
        this.dialog = true;
        this.form = new Atp().data;
      },
      atpDelete(row) {
        this.$confirm("确认删除该记录?", "提示", {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning",
          })
          .then(() => {
            deleteById(row)
              .then((res) => {
                this.$notify.success("删除成功！");
                this.onSearch()
              })
              .catch((err) => {
                this.$notify.error("删除失败！");
              });
          })
          .catch(() => {
            this.$message({
              type: "info",
              message: "已取消删除",
            });
          });
      },
      getCodesByKey(key) {
        return CodeTable[key] || [];
      },
    },
  };
</script>

<style scoped>
  .table-button-item-list {
    padding: 0;
    margin: 0;
  }

  .table-button-item-list li {
    list-style: none;
    padding: 5px 0;
    text-align: center;
    color: #606266;
    cursor: pointer;
  }
</style>