添加设备分组页面以及功能

master

2022-03-08 f9c926251d45fb4930317c545d2d77b5f1a338a9

添加设备分组页面以及功能

 src/cool/modules/device/views/device.vue

@@ -138,8 +138,8 @@
                    label: "运行状态",

                    prop: "status",

                    filters: [

                        { text: "0", value: "已停止" },

                        { text: "1", value: "正在运行" }

                        { text: 0, value: 0 },

                        { text: 1, value: 1 }

                    ]

                    // filters:"[{ text: '家', value: '家' }, { text: '公司', value: '公司' }]"

                },


 src/cool/modules/deviceGroup/views/deviceGroup.vue

@@ -1,5 +1,131 @@
<template>

  <div>

    <h1>设备分组页面</h1>

  </div>

</template>
  <cl-crud :ref="setRefs('crud')"

           @load="onLoad">

    <el-row type="flex"

            align="middle">

      <!-- 刷新按钮 -->

      <cl-refresh-btn />

      <!-- 新增按钮 -->

      <cl-add-btn />

      <!-- 删除按钮 -->

      <cl-multi-delete-btn />

      <cl-flex1 />

      <!-- 关键字搜索 -->

      <cl-search-key />

    </el-row>



    <el-row>

      <!-- 数据表格 -->

      <cl-table :ref="setRefs('table')"

                v-bind="table" />

    </el-row>



    <el-row type="flex">

      <cl-flex1 />

      <!-- 分页控件 -->

      <cl-pagination />

    </el-row>



    <!-- 新增、编辑 -->

    <cl-upsert :ref="setRefs('upsert')"

               v-bind="upsert" />

  </cl-crud>

</template>



<script lang="ts">

import { defineComponent, reactive } from "vue";

import { CrudLoad, Upsert, Table } from "@cool-vue/crud/types";

import { useCool } from "/@/cool";



export default defineComponent({

    setup() {

        const { refs, setRefs, service } = useCool();



        // 新增、编辑配置

        const upsert = reactive<Upsert>({

            items: [

                {

                    label: "逻辑ID",

                    prop: "logic_id",

                    component: {

                        name: "el-input"

                    },

                    required: true

                },

                {

                    label: "配置人名称",

                    prop: "configurator",

                    component: {

                        name: "el-input"

                    },

                    required: true

                },

                {

                    label: "备注",

                    prop: "remark",

                    component: {

                        name: "el-input"

                    }

                },

                {

                    label: "状态",

                    prop: "status",

                    component: {

                        name: "el-input"

                    }

                }

            ]

        });



        // 表格配置

        const table = reactive<Table>({

            columns: [

                {

                    type: "selection",

                    align: "center"

                },

                {

                    label: "序号",

                    prop: "id",

                    sortable: true //是否排序功能

                },

                {

                    label: "逻辑ID",

                    prop: "logic_id"

                },

                {

                    label: "配置人名称",

                    prop: "configurator"

                },

                {

                    label: "备注",

                    prop: "remark"

                },

                {

                    label: "状态",

                    prop: "status"

                },

                {

                    label: "操作",

                    type: "op"

                }

            ]

        });



        // crud 加载

        function onLoad({ ctx, app }: CrudLoad) {

            // 绑定 service

            ctx.service(service.deviceGroup.deviceGroup).done();

            app.refresh();

        }



        return {

            refs,

            setRefs,

            upsert,

            table,

            onLoad

        };

    }

});

</script>


 src/cool/modules/immediateTask/views/immediateTask.vue

@@ -1,5 +1,70 @@
<template>

  <div>

    即时任务

  </div>

</template>
  <cl-crud :ref="setRefs('crud')"

           @load="onLoad">

    <el-row type="flex"

            align="middle">

      <!-- 刷新按钮 -->

      <cl-refresh-btn />

      <!-- 新增按钮 -->

      <cl-add-btn />

      <!-- 删除按钮 -->

      <cl-multi-delete-btn />

      <cl-flex1 />

      <!-- 关键字搜索 -->

      <cl-search-key />

    </el-row>



    <el-row>

      <!-- 数据表格 -->

      <cl-table :ref="setRefs('table')"

                v-bind="table" />

    </el-row>



    <el-row type="flex">

      <cl-flex1 />

      <!-- 分页控件 -->

      <cl-pagination />

    </el-row>



    <!-- 新增、编辑 -->

    <cl-upsert :ref="setRefs('upsert')"

               v-bind="upsert" />

  </cl-crud>

</template>



<script lang="ts">

import { defineComponent, reactive } from "vue";

import { CrudLoad, Upsert, Table } from "@cool-vue/crud/types";

import { useCool } from "/@/cool";



