决策支持

	三率管理
		复位及时率
		状态转换率
		消缺及时率

src/router/index.js

@@ -311,6 +311,24 @@ const routes = [
     name: "fs",
     component: () => import(/* webpackChunkName: "fs" */ "../views/NewPages/forecast-system.vue"),
   },
+  // 三率管理/复位及时率
+  {
+    path:'/fwjsl',
+    name:'fwjsl',
+    component:()=> import('../views/Decision/slgl/fwjsl.vue')
+  },
+  // 三率管理/状态转换率
+  {
+    path:'/ztzhl',
+    name:'ztzhl',
+    component:()=> import('../views/Decision/slgl/ztzhl.vue')
+  },
+  // 三率管理/消缺及时率
+  {
+    path:'/xqjsl',
+    name:'xqjsl',
+    component:()=> import('../views/Decision/slgl/xqjsl.vue')
+  }
 ]
 const router = createRouter({
   history: createWebHashHistory(),

src/views/Decision/slgl/fwjsl.vue

@@ -0,0 +1,217 @@
+<template>
+  <div>
+    <div class="query mg-b-8">
+      <div class="query-items">
+        <div class="query-item">
+          <div class="lable">开始日期：</div>
+          <div class="search-input">
+            <el-date-picker
+              v-model="value1"
+              @change="BeginChange(value1)"
+              type="date"
+              value-format="YYYY-MM-DD"
+              placeholder="选择日期"
+              popper-class="date-select"
+            >
+            </el-date-picker>
+          </div>
+        </div>
+        <div class="query-item">
+          <div class="lable">结束日期：</div>
+          <div class="search-input">
+            <el-date-picker
+              v-model="value2"
+              @change="EndChange(value2)"
+              type="date"
+              value-format="YYYY-MM-DD"
+              placeholder="选择日期"
+              popper-class="date-select"
+            >
+            </el-date-picker>
+            <div class="unit svg-icon svg-icon-gray">
+              <svg-icon :svgid="''" />
+            </div>
+          </div>
+        </div>
+      </div>
+      <div class="query-actions">
+        <button class="btn green" @click="handleSubmit">计算</button>
+      </div>
+    </div>
+    <div class="table-box">
+      <ComTable
+        :data="tableData"
+        :pageSize="20"
+        height="85vh"
+        v-loading="tableLoading"
+        element-loading-text="拼命加载中"
+        element-loading-background="rgba(0, 0, 0, 0.8)"
+      ></ComTable>
+    </div>
+  </div>
+</template>
+<script>
+import ComTable from "@/components/coms/table/table.vue";
+export default {
+  name: "fwjsl",
+  components: { ComTable },
+  data() {
+    return {
+      value1: "",
+      value2: "",
+      tableData: {
+        column: [
+          {
+            name: "单位",
+            field: "unit",
+            is_num: false,
+            is_light: false,
+            sortable: true
+          },
+          {
+            name: "5分钟 / 复位次数",
+            field: "five",
+            is_num: false,
+            is_light: false,
+            sortable: true
+          },
+          {
+            name: "5分钟 / 复位率",
+            field: "fives",
+            is_num: false,
+            is_light: false,
+            sortable: true
+          },
+          {
+            name: "10分钟 / 复位次数",
+            field: "ten",
+            is_num: false,
+            is_light: false,
+            sortable: true
+          },
+          {
+            name: "10分钟 / 复位率",
+            field: "tens",
+            is_num: false,
+            is_light: false,
+            sortable: true
+          },
+          {
+            name: "15分钟 / 复位次数",
+            field: "fifteen",
+            is_num: false,
+            is_light: false,
+            sortable: true
+          },
+          {
+            name: "15分钟 / 复位率",
+            field: "fifteens",
+            is_num: false,
+            is_light: false,
+            sortable: true
+          },
+          {
+            name: "20分钟 / 复位次数",
+            field: "twenty",
+            is_num: false,
+            is_light: false,
+            sortable: true
+          },
+          {
+            name: "20分钟 / 复位率",
+            field: "twentys",
+            is_num: false,
+            is_light: false,
+            sortable: true
+          }
+        ],
+        data: []
+      },
+      tableLoading: true
+    };
+  },
+  mounted() {
+    //   获取表格数据
+    this.getTable();
+  },
+  created() {
+    this.value1 = this.getTime(1);
+    this.value2 = this.getTime(2);
+  },
+  methods: {
+    //   获取表格数据
+    getTable() {
+      let that = this;
+      that.tableLoading = true;
+      that.API.requestData({
+        method: "GET",
+        baseURL: "http://10.155.32.4:8034/",
+        subUrl: "/threerate/fwjsl",
+        data: {
+          beginDate: this.value1,
+          endDate: this.value2
+        },
+        success(res) {
+          that.tableLoading = false;
+          if (res.code === 200) {
+            var data = [];
+            res.data.forEach((item, index) => {
+              data[index] = {
+                unit: item.wpid,
+                five: item.wfz,
+                fives: item.wfzfwl,
+                ten: item.sfz,
+                tens: item.sfzfwl,
+                fifteen: item.swfz,
+                fifteens: item.swfzfwl,
+                twenty: item.esfz,
+                twentys: item.esfzfwl,
+                is_light: false
+              };
+            });
+            that.tableData.data = data;
+          }
+        }
+      });
+    },
+    BeginChange(vl) {
+      this.value1 = vl;
+    },
+    EndChange(vl) {
+      this.value2 = vl;
+    },
+    // 计算事件
+    handleSubmit() {
+      if (this.value1 == "" || this.value1 == null) {
+        this.$message.error("请选择开始时间");
+      } else if (this.value2 == "" || this.value2 == null) {
+        this.$message.error("请选择结束时间");
+      } else {
+        this.getTable();
+      }
+    },
+    // 默认开始时间
+    getTime(val) {
+      //时间戳处理，val=1是默认开始时间（当前月第一天），val=2是默认结束时间（今天）
+      var date = new Date();
+      var year = date.getFullYear(),
+        month = date.getMonth() + 1,
+        day = date.getDate();
+      month >= 1 && month <= 9 ? (month = "0" + month) : "";
+      day >= 0 && day <= 9 ? (day = "0" + day) : "";
+      var begin = year + "-" + month + "-01";
+      var end = year + "-" + month + "-" + day;
+      if (val == 1) {
+        return begin;
+      } else if (val == 2) {
+        return end;
+      }
+    }
+  }
+};
+</script>
+<style lang="less" scope>
+@titleGray: #9ca5a8;
+@rowGray: #606769;
+@darkBack: #536268;
+</style>

src/views/Decision/slgl/xqjsl.vue

@@ -0,0 +1,165 @@
+<template>
+  <div>
+    <div class="query mg-b-8">
+      <div class="query-items">
+        <div class="query-item">
+          <div class="lable">开始日期：</div>
+          <div class="search-input">
+            <el-date-picker
+              v-model="value1"
+              @change="BeginChange(value1)"
+              type="date"
+              value-format="YYYY-MM-DD"
+              placeholder="选择日期"
+              popper-class="date-select"
+            >
+            </el-date-picker>
+          </div>
+        </div>
+        <div class="query-item">
+          <div class="lable">结束日期：</div>
+          <div class="search-input">
+            <el-date-picker
+              v-model="value2"
+              @change="EndChange(value2)"
+              type="date"
+              value-format="YYYY-MM-DD"
+              placeholder="选择日期"
+              popper-class="date-select"
+            >
+            </el-date-picker>
+            <div class="unit svg-icon svg-icon-gray">
+              <svg-icon :svgid="''" />
+            </div>
+          </div>
+        </div>
+      </div>
+      <div class="query-actions">
+        <button class="btn green" @click="handleSubmit">计算</button>
+      </div>
+    </div>
+    <div class="table-box">
+      <ComTable
+        :data="tableData"
+        :pageSize="20"
+        height="85vh"
+        v-loading="tableLoading"
+        element-loading-text="拼命加载中"
+        element-loading-background="rgba(0, 0, 0, 0.8)"
+      ></ComTable>
+    </div>
+  </div>
+</template>
+
+<script>
+import ComTable from "@/components/coms/table/table.vue";
+export default {
+  name: "fwjsl",
+  components: { ComTable },
+  data() {
+    return {
+      value1: "",
+      value2: "",
+      tableLoading: true,
+      tableData: {
+        column: [
+          {
+            name: "风电场",
+            field: "wpid",
+            is_num: false,
+            is_light: false,
+            sortable: true
+          },
+          {
+            name: "故障次数",
+            field: "gzCount",
+            is_num: false,
+            is_light: false,
+            sortable: true
+          },
+          {
+            name: "消缺及时次数",
+            field: "xqCount",
+            is_num: false,
+            is_light: false,
+            sortable: true
+          },
+          {
+            name: "消缺及时次数",
+            field: "xqjsl",
+            is_num: false,
+            is_light: false,
+            sortable: true
+          }
+        ],
+        date: []
+      }
+    };
+  },
+  mounted() {
+    this.getTable();
+  },
+  created() {
+    this.value1 = this.getTime(1);
+    this.value2 = this.getTime(2);
+  },
+  methods: {
+    // 获取表格数据
+    getTable() {
+      let that = this;
+      that.tableLoading = true;
+      that.API.requestData({
+        method: "GET",
+        baseURL: "http://10.155.32.4:8034/",
+        subUrl: "/threerate/xqjsl",
+        data: {
+          beginDate: this.value1,
+          endDate: this.value2
+        },
+        success(res) {
+          that.tableLoading = false;
+          console.log(res);
+          if (res.code === 200) {
+            that.tableData.data = res.data;
+          }
+        }
+      });
+    },
+    // 开始日期：
+    BeginChange(vl) {
+      this.value1 = vl;
+    },
+    // 结束日期
+    EndChange(vl) {
+      this.value1 = vl;
+    },
+    //   计算
+    handleSubmit() {
+      if (this.value1 == "" || this.value1 == null) {
+        this.$message.error("请选择开始时间");
+      } else if (this.value2 == "" || this.value2 == null) {
+        this.$message.error("请选择结束时间");
+      } else {
+        this.getTable();
+      }
+    },
+    // 默认开始时间
+    getTime(val) {
+      //时间戳处理，val=1是默认开始时间（当前月第一天），val=2是默认结束时间（今天）
+      var date = new Date();
+      var year = date.getFullYear(),
+          month = date.getMonth() + 1,
+          day = date.getDate();
+          month >= 1 && month <= 9 ? (month = "0" + month) : "";
+          day >= 0 && day <= 9 ? (day = "0" + day) : "";
+      var begin = year + "-" + month + "-01";
+      var end = year + "-" + month + "-" + day;
+      if (val == 1) {
+        return begin;
+      } else if (val == 2) {
+        return end;
+      }
+    }
+  }
+};
+</script>

src/views/Decision/slgl/ztzhl.vue

@@ -0,0 +1,294 @@
+<template>
+  <div>
+    <div class="query mg-b-8">
+      <div class="query-items">
+        <div class="query-item">
+          <div class="lable">开始日期：</div>
+          <div class="search-input">
+            <el-date-picker
+              v-model="value1"
+              @change="BeginChange(value1)"
+              type="date"
+              value-format="YYYY-MM-DD"
+              placeholder="选择日期"
+              popper-class="date-select"
+            >
+            </el-date-picker>
+          </div>
+        </div>
+        <div class="query-item">
+          <div class="lable">结束日期：</div>
+          <div class="search-input">
+            <el-date-picker
+              v-model="value2"
+              @change="EndChange(value2)"
+              type="date"
+              value-format="YYYY-MM-DD"
+              placeholder="选择日期"
+              popper-class="date-select"
+            >
+            </el-date-picker>
+            <div class="unit svg-icon svg-icon-gray">
+              <svg-icon :svgid="''" />
+            </div>
+          </div>
+        </div>
+        <div class="query-item">
+          <div class="lable">风速：</div>
+          <div
+            class="newspan"
+            v-for="(item, index) of optionData"
+            :key="index"
+            :class="{ active: cur == index }"
+            @click="handleOpen(item, index)"
+          >
+            {{ item }}
+          </div>
+        </div>
+      </div>
+      <div class="query-actions">
+        <button class="btn green" @click="handleSubmit">计算</button>
+      </div>
+    </div>
+    <div class="table-box">
+      <div class="title">{{ vshows }}</div>
+      <ComTable
+        :data="tableData"
+        :pageSize="20"
+        height="84vh"
+        v-loading="tableLoading"
+        element-loading-text="拼命加载中"
+        element-loading-background="rgba(0, 0, 0, 0.8)"
+      ></ComTable>
+    </div>
+  </div>
+</template>
+<script>
+import ComTable from "@/components/coms/table/table.vue";
+export default {
+  name: "ztzhl",
+  components: { ComTable },
+  data() {
+    return {
+      value1: "",
+      value2: "",
+      value3: "",
+      tableLoading: true,
+      optionData: ["小于3米风速", "大于3米风速", "大于4米风速"],
+      cur: 0,
+      vshows: "小于3米风速",
+      tableData: {
+        column: [
+          {
+            name: "单位",
+            field: "wpid",
+            is_num: false,
+            is_light: false,
+            sortable: true
+          },
+          {
+            name: "5分钟",
+            field: "wfz",
+            is_num: false,
+            is_light: false,
+            sortable: true
+          },
+          {
+            name: "5分钟",
+            field: "wfzfwl",
+            is_num: false,
+            is_light: false,
+            sortable: true
+          },
+          {
+            name: "10分钟",
+            field: "sfz",
+            is_num: false,
+            is_light: false,
+            sortable: true
+          },
+          {
+            name: "10分钟",
+            field: "sfzfwl",
+            is_num: false,
+            is_light: false,
+            sortable: true
+          },
+          {
+            name: "15分钟",
+            field: "swfz",
+            is_num: false,
+            is_light: false,
+            sortable: true
+          },
+          {
+            name: "15分钟",
+            field: "swfzfwl",
+            is_num: false,
+            is_light: false,
+            sortable: true
+          },
+          {
+            name: "20分钟",
+            field: "esfz",
+            is_num: false,
+            is_light: false,
+            sortable: true
+          },
+          {
+            name: "20分钟",
+            field: "esfzfwl",
+            is_num: false,
+            is_light: false,
+            sortable: true
+          }
+        ],
+        data: []
+      }
+    };
+  },
+  mounted() {
+    //   获取表格数据
+    this.getTable();
+  },
+  created() {
+    this.value1 = this.getTime(1);
+    this.value2 = this.getTime(2);
+  },
+  methods: {
+    //   获取表格数据
+    getTable() {
+      let that = this;
+      that.tableLoading = true;
+      that.API.requestData({
+        method: "GET",
+        baseURL: "http://10.155.32.4:8034/",
+        subUrl: "/threerate/ztzhl",
+        data: {
+          beginDate: this.value1,
+          endDate: this.value2
+        },
+        success(res) {
+          that.tableLoading = false;
+          const vs = that.vshows;
+          if (res.code === 200) {
+            if (vs == "小于3米风速") {
+              that.tableData.data = res.data.小于3米风速;
+            } else if (vs == "大于3米风速") {
+              that.tableData.data = res.data.大于3米风速;
+            } else {
+              that.tableData.data = res.data.大于4米风速;
+            }
+          }
+        }
+      });
+    },
+    BeginChange(vl) {
+      this.value1 = vl;
+    },
+    EndChange(vl) {
+      this.value2 = vl;
+    },
+    // 计算事件
+    handleSubmit() {
+      this.vshows = "小于3米风速";
+      this.cur = 0;
+      if (this.value1 == "" || this.value1 == null) {
+        this.$message.error("请选择开始时间");
+      } else if (this.value2 == "" || this.value2 == null) {
+        this.$message.error("请选择结束时间");
+      } else {
+        this.getTable();
+      }
+    },
+    // 默认开始时间
+    getTime(val) {
+      //时间戳处理，val=1是默认开始时间（当前月第一天），val=2是默认结束时间（今天）
+      var date = new Date();
+      var year = date.getFullYear(),
+        month = date.getMonth() + 1,
+        day = date.getDate();
+      month >= 1 && month <= 9 ? (month = "0" + month) : "";
+      day >= 0 && day <= 9 ? (day = "0" + day) : "";
+      var begin = year + "-" + month + "-01";
+      var end = year + "-" + month + "-" + day;
+      if (val == 1) {
+        return begin;
+      } else if (val == 2) {
+        return end;
+      }
+    },
+    handleOpen(vl, index) {
+      this.vshows = "小于3米风速";
+      this.$nextTick(() => {
+        this.cur = index;
+        this.vshows = vl;
+        this.getTable();
+      });
+    }
+  }
+};
+</script>
+<style scoped>
+.newsDiv {
+  color: rgba(255, 255, 255, 0.75);
+  background-color: rgba(255, 255, 255, 0.1);
+  margin-bottom: 8px;
+  line-height: 3.4259vh;
+  padding: 0 15px;
+}
+.newspan {
+  line-height: 30px;
+  cursor: pointer;
+  padding: 0 1vw;
+  margin: 0 2px;
+  color: #9ca5a8;
+  transition: color 0.2s ease-in-out;
+  position: relative;
+}
+.newspan:hover {
+  background: linear-gradient(
+    to top,
+    rgba(5, 187, 76, 0.5),
+    rgba(5, 187, 76, 0)
+  );
+  color: white;
+  position: relative;
+}
+.newspan:hover::after {
+  content: "";
+  position: absolute;
+  width: 100%;
+  height: 0.463vh;
+  border: 0.093vh solid #05bb4c;
+  border-top: 0;
+  left: 0;
+  bottom: 0;
+  box-sizing: border-box;
+}
+.active {
+  background: linear-gradient(
+    to top,
+    rgba(5, 187, 76, 0.5),
+    rgba(5, 187, 76, 0)
+  );
+  color: white;
+  position: relative;
+}
+.active::after {
+  content: "";
+  position: absolute;
+  width: 100%;
+  height: 0.463vh;
+  border: 0.093vh solid #05bb4c;
+  border-top: 0;
+  left: 0;
+  bottom: 0;
+  box-sizing: border-box;
+}
+.title {
+  background: rgba(255, 255, 255, 0.1);
+  margin-bottom: 8px;
+  padding: 1vh;
+}
+</style>

src/views/layout/Menu.vue

@@ -301,6 +301,29 @@ export default {
                   path: "/warningRank",
                 }
               ]
+            },
+            // 三率管理
+            {
+              text:'三率管理',
+              icon:'svg-matrix',
+              path:'/slgl',
+              children:[
+                {
+                  text:'复位及时率',
+                  icon:'svg-wind-site',
+                  path:'/fwjsl'
+                },
+                {
+                  text:'状态转换率',
+                  icon:'svg-wind-site',
+                  path:'/ztzhl'
+                },
+                {
+                  text:'消缺及时率',
+                  icon:'svg-wind-site',
+                  path:'/xqjsl'
+                }
+              ]
             }
           ],
         },