内容

whychdw

2021-09-27 8b06189e8fc61a9c07298885c4517c2548ea103a

内容

 src/assets/js/apis/dcdc/index.js

@@ -132,4 +132,48 @@
            data: 'json=' + JSON.stringify(data),
        });
    },

    // 查询所有模板
    searchTplAll() {
        // 请求后台查询内容
        return axios({
            method: 'post',
            url: 'EleTmpAction!searchAll',
            data: null,
        });
    },
    // 添加模板
    addTpl(tmp_name) {
        // 请求后台查询内容
        return axios({
            method: 'post',
            url: 'EleTmpAction!add',
            data: "json=" + JSON.stringify({
                tmp_name,
            }),
        });
    },
    // 编辑模板
    editTpl(tmp_id, tmp_name) {
        // 请求后台查询内容
        return axios({
            method: 'post',
            url: 'EleTmpAction!update',
            data: "json=" + JSON.stringify({
                tmp_id,
                tmp_name,
            }),
        });
    },
    // 删除模板
    delTpl(tmp_id) {
        // 请求后台查询内容
        return axios({
            method: 'post',
            url: 'EleTmpAction!del',
            data: "json=" + JSON.stringify({
                tmp_id,
            }),
        });
    },
};

 src/assets/js/apis/userMager/userInfo.js

