xiangpei
2025-03-20 74cb17043657b943336541df2b8fc048d7f7b71f
Merge branch 'dev'
2个文件已添加
558 ■■■■■ 已修改文件
src/api/codingRuler/codingRuler.js 68 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/views/codingRuler/index.vue 490 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/api/codingRuler/codingRuler.js
New file
@@ -0,0 +1,68 @@
import request from '@/utils/request'
// 获取分页
export const getCodingRulers = (params) => {
    return request({
        url: "/coding-ruler/page",
        method: "GET",
        params: params
    })
}
// 获取列表
export const getCodingRulerList = () => {
    return request({
        url: "/coding-ruler/list",
        method: "GET"
    })
}
// 通过id获取
export const getCodingRulerById = (params) => {
    return request({
        url: "/coding-ruler/" + params,
        method: "GET"
    })
}
// 通过id删除
export const deleteCodingRulerById = (params) => {
    return request({
        url: "/coding-ruler/" + params,
        method: "DELETE"
    })
}
// 批量删除
export const deleteCodingRulerByIds = (params) => {
    return request({
        url: "/coding-ruler/batch",
        method: "DELETE",
        data: params
    })
}
// 修改
export const editCodingRuler = (params) => {
    return request({
        url: "/coding-ruler/",
        method: "PUT",
        data: params
    })
}
// 添加
export const addCodingRuler = (params) => {
    return request({
        url: "/coding-ruler/",
        method: "POST",
        data: params
    })
}
// 通过id修改启动状态
export const changeCodingRulerStatus = (params) =>{
    return request({
        url:'/coding-ruler/change/' + params,
        method: "GET",
    })
}
src/views/codingRuler/index.vue
New file
@@ -0,0 +1,490 @@
<template>
  <div class="app-container">
    <div class="slot">
      <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="75px">
        <el-form-item label="项目码类型" prop="projectCodeType">
          <el-select v-model="queryParams.projectCodeType" placeholder="项目码类型" @change="handleQuery">
            <el-option
              v-for="dict in dict.type.coding_type"
              :key="dict.value"
              :value="dict.value"
              :label="dict.label"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="区间类型" prop="intervalType">
          <el-select v-model="queryParams.intervalType" placeholder="区间类型" @change="handleQuery">
            <el-option
              v-for="dict in dict.type.interval_type"
              :key="dict.value"
              :value="dict.value"
              :label="dict.label"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
          <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
        </el-form-item>
      </el-form>
      <div class="right-section">
        <div class="add-btn">
          <el-tooltip content="新增" effect="dark" placement="top">
            <el-button :disabled="!isReserve" circle icon="el-icon-plus" @click="add()" size="small"/>
          </el-tooltip>
        </div>
      </div>
    </div>
    <el-table
      :data="tableData"
      row-key="id"
      border
      @selection-change="handleSelectionChange">
      <el-table-column
        type="selection"
        width="55">
      </el-table-column>
      <el-table-column
        prop="projectCodeType"
        label="项目码类型"
      >
        <template slot-scope="scope">
          <dict-tag :options="dict.type.coding_type" :value="scope.row.projectCodeType"/>
        </template>
      </el-table-column>
      <el-table-column
        prop="intervalType"
        label="区间类型"
      >
        <template slot-scope="scope">
          <dict-tag :options="dict.type.interval_type" :value="scope.row.intervalType"/>
        </template>
      </el-table-column>
      <el-table-column
        prop="leftSymbol"
        label="左符号"
      >
        <template slot-scope="scope">
          <dict-tag :options="dict.type.sys_coding_operator" :value="scope.row.leftSymbol"/>
        </template>
      </el-table-column>
      <el-table-column
        prop="leftValue"
        label="左值"
      >
      </el-table-column>
      <el-table-column
        prop="rightSymbol"
        label="右符号"
      >
        <template slot-scope="scope">
          <dict-tag :options="dict.type.sys_coding_operator" :value="scope.row.rightSymbol"/>
        </template>
      </el-table-column>
      <el-table-column
        prop="rightValue"
        label="右值"
      >
      </el-table-column>
      <el-table-column
        prop="status"
        label="状态"
      >
        <template slot-scope="scope">
            <el-tag :type="scope.row.status === 0 ? 'info' : 'success'">
              {{scope.row.status === 0 ? "未启用" : "启用"}}
            </el-tag>
        </template>
      </el-table-column>
      <el-table-column
        label="操作"  min-width="100">
        <template slot-scope="scope">
          <el-button v-if="editShow" size="medium" type="text" icon="el-icon-open" @click="changeStatus(scope.row)">
            {{scope.row.status === 0 ? "启动" : "关闭"}}
          </el-button>
          <el-button v-if="editShow" size="medium" type="text" icon="el-icon-edit" @click="editCodingRuler(scope.row)"
                     :disabled="scope.row.status === 1"
          >编辑</el-button>
          <el-button v-if="delShow" size="medium"
                     type="text"
                     icon="el-icon-delete" @click="deleteCodingRuler(scope.row)"
                     :disabled="scope.row.status === 1"
          >删除</el-button>
        </template>
      </el-table-column>
    </el-table>
    <pagination
      v-show="total>0"
      :total="total"
      :page.sync="queryParams.currentPage"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
    />
        <el-dialog width="45%" :title="dialogTitle" @close="closeDialog" :visible.sync="open" :show-close="true"  :close-on-click-modal="true"  :destroy-on-close="true">
          <el-form :model="codingRulerForm" :rules="rules" ref="codingRulerForm">
            <el-form-item label="项目码类型" :label-width="formLabelWidth" prop="projectCodeType">
              <el-select v-model="codingRulerForm.projectCodeType" placeholder="项目码类型" @change="changeOption($event)">
                <el-option
                  v-for="dict in dict.type.coding_type"
                  :key="dict.value"
                  :value="dict.value"
                  :label="dict.label"
                >
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="区间类型" :label-width="formLabelWidth" prop="intervalType">
              <el-select v-model="codingRulerForm.intervalType" placeholder="区间类型" @change="changeOption($event)">
                <el-option
                  v-for="dict in dict.type.interval_type"
                  :key="dict.value"
                  :value="dict.value"
                  :label="dict.label"
                >
                </el-option>
              </el-select>
            </el-form-item>
            <el-row>
              <el-col :span="12">
                <el-form-item label="左符号" :label-width="formLabelWidth" prop="leftSymbol" >
                  <el-select v-model="codingRulerForm.leftSymbol" placeholder="选择符号" @change="changeOption($event)">
                    <el-option
                      v-for="dict in leftOption"
                      :key="dict.value"
                      :value="dict.value"
                      :label="dict.label.replace('大于', '>')
                  .replace('小于', '<')
                  .replace('大等于', '>=')
                  .replace('等于', '=')
                  .replace('小于等于', '<=')"
                    >
                    </el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="左值" :label-width="formLabelWidth" prop="leftValue">
                  <el-input v-model="codingRulerForm.leftValue" autocomplete="off" type="number" :min="0"></el-input>
                </el-form-item>
              </el-col>
            </el-row>
          </el-form>
          <el-form :model="singleForm" :rules="rules2" ref="singleForm" v-show="isSingleInterval">
            <el-row>
              <el-col :span="12">
                <el-form-item label="右符号" :label-width="formLabelWidth" prop="rightSymbol"  >
                  <el-select v-model="singleForm.rightSymbol" placeholder="选择符号" @change="changeOption($event)">
                    <el-option
                      v-for="dict in rightOption"
                      :key="dict.value"
                      :value="dict.value"
                      :label="dict.label.replace('大于', '>')
                  .replace('小于', '<')
                  .replace('大等于', '>=')
                  .replace('等于', '=')
                  .replace('小于等于', '<=')"
                    >
                    </el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="右值" :label-width="formLabelWidth" prop="rightValue">
                  <el-input v-model="singleForm.rightValue" autocomplete="off" type="number" :min="0"></el-input>
                </el-form-item>
              </el-col>
            </el-row>
          </el-form>
          <div slot="footer" class="dialog-footer">
            <el-button @click="closeDialog">取 消</el-button>
            <el-button type="primary" @click="addOrEditCodingRuler">确 定</el-button>
          </div>
        </el-dialog>
  </div>
