违约规则完善

xiangpei

2024-03-06 69d6b370f8167046ed1e355b9bfb08020a6ef153

违约规则完善

 src/api/platform/default-rule.js

@@ -1,11 +1,11 @@
import request from '@/utils/request'

// 查询违约规则列表
export function listRule(query) {
export function listRule(data) {
  return request({
    url: '/default-rule/page',
    method: 'get',
    params: query
    method: 'post',
    data: data
  })
}

@@ -42,3 +42,12 @@
    method: 'delete'
  })
}

// 启用/停用违约规则
export function setRule(data) {
  return request({
    url: '/default-rule/set',
    method: 'post',
    data: data
  })
}

 src/views/system/default-rule/index.vue

@@ -6,6 +6,7 @@
          v-model="queryParams.ruleName"
          placeholder="请输入规则名称"
          clearable
          @clear="handleQuery"
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
@@ -13,7 +14,7 @@
        <el-date-picker
          v-model="daterangeCreateTime"
          style="width: 240px"
          value-format="yyyy-MM-dd"
          value-format="yyyy-MM-dd HH:mm:ss"
          type="daterange"
          range-separator="-"
          start-placeholder="开始日期"
@@ -74,11 +75,9 @@

    <el-table v-loading="loading" :data="ruleList" @selection-change="handleSelectionChange">
      <el-table-column type="selection" width="55" align="center" />
      <el-table-column label="主键" align="center" prop="id" />
      <el-table-column label="规则名称" align="center" prop="ruleName" />
      <el-table-column label="规则详情JSON" align="center" prop="ruleDetail" />
      <el-table-column label="规则描述" align="center" prop="ruleDesc" />
      <el-table-column label="规则状态：启用、未启用" align="center" prop="ruleStatus" />
      <el-table-column label="规则状态" align="center" prop="ruleStatus" />
      <el-table-column label="创建时间" align="center" prop="createTime" width="180">
        <template slot-scope="scope">
          <span>{{ parseTime(scope.row.createTime, '{y}-{m}-{d}') }}</span>
@@ -86,6 +85,29 @@
      </el-table-column>
      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
        <template slot-scope="scope">
          <el-button
            v-if="scope.row.ruleStatus === '未启用'"
            size="mini"
            type="text"
            icon="el-icon-zoom-in"
            @click="handleUse(scope.row.id, true)"
            v-hasPermi="['system:rule:use']"
          >启用</el-button>
          <el-button
            v-else
            size="mini"
            type="text"
            icon="el-icon-zoom-in"
            @click="handleUse(scope.row.id, false)"
            v-hasPermi="['system:rule:use']"
          >停用</el-button>
          <el-button
            size="mini"
            type="text"
            icon="el-icon-zoom-in"
            @click="handleDetail(scope.row)"
            v-hasPermi="['system:rule:detail']"
          >详情</el-button>
          <el-button
            size="mini"
            type="text"
@@ -112,17 +134,53 @@
      @pagination="getList"
    />

    <!-- 规则详情 -->
    <el-dialog title="规则详情" :visible.sync="detailOpen" width="500px" append-to-body>
      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
        <el-form-item label="规则名称" prop="ruleName">
          <el-input disabled v-model="form.ruleName" placeholder="请输入规则名称" />
        </el-form-item>
        <el-form-item label="规则描述" prop="ruleDesc">
          <el-input disabled v-model="form.ruleDesc" placeholder="请输入规则描述" />
        </el-form-item>
        <el-form-item label="规则设置">
          <div style="margin-top: 30px">
            <div class="line">
              <div class="line-left">工单未及时处理数：</div>
              <div class="line-right"><el-input disabled v-model="jsonRule.overTime" type="number"/></div>
            </div>
            <div class="line">
              <div class="line-left">运维失败数量超过：</div>
              <div class="line-right"><el-input disabled v-model="jsonRule.failNum" type="number"/></div>
            </div>
          </div>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="closeDetail">关闭</el-button>
      </div>
    </el-dialog>

    <!-- 添加或修改违约规则对话框 -->
    <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
        <el-form-item label="规则名称" prop="ruleName">
          <el-input v-model="form.ruleName" placeholder="请输入规则名称" />
        </el-form-item>
        <el-form-item label="规则详情JSON" prop="ruleDetail">
          <el-input v-model="form.ruleDetail" type="textarea" placeholder="请输入内容" />
        </el-form-item>
        <el-form-item label="规则描述" prop="ruleDesc">
          <el-input v-model="form.ruleDesc" placeholder="请输入规则描述" />
        </el-form-item>
        <el-form-item label="规则设置">
          <div style="margin-top: 30px">
            <div class="line">
              <div class="line-left">工单未及时处理数：</div>
              <div class="line-right"><el-input v-model="jsonRule.overTime" type="number"/></div>
            </div>
            <div class="line">
              <div class="line-left">运维失败数量超过：</div>
              <div class="line-right"><el-input v-model="jsonRule.failNum" type="number"/></div>
            </div>
          </div>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