@@ -90,12 +90,12 @@
        });

    },
    getUserLoginInfo() {
    getUserLoginInfo(uid) {
        return axios({
            method: 'post',
            url: 'User_infAction!searchSnIdByUId',
            data: 'json=' + JSON.stringify({
                UId: 1002
                UId: uid ? uid : 1002,
            }),
        });
    }

 src/assets/js/tools/getPageMenu.js

@@ -167,6 +167,17 @@
                    level: 2,
                },
                {
                    label: "电价分布模板管理",
                    name: "electricityPriceDistributionTemplate",
                    src: "#/dataMager/elePriceDistributionTpl",
                    closable: true,
                    id: 3011,
                    menuId: 3,
                    enableduse: true,
                    ord: 11,
                    level: 2,
                },
                {
                    label: "机房定位信息管理",
                    name: "homeAddressInfoManage",
                    src: "#/dataMager/homeAddressInfoManage",
@@ -273,7 +284,7 @@
                    level: 2,
                }

                // 最大ord=10
                // 最大ord=11
            ]
        },
        {

 src/assets/js/tools/noRepeat.js

New file
@@ -0,0 +1,9 @@
/**
 * 数组去重
 *
 * @param   {Array}  arr  [去重前的数组
 *
 * @return  {Array}        去重后的数组
 */
function noRepeat(arr) {
}

 src/components/chart/elePriceBar.vue

New file
@@ -0,0 +1,193 @@
<template>
  <div class="e-chart-root">
    <div class="e-chart-container">
      <div class="e-chart" ref="chart"></div>
    </div>
  </div>
</template>

<script>
// 引入 ECharts 主模块
import ECharts from "echarts";
// 引入自定义主题
import "./theme/transparent";
export default {
  chart: "",
  data() {
    return {};
  },
  methods: {
    setOption(option) {
      let chart = this.$options.chart;
      if (chart) {
        chart.setOption(option);
      }
    },
    setData(config) {
      let data = config.data;
      let option = this.getInitOption(config);
      option.series[0].data = data;

      this.setOption(option);
    },
    renderItem(params, api) {
      let yValue = api.value(2);
      let start = api.coord([api.value(0), yValue]);
      let size = api.size([api.value(1) - api.value(0), yValue]);
      let style = api.style();

      return {
        type: "rect",
        shape: {
          x: start[0],
          y: start[1],
          width: size[0],
          height: size[1],
        },
        style: style,
      };
    },
    getInitOption(config) {
      let renderItem = this.renderItem;
      let initData = config.initData;
      let title = config.title;

      // 返回配置
      return {
        animation: false,
        title: {
          text: title,
          left: "center",
        },
        grid: {
          left: "16px",
          top: "32px",
          right: "16px",
          bottom: "8px",
          containLabel: true,
        },
        tooltip: {},
        xAxis: {
          name: "",
          type: "value",
          splitNumber: 24,
          splitLine: {
            show: false,
          },
        },
        yAxis: {
          name: "Y（元/度）",
          min: initData ? 0 : null,
          max: initData ? 0 : null,
        },
        series: [
          {
            type: "custom",
            renderItem: renderItem,
            label: {
              show: true,
              position: "top",
            },
            encode: {
              x: [0, 1],
              y: 2,
              tooltip: [2],
              itemName: 3,
            },
            data: [],
          },
        ],
      };
    },
    resize() {
      let chart = this.$options.chart;
      if (chart) {
        chart.resize();
      }
    },
    /**
     * 销毁echarts实例释放内存
     *
     * @return  {[type]}  [return description]
     */
    dispose() {
      let chart = this.$options.chart;
      if (chart) {
        chart.dispose(); // 销毁实例
        this.$options.chart = "";
      }
    },
  },
  mounted() {
    this.$options.chart = ECharts.init(this.$refs.chart, "transparent");

    // 默认数据
    let config = {
      initData: true, // 是否为初始化数据
      title: "",
      data: [
        {
          value: [0, 24, "", "电费"],
          itemStyle: {
            color: new ECharts.graphic.LinearGradient(0, 0, 0, 1, [
              { offset: 0, color: "#DEE1D7" },
              { offset: 1, color: "#B8CFD7" },
            ]),
          },
        },
      ],
    };
    // 设置数据
    this.setData(config);

    // 监听windows窗口的缩放,绑定resize事件
    window.addEventListener("resize", this.resize);
  },
  beforeDestroy() {
    // 销毁resize事件
    window.removeEventListener("resize", this.resize);
    this.dispose();
  },
};
</script>

<style scoped>
.e-chart-root,
.e-chart-container,
.e-chart {
  height: 100%;
  box-sizing: border-box;
}

.e-chart-root.full-screen .e-chart-container {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-size: 100% 100%;
  z-index: 9999;
}

.e-chart-tools {
  position: absolute;
  top: 16px;
  right: 16px;
  z-index: 9;
}

.e-chart-tools .iconfont {
  margin-left: 8px;
  font-size: 24px;
  cursor: pointer;
  color: #00fefe;
}

.e-chart-tools .iconfont:hover {
  color: #04b1b1;
}

.e-chart-tools .iconfont:active {
  color: #ff0000;
}
</style>

 src/pages/dataMager/components/UpdateElePrice.vue

New file
@@ -0,0 +1,90 @@
<template>
  <div class="params-dialog table-container">
    <el-timeline>
      <el-timeline-item
        v-for="(item, key) in list"
        :key="'key' + key"
        :timestamp="item.time"
        placement="top"
      >
        <el-card size="mini">
          <p>电费：{{ item.price }}元/度</p>
        </el-card>
      </el-timeline-item>
      <el-timeline-item timestamp="23:59:59" placement="top"></el-timeline-item>
    </el-timeline>
    <div class="form-footer">
      <three-btn @click="getFormatList">确认更新</three-btn></three-btn></three-btn></three-btn>
    </div>
  </div>
</template>

<script>
export default {
  props: {
    tmpId: {
      type: [String, Number],
      default: 0,
    },
  },
  data() {
    return {
      list: [
        {
          time: "00:00:00",
          price: 15,
        },
        {
          time: "10:00:00",
          price: 8,
        },
        {
          time: "15:00:00",
          price: 6,
        },
      ],
    };
  },
  methods: {
    getFormatList() {
      let list = this.list;
      let tmp_id = this.tmpId;
      let result = [];
      for (let i = 0; i < list.length; i++) {
        let item = list[i];
        let tmp = {
          tmp_id,
          tmp_starttime: item.time,
          ele_price: item.price,
        };

        // 最后一笔
        if (i == list.length - 1) {
          tmp.tmp_stoptime = "23:59:59";
        } else {
          tmp.tmp_stoptime = list[i + 1].time;
        }

        // 添加数据
        result.push(tmp);
      }

      console.log(result);
    },
  },
};
</script>

<style scoped>
.table-container {
  width: 640px;
  max-height: 500px;
  box-sizing: border-box;
  padding: 8px;
  background-color: #ffffff;
}
.form-footer {
  margin-top: 0;
  margin-bottom: 0;
}
</style>

 src/pages/dataMager/ele-price-distribution-tpl.vue

New file
@@ -0,0 +1,233 @@
<template>
  <flex-layout no-bg>
    <div class="page-layout-box box-top">
      <flex-box size="mini" title="电价分布图">
        <div slot="tools">
          <el-select
            class="el-select-layout"
            v-model="tmp_id"
            size="mini"
            placeholder="请选择模板"
          >
            <el-option
              v-for="(item, key) in tmpList"
              :key="'tmp' + key"
              :label="item.label"
              :value="item.value"
            ></el-option>
          </el-select>
          <el-button size="mini" type="primary" @click="addTpl">
            添加模板
          </el-button>
          <el-button size="mini" type="warning" @click="editTpl">
            编辑模板
          </el-button>
          <el-button size="mini" type="danger" @click="delTpl">
            删除模板
          </el-button>
          <el-button size="mini" type="success" @click="showUpdatePriceDialog">
            更新电价
          </el-button>
        </div>
        <ele-price-bar></ele-price-bar>
      </flex-box>
    </div>
    <div class="page-layout-box box-bottom">
      <flex-box size="mini" title="电价分布数据图">
        <el-table stripe size="small" :data="data" height="100%">
          <el-table-column
            prop="tplName"
            align="center"
            label="模板名称"
            :min-width="200"
          ></el-table-column>
          <el-table-column
            prop="start_time"
            align="center"
            label="开始时间"
            :min-width="200"
          ></el-table-column>
          <el-table-column
            prop="end_time"
            align="center"
            label="结束时间"
            :min-width="200"
          ></el-table-column>
          <el-table-column
            prop="price"
            align="center"
            label="电费(元/度)"
            :min-width="120"
          ></el-table-column>
        </el-table>
      </flex-box>
    </div>
    <el-dialog
      title="更新电价"
      width="auto"
      :visible.sync="updatePriceDialog"
      :close-on-click-modal="false"
      top="0"
      class="dialog-center"
      :modal-append-to-body="false"
    >
      <update-ele-price :tmp-id="tmp_id"></update-ele-price>
    </el-dialog>
  </flex-layout>
</template>

<script>
import FlexBox from "@/components/FlexBox.vue";
import ElePriceBar from "@/components/chart/elePriceBar.vue";
import getItemByKey from "@/assets/js/tools/getItemByKey";
import UpdateElePrice from "./components/UpdateElePrice.vue";
export default {
  components: {
    FlexBox,
    ElePriceBar,
    UpdateElePrice,
  },
  data() {
    return {
      updatePriceDialog: false,
      data: [],
      tmp_id: "",
      tmpList: [],
    };
  },
  methods: {
    searchTplAll() {
      this.$apis.dcdc
        .searchTplAll()
        .then((res) => {
          let rs = JSON.parse(res.data.result);
          let data = [];
          if (rs.code == 1) {
            data = rs.data;
          }

          // 更新模板列表
          this.tmpList = data.map((item) => {
            item.key = item.tmp_id;
            item.value = item.tmp_id;
            item.label = item.tmp_name;
            return item;
          });
        })
        .catch((error) => {
          console.log(error);
        });
    },
    addTpl() {
      this.$prompt("请输入模板名称", "系统提示-添加", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        inputPattern: /.+/,
        inputErrorMessage: "不能为空",
      })
        .then(({ value }) => {
          this.$apis.dcdc
            .addTpl(value)
            .then((res) => {
              let rs = JSON.parse(res.data.result);
              if (rs.code == 1) {
                this.tmp_id = rs.data[0].tmp_id;
              }
              this.$layer.msg(rs.msg);

              this.searchTplAll();
            })
            .cacth((error) => {
              this.$layer.msg("网路请求异常！");
            });
        })
        .catch(() => {});
    },
    editTpl() {
      let item = getItemByKey(this.tmp_id, this.tmpList, "");
      if (!item) {
        this.$layer.msg("未获取到模板信息");
        return;
      }
      this.$prompt("请输入模板名称", "系统提示-编辑", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        inputPattern: /.+/,
        inputErrorMessage: "不能为空",
        inputValue: item.label,
      })
        .then(({ value }) => {
          this.$apis.dcdc
            .editTpl(item.value, value)
            .then((res) => {
              let rs = JSON.parse(res.data.result);
              this.$layer.msg(rs.msg);

              this.searchTplAll();
            })
            .cacth((error) => {
              this.$layer.msg("网路请求异常！");
            });
        })
        .catch(() => {});
    },
    delTpl() {
      let tmp_id = this.tmp_id;
      if (!tmp_id) {
        this.$layer.msg("未获取到模板信息");
        return;
      }
      this.$confirm("确定删除模板", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          this.$apis.dcdc
            .delTpl(tmp_id)
            .then((res) => {
              let rs = JSON.parse(res.data.result);
              this.$layer.msg(rs.msg);
              this.tmp_id = "";
              this.searchTplAll();
            })
            .cacth((error) => {
              this.$layer.msg("网路请求异常！");
            });
        })
        .catch(() => {});
    },
    showUpdatePriceDialog() {
      let tmp_id = this.tmp_id;
      if (!tmp_id) {
        this.$layer.msg("未获取到模板信息");
        return;
      }
      this.updatePriceDialog = true;
    },
  },
  computed: {},
  mounted() {
    // 查询所有的模板
    this.searchTplAll();
  },
  beforeDestroy() {},
};
</script>