export default defineComponent({

    setup() {

        const { refs, setRefs, service } = useCool();



        // 新增、编辑配置

        const upsert = reactive<Upsert>({

            items: []

        });



        // 表格配置

        const table = reactive<Table>({

            columns: []

        });



        // crud 加载

        function onLoad({ ctx, app }: CrudLoad) {

            // 绑定 service

            ctx.service(service.xx).done();

            app.refresh();

        }



        return {

            refs,

            setRefs,

            upsert,

            table,

            onLoad

        };

    }

});

</script>


 src/cool/modules/index.ts

@@ -18,5 +18,7 @@
    }
  },
  "huaneng",
  "device"
  "device",
  "deviceGroup",
  "taskSetting"
];

 src/cool/modules/taskSetting/components/index.ts

New file
@@ -0,0 +1 @@
export default {};

 src/cool/modules/taskSetting/directives/index.ts

New file
@@ -0,0 +1 @@
export default {};

 src/cool/modules/taskSetting/index.ts

New file
@@ -0,0 +1,15 @@
import components from "./components";
import directives from "./directives";
import service from "./service";
import store from "./store";
import pages from "./pages";
import views from "./views";

export default {
    components,
    directives,
    service,
    store,
    pages,
    views
};

 src/cool/modules/taskSetting/pages/index.ts

New file
@@ -0,0 +1 @@
export default [];

 src/cool/modules/taskSetting/service/index.ts

New file
@@ -0,0 +1 @@
export default {};

 src/cool/modules/taskSetting/store/index.ts

New file
@@ -0,0 +1 @@
export default {};

 src/cool/modules/taskSetting/views/index.ts

New file
@@ -0,0 +1 @@
export default [];

 src/cool/modules/taskSetting/views/taskSetting.vue

New file
@@ -0,0 +1,115 @@
<template>

  <cl-crud :ref="setRefs('crud')"

           @load="onLoad">

    <el-row type="flex"

            align="middle">

      <!-- 刷新按钮 -->

      <cl-refresh-btn />

      <!-- 新增按钮 -->

      <cl-add-btn />

      <!-- 删除按钮 -->

      <cl-multi-delete-btn />

      <cl-flex1 />

      <!-- 关键字搜索 -->

      <cl-search-key />

    </el-row>



    <el-row>

      <!-- 数据表格 -->

      <cl-table :ref="setRefs('table')"

                v-bind="table" />

    </el-row>



    <el-row type="flex">

      <cl-flex1 />

      <!-- 分页控件 -->

      <cl-pagination />

    </el-row>



    <!-- 新增、编辑 -->

    <cl-upsert :ref="setRefs('upsert')"

               v-bind="upsert" />

  </cl-crud>

</template>



<script lang="ts">

import { defineComponent, reactive } from "vue";

import { CrudLoad, Upsert, Table } from "@cool-vue/crud/types";

import { useCool } from "/@/cool";



export default defineComponent({

    setup() {

        const { refs, setRefs, service } = useCool();



        // 新增、编辑配置

        const upsert = reactive<Upsert>({

            items: []

        });



        // 表格配置

        const table = reactive<Table>({

            columns: [

                {

                    label: "id",

                    prop: "id"

                },

                {

                    label: "设备分组ID",

                    prop: "group_id"

                },

                {

                    label: "任务类型",

                    prop: "task_type"

                },

                {

                    label: "周期任务",

                    prop: "crontab_rule"

                },

                {

                    label: "任务内容描述",

                    prop: "task_content"

                },

                {

                    label: "任务参数",

                    prop: "task_params"

                },

                {

                    label: "任务命令格式",

                    prop: "task_command"

                },

                {

                    label: "设置人",

                    prop: "operator"

                },

                {

                    label: "备注",

                    prop: "remark"

                },

                {

                    label: "状态",

                    prop: "status"

                },

                {

                    label: "操作",

                    type: "op"

                }

            ]

        });



        // crud 加载

        function onLoad({ ctx, app }: CrudLoad) {

            // 绑定 service

            ctx.service(service.taskSetting.taskSetting).done();

            app.refresh();

        }



        return {

            refs,

            setRefs,

            upsert,

            table,

            onLoad

        };

    }

});

</script>


 src/service/request.ts

@@ -10,7 +10,7 @@
axios.defaults.withCredentials = true;

NProgress.configure({
    showSpinner: false
  showSpinner: false
});

// 请求队列
@@ -21,137 +21,138 @@

// 忽略规则
const ignore = {
    NProgress: ["/sys/info/record"],
    token: ["/login", "/captcha"]
  NProgress: ["/sys/info/record"],
  token: ["/login", "/captcha"]
};

