前端页面规则设计

ruoyi-ui/src/api/ruoyi-myLuckyexcel/myluckyexcel.js

 import request from '@/utils/request'
 
-// 查询模板详情列表
+// 查询规则列表
+export function listRule(query) {
+  return request({
+    url: '/system/ruleManagement/list',
+    method: 'get',
+    params: query
+  })
+}
+// 查询规则详情详细
+export function getRule(id) {
+  return request({
+    url: '/system/ruleManagement/' + id,
+    method: 'get'
+  })
+}
+// 查询模板列表
 export function listMyluckyexcel(query) {
   return request({
     url: '/system/supplies/list',

ruoyi-ui/src/views/system/supplies/index.vue

 <template>
   <div class="app-container">
     <el-form  ref="queryForm" size="small" :inline="true"  label-width="68px">
-      <el-form-item label="模板" prop="name">
-        <el-select v-model="selectedOption" ref="mySelect" size="mini" @change="handleOptionChange" placeholder="请选择你要查看的模板" >
+      <el-form-item label="模板" prop="name" >
+        <el-select v-model="selectedOption" ref="mySelect" size="mini" @change="handleOptionChange" placeholder="请选择您要查看的模板" >
           <!--  <el-option label="自设的模板名" value="使用空白模板"></el-option>-->
           <el-option
             v-for="item in depss" :key="item.id" :label="item.name" :value="item.id">
           </el-option>
         </el-select>
       </el-form-item>
+      <el-form-item label="规则" prop="rule">
+        <el-select v-model="selectedRule" ref="mySelect" size="mini" @change="handleRuleChange" placeholder="请选择您要查看的规则" >
+          <el-option
+            v-for="iem in luckyrule" :key="iem.id" :label="iem.name" :value="iem.id">
+          </el-option>
+        </el-select>
+      </el-form-item>
       <el-form-item>
-        <!--<el-button type="primary" icon="el-icon-search" size="mini" >搜索</el-button> -->
         <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
       </el-form-item>
     </el-form>
 
     <el-row :gutter="10" class="mb8">
-      <!--<el-col :span="1.5">
+     <!--<el-col :span="1.5">
         <el-button
           type="success"
           plain
@@ -62,7 +68,7 @@
       :visible.sync="dialogVisible"
       width="30%"
       style="z-index: 1; "
-      :before-close="handleClose">
+      >
       <el-form  label-width="80px" @submit.native.prevent>
         <el-form-item label="名称" >
           <!--  onkeypress="if (event.keyCode == 13) return false" //关闭enter的触发事件  -->
@@ -84,7 +90,7 @@
 import $ from 'jquery'
 /*安装插件 npm install xlsx，安装完成后引入 import XLSX from ‘xlsx’*/
 import XLSX from 'xlsx'
-import {addMyluckyexcel, getMyluckyexcel, listMyluckyexcel} from "@/api/ruoyi-myLuckyexcel/myluckyexcel";
+import {addMyluckyexcel, getMyluckyexcel, listMyluckyexcel,listRule,getRule} from "@/api/ruoyi-myLuckyexcel/myluckyexcel";
 
 import luckysheet from 'luckysheet'
 import LuckyExcel from 'luckyexcel'
@@ -99,9 +105,11 @@ export default {
       // 是否显示弹出层
       dialogVisible : false,
       selectedOption:'',
+      selectedRule:'',
       luckysheetData: '',
       fileList:[],
       disableNextButton: true,
+      luckyrule:[],
       depss:[],
       // 表单参数
       form: {},
@@ -118,6 +126,7 @@ export default {
 //刷新页面时进行的操作
 
     this.getList();
+
   },
   mounted() {
 
@@ -129,6 +138,9 @@ export default {
       listMyluckyexcel(this.queryParams).then(response => {
         this.depss = response.rows;
       });
+      listRule(this.queryParams).then(response => {
+        this.luckyrule = response.rows;
+      });
     },
     /** 下拉选和页面luckysheet绑定 */
     handleOptionChange() {
@@ -155,14 +167,27 @@ export default {
         this.$message.error('查询失败,发生未知错误!');
       });
     },
+    handleRuleChange(){
+      getRule(this.selectedRule).then(response => {
+        const sysRules = response.data;
+        this.disableNextButton = this.selectedOption === '';
+        //将接收到的json存到json_data中
+        let json_data = JSON.parse(sysRules.jsons);
+        let filename= sysRules.name;
+
+      }).catch(() => {
+        // 处理错误逻辑，这里是一个空的错误处理函数
+        this.$message.error('查询失败,发生未知错误!');
+      });
+    },
     /** 弹出的确认框关闭 */
-    handleClose(done) {
+    /*handleClose(done) {
       this.$confirm('确认关闭？')
         .then(_ => {
           done();
         })
         .catch(_ => {});
-    },
+    },*/
     /** 回车事件和保存提交绑定 */
     handleEnter(event) {
       if (event.keyCode === 13) {
@@ -202,6 +227,7 @@ export default {
       //刷新下拉选框内容
       this.selectedOption='';
       this.disableNextButton='';
+      this.selectedRule='';
       //刷新luckysheet表格
       this.init();
     },
@@ -310,7 +336,7 @@ export default {
       exportExcel(luckysheet.getAllSheets(), this.from_name)
     },
   }
-// 配置项12211
+// 配置项
 
 };
 </script>