<style scoped>
.page-layout-box {
  box-sizing: border-box;
}
.box-top {
  padding: 0 8px 8px 8px;
  height: 50%;
}
.box-bottom {
  padding: 8px 8px 0 8px;
  height: 50%;
}
.el-select-layout {
  margin-right: 8px;
}
</style>

 src/pages/dataTest/realTime.vue

@@ -161,7 +161,7 @@
                  </li>
                  <li class="hdw-menu-item" v-if="isLithium">
                    <a @click="workPlanDialog = true" href="javascript:void(0);"
                      >消峰填谷计划</a
                      >削峰填谷计划</a
                    >
                  </li>
                  <li class="hdw-menu-item" v-if="isShowJunHeng">
@@ -750,9 +750,9 @@
      ></dc-work-params>
    </el-dialog>

    <!-- 锂电池消峰填谷 -->
    <!-- 锂电池削峰填谷 -->
    <el-dialog
      title="消峰填谷计划"
      title="削峰填谷计划"
      width="auto"
      :visible.sync="workPlanDialog"
      :close-on-click-modal="false"

 src/pages/home.vue

@@ -34,7 +34,8 @@
      </el-tabs>
    </div>
    <div slot="footer">
      <marqueeLeft :sendVal="newItems"></marqueeLeft>
      <marqueeLeft :sendVal="newItems" v-if="showMarqueeLeft"></marqueeLeft>
      <div class="no-warning-msg" v-else>最近24小时内无告警</div>
    </div>
    <el-drawer
      title="我是标题"