@@ -134,12 +192,13 @@
</template>

<script>
import { listRule, getRule, delRule, addRule, updateRule } from "@/api/platform/default-rule";
import { listRule, getRule, delRule, addRule, updateRule, setRule } from "@/api/platform/default-rule";

export default {
  name: "Rule",
  data() {
    return {
      detailOpen: false,
      // 遮罩层
      loading: true,
      // 选中数组
@@ -170,6 +229,7 @@
      },
      // 表单参数
      form: {},
      jsonRule: {},
      // 表单校验
      rules: {
        ruleName: [
@@ -185,13 +245,12 @@
    /** 查询违约规则列表 */
    getList() {
      this.loading = true;
      this.queryParams.params = {};
      if (null != this.daterangeCreateTime && '' != this.daterangeCreateTime) {
        this.queryParams.params["beginCreateTime"] = this.daterangeCreateTime[0];
        this.queryParams.params["endCreateTime"] = this.daterangeCreateTime[1];
        this.queryParams["start"] = this.daterangeCreateTime[0];
        this.queryParams["end"] = this.daterangeCreateTime[1];
      }
      listRule(this.queryParams).then(response => {
        this.ruleList = response.rows;
        this.ruleList = response.data;
        this.total = response.total;
        this.loading = false;
      });
@@ -244,6 +303,7 @@
      const id = row.id || this.ids
      getRule(id).then(response => {
        this.form = response.data;
        this.jsonRule = JSON.parse(this.form.ruleDetail)
        this.open = true;
        this.title = "修改违约规则";
      });
@@ -252,6 +312,9 @@
    submitForm() {
      this.$refs["form"].validate(valid => {
        if (valid) {
          this.jsonRule.overtime = this.jsonRule.overtime ? this.jsonRule.overtime : 0;
          this.jsonRule.failNum = this.jsonRule.failNum ? this.jsonRule.failNum : 0;
          this.form.ruleDetail = JSON.stringify(this.jsonRule);
          if (this.form.id != null) {
            updateRule(this.form).then(response => {
              this.$modal.msgSuccess("修改成功");
@@ -267,6 +330,33 @@
          }
        }
      });
    },
    // 启用、停用
    handleUse(id, flag) {
      let data = {
        id: id,
        flag: flag
      }
      setRule(data).then(res => {
        if (res.code === 200) {
          this.$modal.msgSuccess("设置成功");
        } else {
          this.$modal.msgError(res.msg);
        }
        this.getList();
      })
    },
    // 详情按钮
    handleDetail(row) {
      this.detailOpen = true;
      this.form = row;
      this.jsonRule = JSON.parse(this.form.ruleDetail);
    },
    // 关闭详情
    closeDetail() {
      this.jsonRule = {};
      this.form = {};
      this.detailOpen = false;
    },
    /** 删除按钮操作 */
    handleDelete(row) {
@@ -287,3 +377,19 @@
  }
};
</script>

<style scoped>
.line {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
}
.line-left {
  width: 200px;
  text-align: center;
}
.line-right {
  width: 100px;
}
</style>