Browse Source

更改btn样式

qinhb 1 year ago
parent
commit
cc20ffc090

+ 1 - 0
src/hooks/userCrud.ts

@@ -27,6 +27,7 @@ export const useCrud = (config?: UseCrudConfig) => {
   /** 表格配置属性 */
   const option = ref({
     searchIcon: true,
+   // searchSpan: 4,
     searchIndex: 3, //searchIcon是否启用功能按钮, searchIndex配置收缩展示的个数,默认为2个
     index: true, //是否显示第几项
     indexLabel: "序号",

+ 9 - 0
src/layout/index.vue

@@ -340,4 +340,13 @@ function toggleSidebar() {
     --el-menu-item-height: $navbar-height;
   }
 }
+
+:deep(.el-collapse-item__content){
+  padding: 18px 0 15px 10px;
+  margin-bottom: 10px;
+  background-color: var(--el-bg-color-overlay);
+  border: 1px solid var(--el-border-color-light);
+  border-radius: 4px;
+  box-shadow: var(--el-box-shadow-light);
+}
 </style>

src/views/device/metering/components/record-page.vue → src/views/device/metering/components/metering-record.vue


+ 1 - 1
src/views/device/metering/index.vue

@@ -132,7 +132,7 @@ import {getUserList} from "@/api/system/user"
 import {maintenanceUpdate} from "@/api/device/index";
 import { useCommonStoreHook } from "@/store";
 import dictDataUtil from "@/common/configs/dictDataUtil";
-import RecordPage from "./components/record-page.vue";
+import RecordPage from "./components/metering-record.vue";
 const { isShowTable, tableType } = toRefs(useCommonStoreHook());
 const test = () => {
   isShowTable.value = true;

+ 1 - 0
src/views/plan/order/index.vue

@@ -131,6 +131,7 @@ option.value = {
   border: true,
   searchIndex: 3,
   searchIcon: true,
+  //searchSpan: 4,
   searchMenuSpan: 8,
   align: "center",
   menuAlign: "center",

+ 1 - 1
src/views/system/dept/index.vue

@@ -35,7 +35,7 @@
       <template #header>
         <el-button
           v-hasPerm="['sys:dept:add']"
-          type="success"
+          type="primary"
           @click="openDialog(undefined, undefined)"
           ><i-ep-plus />新增</el-button
         >

+ 3 - 3
src/views/system/dict/index.vue

@@ -208,7 +208,7 @@ onMounted?.(() => {
       <template #header>
         <el-button
           v-hasPerm="[ButtonPermKeys.SYSTEM.BTNS.dictType_add]"
-          type="success"
+          type="primary"
           @click="openDialog()"
           ><i-ep-plus />新增</el-button
         >
@@ -227,8 +227,8 @@ onMounted?.(() => {
         @selection-change="handleSelectionChange"
       >
         <!-- <el-table-column type="selection" width="55" align="center" /> -->
-        <el-table-column label="字典类型名称" prop="dictName" width="200" />
-        <el-table-column label="字典类型编码" prop="dictType" width="200" />
+        <el-table-column label="字典类型名称" prop="dictName" />
+        <el-table-column label="字典类型编码" prop="dictType"/>
         <el-table-column label="状态" align="center" width="100">
           <template #default="scope">
             <el-tag v-if="scope.row.state === 1" type="success">启用</el-tag>

+ 3 - 5
src/views/system/menu/index.vue

@@ -26,7 +26,7 @@
       <template #header>
         <el-button
           v-hasPerm="[ButtonPermKeys.SYSTEM.BTNS.menu_add]"
-          type="success"
+          type="primary"
           @click="openDialog('0')"
         >
           <template #icon><i-ep-plus /></template>
@@ -46,14 +46,14 @@
           hasChildren: 'hasChildren',
         }"
       >
-        <el-table-column label="菜单名称" min-width="200">
+        <el-table-column label="菜单名称"  >
           <template #default="scope">
             <svg-icon :icon-class="scope.row.icon" />
             {{ scope.row.menuName }}
           </template>
         </el-table-column>
 
-        <el-table-column label="类型" align="center" width="80">
+        <el-table-column label="类型" align="center">
           <template #default="scope">
             <el-tag
               v-if="scope.row.type === MenuTypeEnum.CATALOG"
@@ -73,14 +73,12 @@
         <el-table-column
           label="路由路径"
           align="left"
-          width="150"
           prop="path"
         />
 
         <el-table-column
           label="组件路径"
           align="left"
-          width="250"
           prop="component"
         />
 

+ 180 - 0
src/views/system/post/index.vue

@@ -0,0 +1,180 @@
+<template>
+  <div class="mainContentBox">
+    <avue-crud
+        ref="crudRef"
+        v-model:search="search"
+        v-model="form"
+        :data="data"
+        :option="option"
+        v-model:page="page"
+        @row-save="createRow"
+        @row-update="updateRow"
+        @row-del="deleteRow"
+        @search-change="searchChange"
+        @search-reset="resetChange"
+        @size-change="dataList"
+        @current-change="dataList"
+        @selection-change="selectionChange"
+    >
+      <template #menu-left="{ size }">
+        <el-button
+          :disabled="toDeleteIds.length < 1"
+          type="danger"
+          icon="el-icon-delete"
+          :size="size"
+          @click="multipleDelete"
+          >删除</el-button
+        >
+      </template>
+    </avue-crud>
+    <ExcelUpload ref="uploadRef" @finished="uploadFinished" />
+  </div>
+</template>
+<script setup>
+import { ref, getCurrentInstance } from "vue";
+import { useCrud } from "@/hooks/userCrud";
+import ButtonPermKeys from "@/common/configs/buttonPermission";
+
+import { useCommonStoreHook } from "@/store";
+import dictDataUtil from "@/common/configs/dictDataUtil";
+const { isShowTable, tableType } = toRefs(useCommonStoreHook());
+const test = () => {
+  isShowTable.value = true;
+  tableType.value = tableType.value == 1 ? 2 : 1;
+};
+
+// 传入一个url,后面不带/
+const { form, data, option, search, page, toDeleteIds, Methords, Utils } =
+  useCrud({
+    src: "/api/v1/sys/post",
+  });
+const { dataList, createRow, updateRow, deleteRow, searchChange, resetChange } = Methords; //增删改查
+const { selectionChange, multipleDelete } = Methords; //选中和批量删除事件
+const { checkBtnPerm, downloadTemplate, exportData } = Utils; //按钮权限等工具
+
+const crudRef = ref(null); //crudRef.value 获取avue-crud对象
+
+// 设置表格列或者其他自定义的option
+option.value = Object.assign(option.value, {
+  delBtn: false,
+  selection: true,
+  column: [
+    {
+      label: "岗位组",
+      prop: "postGroup",
+      type: "select",
+      search: true,
+      dicUrl:
+          dictDataUtil.request_url +
+          dictDataUtil.TYPE_CODE.post_group,
+      props: {
+        label: "dictLabel",
+        value: "dictValue",
+      },
+      rules: [
+        {
+          required: true,
+          message: "岗位组不能为空",
+          trigger: "trigger",
+        },
+      ],
+    },
+    {
+      label: "岗位类别",
+      prop: "postType",
+      type: "select",
+      search: true,
+      dicUrl:
+          dictDataUtil.request_url +
+          dictDataUtil.TYPE_CODE.post_type,
+      props: {
+        label: "dictLabel",
+        value: "dictValue",
+      },
+      rules: [
+        {
+          required: true,
+          message: "岗位类别不能为空",
+          trigger: "trigger",
+        },
+      ],
+    },
+    {
+      label: "岗位编码",
+      prop: "postCode",
+      search: true,
+      rules: [
+        {
+          required: true,
+          message: "岗位编码不能为空",
+          trigger: "trigger",
+        },
+      ],
+    },
+    {
+      label: "岗位名称",
+      prop: "postName",
+      rules: [
+        {
+          required: true,
+          message: "岗位名称不能为空",
+          trigger: "trigger",
+        },
+      ],
+    },
+    {
+      label: "状态",
+      prop: "state",
+      type: "select",
+      dicData: [{label: '正常' , value: 0},{label: '禁用' , value: 1}],
+      html: true,
+      formatter: (val) => {
+        if (val.state === 0) {
+          return '<b class="el-tag el-tag--success el-tag--light">正常</b>';
+        }
+        return '<b class="el-tag el-tag--danger el-tag--light">禁用</b>';
+      },
+      addDisplay: false,
+      rules: [
+        {
+          required: true,
+          message: "状态不能为空",
+          trigger: "trigger",
+        },
+      ],
+    },
+    {
+      label: "备注",
+      prop: "remark",
+      width: "100",
+      minRows: 2, //最小行/最小值
+      type: "textarea", //类型为多行文本域框
+      maxlength: 512, //最大输入长度
+    },
+    {
+      label: "创建时间",
+      prop: "created",
+      display: false
+    },
+  ],
+});
+
+onMounted(() => {
+  // console.log("crudRef", crudRef)
+  dataList();
+});
+/**
+ * 上传excel相关
+ */
+const uploadRef = ref(null);
+const uploadFinished = () => {
+  // 上传完成后的刷新操作
+  page.currentPage = 1;
+  dataList();
+};
+const importExcelData = () => {
+  if (uploadRef.value) {
+    uploadRef.value.show("/api/v1/device/import");
+  }
+};
+</script>