Merge branch 'projects/mescc/develop' into projects/mescc/zhp

2024-06-19 16:26:17 +08:00
parent c8bc54e04b a5d0970fa0
commit 15d3b3622c
24 changed files with 2724 additions and 1170 deletions
--- a/src/views/report/components/bmLineBar.vue
+++ b/src/views/report/components/bmLineBar.vue
@@ -2,12 +2,16 @@
  <div>
    <!-- 暂无数据 -->
    <div
-      class="no-data-bg"
-      style="position: relative; left: 50%; transform: translateX(-50%)"
-      v-show="this.chartMsg.series.length === 0"
-    ></div>
+      :style="{ height: chartHeight + 'px' }"
+      v-show="this.chartMsg.series[0].data.length === 0"
+    >
+      <div
+        class="no-data-bg"
+        style="position: relative; left: 50%; transform: translateX(-50%)"
+      ></div>
+    </div>
    <!-- 图例 -->
-    <div v-show="this.chartMsg.series.length > 0">
+    <div v-show="this.chartMsg.series[0].data.length > 0">
      <div class="legend">
        <span class="item" v-for="item in legendList" :key="item.id">
          <span
@@ -47,7 +51,7 @@ export default {
        color: [],
        // color: ["#8EF0AB", "#63BDFF", "#288AFF"],
        grid: {
-          left: 100,
+          left: 70,
          right: 10,
          bottom: 30,
          top: 30,
@@ -65,17 +69,41 @@ export default {
            for (var i = 0, l = params.length; i < l; i++) {
              res +=
                "<br/>" +
-                `<span style='display:inline-block;margin-right:4px;border-radius:10px;width:10px;height:10px;background-color:${params[i].color}'></span>` +
-                `<span style='display:inline-block;width:150px;color:rgba(0,0,0,0.8);font-size:14px;'>${params[i].seriesName}</span>` +
+                `${
+                  params[i].seriesType === "line"
+                    ? '<img width="10" height="10" style="margin-right:4px;" src="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB3aWR0aD0iMTIuNzIxNjM5NXB4IiBoZWlnaHQ9IjhweCIgdmlld0JveD0iMCAwIDEyLjcyMTYzOTUgOCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj4KICAgIDx0aXRsZT7nvJbnu4QgNjwvdGl0bGU+CiAgICA8ZyBpZD0iMDTmiqXooajnrqHnkIYiIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxnIGlkPSLmjIfmoIflrozmiJDmg4XlhrUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0xMDUxLjYzOTE4MCwgLTQyNS4wMDAwMDApIj4KICAgICAgICAgICAgPGcgaWQ9Iue8lue7hC025aSH5Lu9LTQiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEwMjEuNTAwMDAwLCAzNDQuMDAwMDAwKSI+CiAgICAgICAgICAgICAgICA8ZyBpZD0i57yW57uELTYiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDI5LjUwMDAwMCwgNzguMDAwMDAwKSI+CiAgICAgICAgICAgICAgICAgICAgPHJlY3QgaWQ9IuefqeW9oiIgeD0iMCIgeT0iMCIgd2lkdGg9IjE0IiBoZWlnaHQ9IjE0Ij48L3JlY3Q+CiAgICAgICAgICAgICAgICAgICAgPHBhdGggZD0iTTcuMTM5MTgwMjYsMyBDOS4wMDMxMDczNywzIDEwLjU2OTI2NzMsNC4yNzQ4OTI3MiAxMS4wMTMyMjU0LDYuMDAwMjQzNDcgTDEyLjM2MDgxOTcsNiBDMTIuOTEzMTA0NSw2IDEzLjM2MDgxOTcsNi40NDc3MTUyNSAxMy4zNjA4MTk3LDcgQzEzLjM2MDgxOTcsNy41NTIyODQ3NSAxMi45MTMxMDQ1LDggMTIuMzYwODE5Nyw4IEwxMS4wMTI5NjY3LDguMDAwNzYxMzQgQzEwLjU2ODY1OTIsOS43MjU2MDIyNCA5LjAwMjc0NTUxLDExIDcuMTM5MTgwMjYsMTEgQzUuMjc1NjE1MDEsMTEgMy43MDk3MDEzMSw5LjcyNTYwMjI0IDMuMjY1MzkzNzgsOC4wMDA3NjEzNCBMMS42MzkxODAyNiw4IEMxLjA4Njg5NTUxLDggMC42MzkxODAyNTgsNy41NTIyODQ3NSAwLjYzOTE4MDI1OCw3IEMwLjYzOTE4MDI1OCw2LjQ0NzcxNTI1IDEuMDg2ODk1NTEsNiAxLjYzOTE4MDI2LDYgTDMuMjY1MTM1MDksNi4wMDAyNDM0NyBDMy43MDkwOTMyLDQuMjc0ODkyNzIgNS4yNzUyNTMxNSwzIDcuMTM5MTgwMjYsMyBaIiBpZD0i5b2i54q257uT5ZCIIiBmaWxsPSIjRkZDRTZBIiBmaWxsLXJ1bGU9Im5vbnplcm8iPjwvcGF0aD4KICAgICAgICAgICAgICAgIDwvZz4KICAgICAgICAgICAgPC9nPgogICAgICAgIDwvZz4KICAgIDwvZz4KPC9zdmc+" />'
+                    : `<span style="display:inline-block;margin-right:4px;border-radius:2px;width:10px;height:10px;background-color:${params[i].color}"></span>`
+                }` +
+                `<span style='display:inline-block;width:180px;color:rgba(0,0,0,0.8);font-size:14px;'>${params[i].seriesName}</span>` +
                `<span style='color:rgba(0,0,0,0.48);font-size:14px;'>${
                  params[i].name === "%"
-                    ? (params[i].value ? params[i].value.toFixed(2) : 0.0) +
+                    ? (params[i].value ? params[i].value.toFixed(2) : "0.00") +
                      params[i].name
-                    : params[i].value
+                    : String(params[i].value).replace(
+                        /\B(?=(\d{3})+(?!\d))/g,
+                        ","
+                      )
                }</span>`;
            }
            return res;
          },
+          // formatter: function (params) {
+          //   console.log(params);
+          //   var res = `<span style='color:rgba(0,0,0,0.8)'>${params[0].axisValueLabel}</span>`;
+          //   for (var i = 0, l = params.length; i < l; i++) {
+          //     res +=
+          //       "<br/>" +
+          //       `<span style='display:inline-block;margin-right:4px;border-radius:2px;width:10px;height:10px;background-color:${params[i].color}'></span>` +
+          //       `<span style='display:inline-block;width:150px;color:rgba(0,0,0,0.8);font-size:14px;'>${params[i].seriesName}</span>` +
+          //       `<span style='color:rgba(0,0,0,0.48);font-size:14px;'>${
+          //         params[i].name === "%"
+          //           ? (params[i].value ? params[i].value.toFixed(2) : 0.0) +
+          //             params[i].name
+          //           : params[i].value
+          //       }</span>`;
+          //   }
+          //   return res;
+          // },
        },
        xAxis: {
          type: "category",
@@ -181,7 +209,9 @@ export default {
 </script>
 <style lang="scss" scoped>
 .legend {
-  text-align: right;
+  position: absolute;
+  right: 10px;
+  top: 15px;
  .item {
    display: inline-block;
    margin-right: 10px;
--- a/src/views/report/components/bmSearchBar.vue
+++ b/src/views/report/components/bmSearchBar.vue
@@ -16,41 +16,45 @@
        </el-option>
      </el-select>
    </el-form-item>
-    <el-form-item v-show="form.type === 1" label="时间" prop="dayTime">
+    <el-form-item v-show="form.type === 0" label="时间" prop="dayTime">
      <el-date-picker
        size="small"
        clearable
        v-model="form.dayTime"
        type="date"
        placeholder="选择日期"
+        value-format="yyyy-MM-dd"
        style="width: 150px"
      >
      </el-date-picker>
    </el-form-item>
-    <el-form-item v-show="form.type === 2" label="时间" prop="weekTime">
+    <el-form-item v-show="form.type === 1" label="时间" prop="weekTime">
      <el-date-picker
        v-model="form.weekTime"
        type="week"
-        format="yyyy 第 WW 周"
+        format="yyyy-MM-dd"
        placeholder="选择周"
+        value-format="yyyy-MM-dd"
        style="width: 150px"
      >
      </el-date-picker>
    </el-form-item>
-    <el-form-item v-show="form.type === 3" label="时间" prop="monthTime">
+    <el-form-item v-show="form.type === 2" label="时间" prop="monthTime">
      <el-date-picker
        v-model="form.monthTime"
        type="month"
        placeholder="选择月份"
+        value-format="yyyy-MM-dd"
        style="width: 150px"
      >
      </el-date-picker>
    </el-form-item>
-    <el-form-item v-show="form.type === 4" label="时间" prop="yearTime">
+    <el-form-item v-show="form.type === 3" label="时间" prop="yearTime">
      <el-date-picker
        v-model="form.yearTime"
        type="year"
        placeholder="选择年份"
+        value-format="yyyy-MM-dd"
        style="width: 150px"
      >
      </el-date-picker>
@@ -73,48 +77,73 @@
      </el-select>
    </el-form-item>
    <el-form-item>
-      <el-button type="primary" size="small" @click="getDataList"
+      <el-button type="primary" size="small" @click="getDataList('search')"
        >查询</el-button
      >
      <el-divider direction="vertical"></el-divider>
-      <el-button type="primary" size="small" plain @click="handleExport"
+      <el-button
+        type="primary"
+        size="small"
+        plain
+        @click="getDataList('export')"
        >导出</el-button
      >
    </el-form-item>
  </el-form>
 </template>
 <script>
+import moment from "moment";
 export default {
  name: "bmSearchBar",
  data() {
    return {
      form: {
-        type: 1,
-        dayTime: "",
-        weekTime: "",
-        monthTime: "",
-        yearTime: "",
-        factory: "",
+        type: 2,
+        dayTime: moment().format("yyyy-MM-DD"),
+        weekTime: moment().format("yyyy-MM-DD"),
+        monthTime: moment().format("yyyy-MM-DD"),
+        yearTime: moment().format("yyyy-MM-DD"),
+        factory: [],
      },
      typeList: [
-        { id: 1, name: "日" },
-        { id: 2, name: "周" },
-        { id: 3, name: "月" },
-        { id: 4, name: "年" },
+        { id: 0, name: "日" },
+        { id: 1, name: "周" },
+        { id: 2, name: "月" },
+        { id: 3, name: "年" },
      ],
      factoryList: [
-        { id: 1, name: "瑞昌" },
-        { id: 2, name: "邯郸" },
+        { id: 0, name: "瑞昌" },
+        { id: 1, name: "邯郸" },
      ],
    };
  },
  methods: {
-    getDataList() {
+    getDataList(val) {
      console.log(this.form);
-      this.$emit("getSearch", this.form);
-    },
-    handleExport() {
-      this.$emit("handleExport");
+      let params = {};
+      params.factory = this.form.factory;
+      switch (this.form.type) {
+        case 0:
+          params.startDate = this.form.dayTime;
+          break;
+        case 1:
+          params.startDate = this.form.weekTime;
+          break;
+        case 2:
+          params.startDate = this.form.monthTime;
+          break;
+        case 3:
+          params.startDate = this.form.yearTime;
+          break;
+        default:
+          break;
+      }
+      params.type = this.form.type;
+      if (val === "search") {
+        this.$emit("getSearch", params);
+      } else {
+        this.$emit("handleExport", params);
+      }
    },
  },
 };