@@ -73,9 +74,20 @@
    let menus = getPageMenu();
    let tabs = [menus[0]];
    let acTabs = "index";
    let pageInfo = this.$store.getters["user/pageName"];
    if (this.$store.state.user.autoLogin) {
      acTabs = "movingRingSysteRrealTime";
      tabs.push(menus[1].childrens[0]);
      let addMenu = "";

      // 校验菜单
      if (menus[pageInfo.m] && menus[pageInfo.m].childrens[pageInfo.c]) {
        addMenu = menus[pageInfo.m].childrens[pageInfo.c];
      }

      // 添加的菜单
      if (addMenu) {
        acTabs = addMenu.name;
        tabs.push(addMenu);
      }
    }
    return {
      newItems: [],
@@ -223,6 +235,13 @@
        });
    },
  },
  computed: {
    showMarqueeLeft() {
      return typeof this.newItems == "undefined" || this.newItems.length == 0
        ? false
        : true;
    },
  },
  mounted() {
    // 启动用户互斥登录模块
    this.checkUserLogin();
@@ -272,4 +291,12 @@
.show-drawer {
  transform: translateX(360px);
}
.no-warning-msg {
  overflow: hidden;
  color: #ffffff;
  font-size: 0.3rem;
  height: 40px;
  line-height: 40px;
  text-align: center;
}
</style>

 src/pages/login.vue

@@ -368,21 +368,31 @@
      //   })
      //   .catch((error) => {});
      let autoLogin = this.$route.query.autoLogin;
      let uid = this.$route.query.uid;
      let pageName = this.$route.query.pageName;
      if (autoLogin) {
        this.$apis.userMager.userInfo
          .getUserLoginInfo()
          .getUserLoginInfo(uid)
          .then((res) => {
            let rs = JSON.parse(res.data.result);
            if (rs.code == 1) {
              let data = rs.data;
              this.$store.dispatch("user/changeAutoLogin", 1);
              this.$store.dispatch("user/changePage", pageName);
              this.loginForm.username = data.UName;
              this.loginForm.password = data.USnId;
              this.normalLogin();
            } else {
              this.init();
            }
          })
          .catch((error) => {
            consoel.log(error);
            this.$notify.error({
              title: "错误",
              message: "输入信息无效，请手动登录！",
            });
            this.init();
            console.log(error);
          });
      }
      // let pattern = /(localhost)|(www\.sw-ht\.com)/;
@@ -413,6 +423,17 @@
          this.platformName = "蓄电池后台监控管理平台";
          sessionStorage.setItem("platformName", this.platformName);
        });
    },
    init() {
      // 初始化user的信息
      this.$store.commit("user/init");
      // 初始化登录状态
      sessionStorage.setItem("username", "");
      this.checkServeLicense();

      // 初始化置动
      this.$store.dispatch("user/changeAutoLogin", 0);
      this.$store.dispatch("user/changePage", "m1c0");
    },
  },
  computed: {
@@ -470,16 +491,14 @@
    },
  },
  mounted() {
    // 初始化user的信息
    this.$store.commit("user/init");
    // 初始化登录状态
    sessionStorage.setItem("username", "");
    this.checkServeLicense();

    this.$store.dispatch("user/changeAutoLogin", 0);

    let autoLogin = this.$route.query.autoLogin;
    if (autoLogin) {
    // 自动登录
    this.autoLogin();
    } else {
      // 初始化
      this.init();
    }
  },
};
</script>

 src/router/routes.js