// Request
axios.interceptors.request.use(
    (config: any) => {
        const token = store.getters.token || "";
  (config: any) => {
    const token = store.getters.token || "";

        if (config.url) {
            if (!ignore.token.some((e) => config.url.includes(e))) {
                config.headers["Authorization"] = token;
            }
    if (config.url) {
      if (!ignore.token.some((e) => config.url.includes(e))) {
        config.headers["Authorization"] = token;
      }

            if (!ignore.NProgress.some((e) => config.url.includes(e))) {
                NProgress.start();
            }
        }
      if (!ignore.NProgress.some((e) => config.url.includes(e))) {
        NProgress.start();
      }
    }

        // 请求信息
        if (isDev) {
            console.group(config.url);
            console.log("method:", config.method);
            console.table("data:", config.method == "get" ? config.params : config.data);
            console.groupEnd();
        }
    // 请求信息
    if (isDev) {
      console.log("config:", config);
      console.group(config.url);
      console.log("method:", config.method);
      console.table("data:", config.method == "get" ? config.params : config.data);
      console.groupEnd();
    }

        // 验证 token
        if (token) {
            if (config.url.includes("refreshToken")) {
                return config;
            }
    // 验证 token
    if (token) {
      if (config.url.includes("refreshToken")) {
        return config;
      }

            // 判断 token 是否过期
            if (storage.isExpired("token")) {
                // 判断 refreshToken 是否过期
                if (storage.isExpired("refreshToken")) {
                    store.dispatch("userRemove");
                    return href("/login");
                }
      // 判断 token 是否过期
      if (storage.isExpired("token")) {
        // 判断 refreshToken 是否过期
        if (storage.isExpired("refreshToken")) {
          store.dispatch("userRemove");
          return href("/login");
        }

                // 是否在刷新中
                if (!isRefreshing) {
                    isRefreshing = true;
        // 是否在刷新中
        if (!isRefreshing) {
          isRefreshing = true;

                    store.dispatch("refreshToken").then((token: string) => {
                        requests.forEach((cb) => cb(token));
                        requests = [];
                        isRefreshing = false;
                    });
                }
          store.dispatch("refreshToken").then((token: string) => {
            requests.forEach((cb) => cb(token));
            requests = [];
            isRefreshing = false;
          });
        }

                return new Promise((resolve) => {
                    // 继续请求
                    requests.push((token: string) => {
                        // 重新设置 token
                        config.headers["Authorization"] = token;
                        resolve(config);
                    });
                });
            }
        }
        return new Promise((resolve) => {
          // 继续请求
          requests.push((token: string) => {
            // 重新设置 token
            config.headers["Authorization"] = token;
            resolve(config);
          });
        });
      }
    }

        return config;
    },
    (error) => {
        return Promise.reject(error);
    }
    return config;
  },
  (error) => {
    return Promise.reject(error);
  }
);

// Response
axios.interceptors.response.use(
    (res) => {
        NProgress.done();
        const { code, data, message } = res.data;
  (res) => {
    NProgress.done();
    const { code, data, message } = res.data;

        if (!res.data) {
            return res;
        }
    if (!res.data) {
      return res;
    }

        switch (code) {
            case 1000:
                return data;
            default:
                return Promise.reject(message);
        }
    },
    async (error) => {
        NProgress.done();
    switch (code) {
      case 1000:
        return data;
      default:
        return Promise.reject(message);
    }
  },
  async (error) => {
    NProgress.done();

        if (error.response) {
            const { status, config } = error.response;
    if (error.response) {
      const { status, config } = error.response;

            switch (status) {
                case 401:
                    await store.dispatch("userRemove");
                    href("/login");
                    break;
      switch (status) {
        case 401:
          await store.dispatch("userRemove");
          href("/login");
          break;

                case 403:
                    if (isDev) {
                        ElMessage.error(`${config.url} 无权限访问！！`);
                    } else {
                        href("/403");
                    }
                    break;
        case 403:
          if (isDev) {
            ElMessage.error(`${config.url} 无权限访问！！`);
          } else {
            href("/403");
          }
          break;

                case 404:
                    break;
        case 404:
          break;

                case 500:
                    if (!isDev) {
                        href("/500");
                    }
                    break;
        case 500:
          if (!isDev) {
            href("/500");
          }
          break;

                case 502:
                    if (isDev) {
                        ElMessage.error(`${config.url} 服务异常！！`);
                    } else {
                        href("/502");
                    }
                    break;
        case 502:
          if (isDev) {
            ElMessage.error(`${config.url} 服务异常！！`);
          } else {
            href("/502");
          }
          break;

                default:
                    console.error(status, config.url);
            }
        }
        default:
          console.error(status, config.url);
      }
    }

        return Promise.reject(error.message);
    }
    return Promise.reject(error.message);
  }
);

export default axios;