rule.vue

<template>
  <div>
    <el-row>
      <el-col :span="24">
        <c-button @click="handleAdd" :disabled="!model.signinfo.scenecode" class="medium_bcs" size="medium" style="margin-left: 0" type="primary">增加规则
        </c-button>
      </el-col>
    </el-row>
		<c-col :span="24">
			<el-table max-height="400px" :data="model.ruleList" :columns="stmData.columns" :showButtonFlg="true" :highlight-current-row="true" @selection-change="handleSelectionChange">
				<el-table-column :selectable="selectableFn" type="selection" width="55">
				</el-table-column>
				<el-table-column v-for="(item, key) in stmData.columns" :key="key" :label="item.label" :prop="item.prop" :min-width="item.width"></el-table-column>
				<el-table-column>
					<template slot-scope="scope">
						<c-button v-if="scope.row.isdefault == '0'" style="margin-right: 7px" size="small" type="primary" @click="handleEdit(scope.row)">编辑
						</c-button>
						<c-button v-if="scope.row.isdefault == '0'" style="margin-left: 0px" size="small" @click="handleDelete(scope.row)" slot="reference">删除
						</c-button>
					</template>
				</el-table-column>
			</el-table>
			<div class="pagination-box">
				<el-pagination style="margin-right: 30px;" @size-change="ruleHandleSizeChange" @current-change="ruleHandleCurrentChange" :current-page.sync="model.rulePagination.pageIndex" :page-sizes="[10, 20, 50, 100, 500]" :page-size="model.rulePagination.pageSize" layout="total, sizes, prev, pager, next, jumper" :total="model.rulePagination.total">
				</el-pagination>
			</div>
		</c-col>
    <el-dialog v-if="ruledialog" :visible.sync="ruledialog" :title="ruleTitle" append-to-body width="60%">
      <el-form ref="addForm" :rules="ruleRules" :model="model" :validate-on-rule-change="false" label-width="95px">
        <c-content>
          <m-addrule :model="model" :codes="codes" />
        </c-content>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button type="primary" @click="saveRule">保存</el-button>
        <el-button type="text" @click="closeDialog">取消</el-button>
      </span>
    </el-dialog>
  </div>
</template>
<script>
import event from "../event";
import moment from "moment";
import Api from "~/service/Api";
import Auasig from "../model";
import MessageView from "~/components/business/docpan/views/MessageView";
import Addrule from "./addrule";
import CheckRule from "../model/checkrule";
import commonFunctions from '~/mixin/commonFunctions.js';
export default {
  inject: ["root"],
  props: ["model", "codes"],
  mixins: [event, commonFunctions],
  components: {
    MessageView,
    "m-addrule": Addrule
  },
  data() {
    return {
      curinr: "",
      ownref: "",
      handleModel: {},
      trnUrl: "",
      inifrm: "",
      bchShow: false,
			ruledialog: false,
			ruleTitle: '新增',
			editType: 'add',
      bchList: [],
      stmData: {
        columns: [
          {
            label: "规则字段",
            prop: "rulekey",
            width: "180px"
          },
          {
            label: "规则对比内容",
            prop: "content",
            width: "150px"
          },
          {
            label: "规则字段描述",
            prop: "kettxt",
            width: "150px"
          },
          {
            label: "规则",
            prop: "symbols",
            width: "150px"
          }
        ],
        data: []
      },
      handlerDataList: [],
      currentHandleRow: {},
      multipleSelection: [],
      multipleSelectionObj: [],
      multipleStatusSelection: [],
      multipleSelectionRow: {},
    };
  },
  created() {
    this.handleSearch();
  },
  methods: {
    handleAdd() {
      this.clearRuleDialogData();
      this.model.signrule.cur = this.model.signinfo.cur;
      this.ruledialog = true;
			this.ruleTitle = '新增';
			this.editType = 'add'
		},
		handleEdit (row) {
			this.model.signrule.rulekey = row.rulekey
			this.model.signrule.content = row.content
			this.model.signrule.scenecode = row.scenecode
			this.model.signrule.keytyp = row.keytyp
			this.model.signrule.symbols = row.symbols
			this.ruledialog = true;
			this.ruleTitle = '编辑';
			this.editType = 'edit'
		},
		handleDelete(row) {
			this.$confirm("确定删除选中的数据？", "提示", {
        confirmButtonText: "确认",
        cancelButtonText: "取消",
        type: "warning",
      }).then(async () => {
        const loading = this.loading();
        let params = {
          inrs: [row.inr]
        }
        let rtnmsg = await Api.post('/Remittance/autosignrule/delete', params);
        if (rtnmsg.respCode == SUCCESS) {
          this.$notify({ title: '成功', message: '删除成功', type: 'success', duration: 1000 })
          this.ruleHandleSearch();
        } else {
          this.$notify.error({ title: '错误', message: '服务请求失败！' });
        }
        loading.close();
      });
		},
    clearRuleDialogData() {
      Object.keys(this.model.signrule).forEach(
        key => (this.model.signrule[key] = "")
      );
    },
    // 关闭处理弹框
    closeDialog() {
      this.ruledialog = false;
    },
    saveRule() {
      this.$refs["addForm"].validate(async validStatic => {
        if (validStatic) {
					const loading = this.loading();
					let param = {
						inr: this.editType == 'edit' ? this.model.signinfo.inr : null,
						scenecode: this.model.signrule.scenecode,
						isdefault: "0",
						rulekey: this.model.signrule.rulekey,//规则字段
						content: this.model.signrule.content,//规则对比内容
						keytyp: this.model.signrule.keytyp,//规则字段类型
						symbols: this.model.signrule.symbols//规则
					};
					let rtnmsg = await Api.post(`/Remittance/autosignrule/${this.editType}`, param);
					if (rtnmsg.respCode == SUCCESS) {
						this.closeDialog();
						this.clearRuleDialogData()
						this.ruleHandleSearch();
					} else {
						this.$notify.error({ title: '错误', message: '服务请求失败！' });
					}
					loading.close();
        }
      });
    }
  },
  computed: {
    ruleRules() {
      return CheckRule.apply(this);
    }
  },
  mounted() {}
};
</script>
<style>
.pagination-box {
  width: 100%;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding: 0 10px;
  background: #fff;
  margin-top: 5px;
}
.btn-group-wrap {
  max-height: 200px;
  width: 100%;
  overflow-y: auto;
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-wrap: wrap;
}
.btn-item {
  margin-bottom: 10px;
  margin-right: 10px;
}
.medium_bcs {
  border-radius: 5px;
}
</style>