@@ -157,6 +157,13 @@
    component: (resolve) => require(['../pages/dataMager/homeAddressInfoManage.vue'], resolve)
},
{
    path: '/dataMager/elePriceDistributionTpl',
    meta: {
        name: '电价分布模板管理'
    },
    component: (resolve) => require(['../pages/dataMager/ele-price-distribution-tpl.vue'], resolve)
},
{
    path: '/dataMager/produceTotal',
    name: 'produceTotal',
    meta: {

 src/store/modules/user.js

@@ -5,10 +5,31 @@
    state() {
        let permits = sessionStorage.getItem('permits');
        let autoLogin = Number(sessionStorage.getItem('autoLogin'));
        let pageName = sessionStorage.getItem('pageName');
        return {
            permits: permits?JSON.parse(permits):[],
            autoLogin: autoLogin?autoLogin:0,
            pageName: pageName ? pageName : "m1c0",
        };
    },
    getters: {
        pageName(state) {
            let reg = /^m[0-9]+c[0-9]+$/;
            console.log(reg.test(state.pageName));
            if (reg.test(state.pageName)) {
                let temp = state.pageName.replace("m", "").split("c");
                console.log(temp);
                return {
                    m: temp[0],
                    c: temp[1],
                };
            } else {
                return {
                    m: 1,
                    c: 0,
                };
        }
        },
    },
    mutations: {
        setPermits(state, data) {
@@ -21,6 +42,10 @@
        changeAutoLogin(state, autoLogin) {
            state.autoLogin = autoLogin;
            sessionStorage.setItem('autoLogin', autoLogin);
        },
        changePage(state, pageName) {
            state.pageName = pageName;
            sessionStorage.setItem('pageName', pageName);
        }
    },
    actions: {
@@ -35,5 +60,8 @@
        changeAutoLogin(context, autoLogin) {
            context.commit('changeAutoLogin', autoLogin);
        },
        changePage(context, pageName) {
            context.commit('changePage', pageName);
        }
    },
};