</template>
<script>
import {
  addCodingRuler,
  changeCodingRulerStatus,
  deleteCodingRulerById,
  editCodingRuler,
  getCodingRulers
} from '@/api/codingRuler/codingRuler.js'
export default {
  dicts: ['sys_coding_operator','coding_type','interval_type'],
  name: "CodingRulerDialog",
  data() {
    return {
      rules2:{
        rightSymbol:[{ required: true, message: '请输入右符号', trigger: 'blur' }],
        rightValue:[{ required: true, message: '请输入右值', trigger: 'blur' }],
      },
      rules:{
        projectCodeType: [{ required: true, message: '请输入项目码类型', trigger: 'blur' }],
        intervalType: [{ required: true, message: '请输入区间类型', trigger: 'blur' }],
        leftSymbol: [{ required: true, message: '请输入左符号', trigger: 'blur' }],
        leftValue: [{ required: true, message: '请输入左值', trigger: 'blur' }],
      },
      // 是否为单区间
      isSingleInterval:false,
      // 弹出框标题
      dialogTitle:"",
      //是否新增条件
      isReserve: true,
      // 能否修改条件
      editShow:true,
      // 能否删除条件
      delShow:true,
      // 总条数
      total:0,
      // 表格内容
      tableData:[],
      // 是否开启搜索条件
      showSearch:true,
      queryParams:{
        intervalType:'',
        currentPage: 1,
        pageSize: 10,
        projectCodeType:'',
      },
      formLabelWidth: '120px',
      // 表单参数
      codingRulerForm:{
        projectCodeType:'',
        intervalType:'',
        leftSymbol:'',
        leftValue:'',
      },
      singleForm:{
        rightSymbol:'',
        rightValue:'',
      },
      // 是否显示弹出层
      open: false,
      // 选中数组
      ids: [],
      // //左符号
      // leftOption:[],
      // //右符号
      // rightOption:[],
    }
  },
  computed:{
    leftOption(){
      if (this.codingRulerForm.intervalType === null || this.codingRulerForm.intervalType === ''){
        return  this.dict.type.sys_coding_operator
      }else {
        if (this.codingRulerForm.intervalType === 'interval'){
          return this.dict.type.sys_coding_operator.filter(item => item.value <= 2);
        }else {
          return  this.dict.type.sys_coding_operator;
        }
      }
    },
    rightOption(){
        return this.dict.type.sys_coding_operator.filter(item => item.value >= 2);
    }
  },
  created(){
  },
  mounted() {
    // 初始化表单数据
    this.getList();
  },
  watch:{
    'codingRulerForm.intervalType'(val){
      if (val && val === 'single_interval'){
        this.isSingleInterval = false;
      }else if (val === 'interval'){
        this.isSingleInterval =true;
      }else {
        this.isSingleInterval =false;
      }
    }
  },
  methods: {
    // 清除验证样式以及单区间右符号的值
    changeOption(e){
      if (e === 'single_interval'){
        this.singleForm.rightValue = null;
        this.singleForm.rightSymbol = null;
      }
    },
    // 获取表格数据
    getList(){
      getCodingRulers(this.queryParams).then(res =>{
        this.tableData = res.data;
        this.total = res.total;
      })
    },
    // 修改
    editCodingRuler(row){
      this.open = true;
      this.dialogTitle = "编辑";
      // 表单赋值
      // 拷贝
      this.codingRulerForm = {...row};
      this.singleForm =  {...row};
    },
    // 删除
    deleteCodingRuler(row){
      this.$modal.confirm('是否删除选中编码规则?').then(function(){
        return deleteCodingRulerById(row.id);
      }).then(() =>{
        this.getList();
        this.$modal.msgSuccess("删除成功");
      }).catch(() => {});
    },
    // 新增
    add(){
      this.open = true;
      this.dialogTitle = "新增";
    },
    // 取消
    closeDialog() {
      this.open = false;
      this.clearForm();
    },
    // 清空表单
    clearForm() {
      this.codingRulerForm = {
        id :null,
        projectCodeType:null,
        intervalType:null,
        leftSymbol:null,
        leftValue:null,
      }
      this.singleForm ={
        rightSymbol:null,
        rightValue:null,
      }
      this.resetForm("codingRulerForm");
      this.resetForm("singleForm");
      this.isSingleInterval = false;
    },
    handleSelectionChange(val) {
      this.ids = val.map(item => item.id)
      console.log(ids)
    },
    // 搜索按钮操作
    handleQuery() {
      this.queryParams.pageNum = 1;
      this.getList();
    },
    // 重置搜索
    resetQuery(){
      this.resetForm("queryForm");
      this.handleQuery();
    },
    // 状态切换
    changeStatus(row){
      changeCodingRulerStatus(row.id).then(res =>{
        this.getList();
        this.$message.info(res.msg)
      })
    },
    async addOrEditCodingRuler() {
      // 默认
      let intervalState = false;
      if(this.codingRulerForm.intervalType && this.codingRulerForm.intervalType === "interval"){
        // 区间情况
        intervalState = true;
      }else {
        intervalState = false;
      }
      if (intervalState){
        let need1 = false;
        let need2 = false;
        let warning = false;
         await this.$refs["singleForm"].validate((valid) =>{
          if (valid){
            need1 = true;
          }
        })
          await this.$refs["codingRulerForm"].validate((valid) => {
          if (valid) {
            need2 = true;
            if(this.codingRulerForm.leftValue >= this.singleForm.rightValue){
              warning = true;
            }
          }
        });
         if (warning){
           this.$message.warning("右值应该大于左值")
           return
         }
        if (need1 && need2){
          this.addOrEdit();
        }
      }else {
        this.$refs["codingRulerForm"].validate((valid) => {
          if (valid) {
            this.addOrEdit();
          }
        });
      }
    },
    async addOrEdit(){
      const form = this.codingRulerForm;
      form.rightSymbol = this.singleForm.rightSymbol;
      form.rightValue = this.singleForm.rightValue;
      if (this.dialogTitle === "新增") {
        await addCodingRuler(form).then((res) => {
          this.$message.success(res.msg);
          this.open = false;
          this.getList();
        })
      } else if (this.dialogTitle === "编辑" && this.codingRulerForm.id){
        await editCodingRuler(form).then((res) => {
          this.$message.success(res.msg);
          this.open = false;
          this.getList()
        })
      }
      this.isSingleInterval = false;
    }
  }
}
</script>
<style scoped>
.right-section {
  display: flex;
  .add-btn {
    margin: 0 10px;
  }
}
.slot {
  display: flex;
}
</style>