Merge branch 'dev' into sit

src/common/echart/index.vue

@@ -4,9 +4,11 @@
 
 <script>
 import tdTheme from './theme.json' // 引入默认主题
+import themeCopy from './themeCopy.json' // 引入默认主题
 import '../map/fujian.js'
 
 export default {
+  
   name: 'echart',
   props: {
     className: {
@@ -45,6 +47,17 @@ export default {
     }
   },
   mounted () {
+    console.log(this.$route.name == "newDatavScr")
+
+    //由于现在开发新的数据大屏、主题冲突了，暂时判断一下路由来源、作为主题切换
+    if(this.$route.name == "newDatavScr"){
+      this.$echarts.registerTheme('tdTheme', themeCopy); // 修改默认主题
+
+      this.initChart();
+      return;
+    }
+
+
     this.$echarts.registerTheme('tdTheme', tdTheme); // 覆盖默认主题
     this.initChart();
   },

src/common/echart/themeCopy.json

@@ -0,0 +1,490 @@
+{
+  "color": [
+    "#2d8cf0",
+    "#19be6b",
+    "#ff9900",
+    "#E46CBB",
+    "#9A66E4",
+    "#ed3f14"
+  ],
+  "backgroundColor": "rgba(0,0,0,0)",
+  "textStyle": {},
+  "title": {
+    "textStyle": {
+      "color": "#516b91"
+    },
+    "subtextStyle": {
+      "color": "#93b7e3"
+    }
+  },
+  "line": {
+    "itemStyle": {
+      "normal": {
+        "borderWidth": "2"
+      }
+    },
+    "lineStyle": {
+      "normal": {
+        "width": "2"
+      }
+    },
+    "symbolSize": "6",
+    "symbol": "emptyCircle",
+    "smooth": true
+  },
+  "radar": {
+    "itemStyle": {
+      "normal": {
+        "borderWidth": "2"
+      }
+    },
+    "lineStyle": {
+      "normal": {
+        "width": "2"
+      }
+    },
+    "symbolSize": "6",
+    "symbol": "emptyCircle",
+    "smooth": true
+  },
+  "bar": {
+    "itemStyle": {
+      "normal": {
+        "barBorderWidth": 0,
+        "barBorderColor": "#ccc"
+      },
+      "emphasis": {
+        "barBorderWidth": 0,
+        "barBorderColor": "#ccc"
+      }
+    }
+  },
+  "pie": {
+    "itemStyle": {
+      "normal": {
+        "borderWidth": 0,
+        "borderColor": "#ccc"
+      },
+      "emphasis": {
+        "borderWidth": 0,
+        "borderColor": "#ccc"
+      }
+    }
+  },
+  "scatter": {
+    "itemStyle": {
+      "normal": {
+        "borderWidth": 0,
+        "borderColor": "#ccc"
+      },
+      "emphasis": {
+        "borderWidth": 0,
+        "borderColor": "#ccc"
+      }
+    }
+  },
+  "boxplot": {
+    "itemStyle": {
+      "normal": {
+        "borderWidth": 0,
+        "borderColor": "#ccc"
+      },
+      "emphasis": {
+        "borderWidth": 0,
+        "borderColor": "#ccc"
+      }
+    }
+  },
+  "parallel": {
+    "itemStyle": {
+      "normal": {
+        "borderWidth": 0,
+        "borderColor": "#ccc"
+      },
+      "emphasis": {
+        "borderWidth": 0,
+        "borderColor": "#ccc"
+      }
+    }
+  },
+  "sankey": {
+    "itemStyle": {
+      "normal": {
+        "borderWidth": 0,
+        "borderColor": "#ccc"
+      },
+      "emphasis": {
+        "borderWidth": 0,
+        "borderColor": "#ccc"
+      }
+    }
+  },
+  "funnel": {
+    "itemStyle": {
+      "normal": {
+        "borderWidth": 0,
+        "borderColor": "#ccc"
+      },
+      "emphasis": {
+        "borderWidth": 0,
+        "borderColor": "#ccc"
+      }
+    }
+  },
+  "gauge": {
+    "itemStyle": {
+      "normal": {
+        "borderWidth": 0,
+        "borderColor": "#ccc"
+      },
+      "emphasis": {
+        "borderWidth": 0,
+        "borderColor": "#ccc"
+      }
+    }
+  },
+  "candlestick": {
+    "itemStyle": {
+      "normal": {
+        "color": "#edafda",
+        "color0": "transparent",
+        "borderColor": "#d680bc",
+        "borderColor0": "#8fd3e8",
+        "borderWidth": "2"
+      }
+    }
+  },
+  "graph": {
+    "itemStyle": {
+      "normal": {
+        "borderWidth": 0,
+        "borderColor": "#ccc"
+      }
+    },
+    "lineStyle": {
+      "normal": {
+        "width": 1,
+        "color": "#aaa"
+      }
+    },
+    "symbolSize": "6",
+    "symbol": "emptyCircle",
+    "smooth": true,
+    "color": [
+      "#2d8cf0",
+      "#19be6b",
+      "#f5ae4a",
+      "#9189d5",
+      "#56cae2",
+      "#cbb0e3"
+    ],
+    "label": {
+      "normal": {
+        "textStyle": {
+          "color": "#eee"
+        }
+      }
+    }
+  },
+  "map": {
+    "itemStyle": {
+      "normal": {
+        "areaColor": "#f3f3f3",
+        "borderColor": "#516b91",
+        "borderWidth": 0.5
+      },
+      "emphasis": {
+        "areaColor": "rgba(165,231,240,1)",
+        "borderColor": "#516b91",
+        "borderWidth": 1
+      }
+    },
+    "label": {
+      "normal": {
+        "textStyle": {
+          "color": "#000"
+        }
+      },
+      "emphasis": {
+        "textStyle": {
+          "color": "rgb(81,107,145)"
+        }
+      }
+    }
+  },
+  "geo": {
+    "itemStyle": {
+      "normal": {
+        "areaColor": "#f3f3f3",
+        "borderColor": "#516b91",
+        "borderWidth": 0.5
+      },
+      "emphasis": {
+        "areaColor": "rgba(165,231,240,1)",
+        "borderColor": "#516b91",
+        "borderWidth": 1
+      }
+    },
+    "label": {
+      "normal": {
+        "textStyle": {
+          "color": "#000"
+        }
+      },
+      "emphasis": {
+        "textStyle": {
+          "color": "rgb(81,107,145)"
+        }
+      }
+    }
+  },
+  "categoryAxis": {
+    "axisLine": {
+      "show": true,
+      "lineStyle": {
+        "color": "#cccccc"
+      }
+    },
+    "axisTick": {
+      "show": false,
+      "lineStyle": {
+        "color": "#333"
+      }
+    },
+    "axisLabel": {
+      "show": true,
+      "textStyle": {
+        "color": "#000"
+      }
+    },
+    "splitLine": {
+      "show": false,
+      "lineStyle": {
+        "color": [
+          "#eeeeee"
+        ]
+      }
+    },
+    "splitArea": {
+      "show": false,
+      "areaStyle": {
+        "color": [
+          "rgba(250,250,250,0.05)",
+          "rgba(200,200,200,0.02)"
+        ]
+      }
+    }
+  },
+  "valueAxis": {
+    "axisLine": {
+      "show": true,
+      "lineStyle": {
+        "color": "#cccccc"
+      }
+    },
+    "axisTick": {
+      "show": false,
+      "lineStyle": {
+        "color": "#333"
+      }
+    },
+    "axisLabel": {
+      "show": true,
+      "textStyle": {
+        "color": "#000"
+      }
+    },
+    "splitLine": {
+      "show": false,
+      "lineStyle": {
+        "color": [
+          "#eeeeee"
+        ]
+      }
+    },
+    "splitArea": {
+      "show": false,
+      "areaStyle": {
+        "color": [
+          "rgba(250,250,250,0.05)",
+          "rgba(200,200,200,0.02)"
+        ]
+      }
+    }
+  },
+  "logAxis": {
+    "axisLine": {
+      "show": true,
+      "lineStyle": {
+        "color": "#cccccc"
+      }
+    },
+    "axisTick": {
+      "show": false,
+      "lineStyle": {
+        "color": "#333"
+      }
+    },
+    "axisLabel": {
+      "show": true,
+      "textStyle": {
+        "color": "#999999"
+      }
+    },
+    "splitLine": {
+      "show": true,
+      "lineStyle": {
+        "color": [
+          "#eeeeee"
+        ]
+      }
+    },
+    "splitArea": {
+      "show": false,
+      "areaStyle": {
+        "color": [
+          "rgba(250,250,250,0.05)",
+          "rgba(200,200,200,0.02)"
+        ]
+      }
+    }
+  },
+  "timeAxis": {
+    "axisLine": {
+      "show": true,
+      "lineStyle": {
+        "color": "#cccccc"
+      }
+    },
+    "axisTick": {
+      "show": false,
+      "lineStyle": {
+        "color": "#333"
+      }
+    },
+    "axisLabel": {
+      "show": true,
+      "textStyle": {
+        "color": "#999999"
+      }
+    },
+    "splitLine": {
+      "show": true,
+      "lineStyle": {
+        "color": [
+          "#eeeeee"
+        ]
+      }
+    },
+    "splitArea": {
+      "show": false,
+      "areaStyle": {
+        "color": [
+          "rgba(250,250,250,0.05)",
+          "rgba(200,200,200,0.02)"
+        ]
+      }
+    }
+  },
+  "toolbox": {
+    "iconStyle": {
+      "normal": {
+        "borderColor": "#999"
+      },
+      "emphasis": {
+        "borderColor": "#666"
+      }
+    }
+  },
+  "legend": {
+    "textStyle": {
+      "color": "#000"
+    }
+  },
+  "tooltip": {
+    "axisPointer": {
+      "lineStyle": {
+        "color": "#ccc",
+        "width": 1
+      },
+      "crossStyle": {
+        "color": "#ccc",
+        "width": 1
+      }
+    }
+  },
+  "timeline": {
+    "lineStyle": {
+      "color": "#8fd3e8",
+      "width": 1
+    },
+    "itemStyle": {
+      "normal": {
+        "color": "#8fd3e8",
+        "borderWidth": 1
+      },
+      "emphasis": {
+        "color": "#8fd3e8"
+      }
+    },
+    "controlStyle": {
+      "normal": {
+        "color": "#8fd3e8",
+        "borderColor": "#8fd3e8",
+        "borderWidth": 0.5
+      },
+      "emphasis": {
+        "color": "#8fd3e8",
+        "borderColor": "#8fd3e8",
+        "borderWidth": 0.5
+      }
+    },
+    "checkpointStyle": {
+      "color": "#8fd3e8",
+      "borderColor": "rgba(138,124,168,0.37)"
+    },
+    "label": {
+      "normal": {
+        "textStyle": {
+          "color": "#8fd3e8"
+        }
+      },
+      "emphasis": {
+        "textStyle": {
+          "color": "#8fd3e8"
+        }
+      }
+    }
+  },
+  "visualMap": {
+    "color": [
+      "#516b91",
+      "#59c4e6",
+      "#a5e7f0"
+    ]
+  },
+  "dataZoom": {
+    "backgroundColor": "rgba(0,0,0,0)",
+    "dataBackgroundColor": "rgba(255,255,255,0.3)",
+    "fillerColor": "rgba(167,183,204,0.4)",
+    "handleColor": "#a7b7cc",
+    "handleSize": "100%",
+    "textStyle": {
+      "color": "#333"
+    }
+  },
+  "markPoint": {
+    "label": {
+      "normal": {
+        "textStyle": {
+          "color": "#eee"
+        }
+      },
+      "emphasis": {
+        "textStyle": {
+          "color": "#eee"
+        }
+      }
+    }
+  }
+}

src/components/echart/bottom/bottomLeftChart/chart.vue

@@ -81,6 +81,7 @@ export default {
           },
         ],
       },
+     
       flag: false,
     };
   },

src/filters/filter.js

@@ -64,7 +64,7 @@ Vue.filter('timewd', function (value) {
 })
 
 
-/** 大额数字单位换算 */
+/** 大额金额数字单位换算 */
 Vue.filter('getNum', function (num) {
   num = Number(num);
   if (!num) return '0.00';
@@ -76,3 +76,17 @@ Vue.filter('getNum', function (num) {
     return num.toFixed(2)
   }
 })
+
+
+/** 大额件数单数单位换算 */
+Vue.filter('getNum_noPrice', function (num) {
+  num = Number(num);
+  if (!num) return '0';
+  if (num > 10000 || num < -10000) {
+    const moneys = num / 10000
+    const realVal = Math.round(moneys);
+    return realVal + "万"
+  } else {
+    return Math.round(num)
+  }
+})

src/filters/index.js

@@ -102,3 +102,16 @@ export function uppercaseFirst(string) {
     return num.toFixed(2)
   }
 }
+
+/** 大额件数单数单位换算 */
+Vue.filter('getNum_noPrice', function (num) {
+  num = Number(num);
+  if (!num) return '0';
+  if (num > 10000 || num < -10000) {
+    const moneys = num / 10000
+    const realVal = Math.round(moneys);
+    return realVal + "万"
+  } else {
+    return Math.round(num)
+  }
+})

src/views/bigScreen/datavScr/index.vue

@@ -23,6 +23,7 @@
                   class="dv-dec-8"
                   :reverse="true"
                   :color="decorationColor"
+                  
                 />
               </div>
               <dv-decoration-10 class="dv-dec-10-s" />

src/views/reportQuery/purchaseReport/components/table8.vue

@@ -236,10 +236,6 @@ export default {
     },
      //导出文件 
     async download() {
-      // if(this.changeList.length<=0){
-      //   this.$message.warning("请选择有效数据")
-      //   return;
-      // }
       let start_date = new Date(this.parmValue.start_date).valueOf();
       let end_date = new Date(this.parmValue.end_date).valueOf();
       let flag = end_date - start_date > 30 * 24 * 60 * 60 * 1000;

src/views/reportQuery/stockReport/addEdit.vue

@@ -0,0 +1,228 @@
+<template>
+  <el-dialog
+    v-loading="loading"
+    :title="'修改表格需求'"
+    :center="true"
+    align="left"
+    top="25vh"
+    width="600px"
+    :close-on-click-modal="false"
+    :visible.sync="showModelThis"
+    element-loading-text="拼命加载中"
+    element-loading-spinner="el-icon-loading"
+    element-loading-background="rgba(0, 0, 0, 0.8)"
+    @close="closeModel"
+  >
+    <el-card style="margin: -20px 0 0 0">
+      <el-row :gutter="10">
+        <el-col :span="24">
+          <el-form
+            ref="ruleForm"
+            :model="ruleForm"
+            status-icon
+            :rules="rulesThis"
+            label-width="90px"
+            class="demo-ruleForm"
+          >
+            <el-form-item label="业务表" prop="id">
+              <el-select
+                v-model="ruleForm.id"
+                style="width: 100%"
+                disabled
+                placeholder="请选择业务表"
+              >
+                <el-option
+                  v-for="item in options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value"
+                >
+                </el-option>
+              </el-select>
+            </el-form-item>
+            <el-form-item label="数据时间" prop="start">
+              <period-date-picker
+                :start="ruleForm.start"
+                :end="ruleForm.end"
+                :type="type"
+                :width="'199px'"
+                :size="searchSize"
+                @timeReturned="timeReturned($event)"
+              />
+            </el-form-item>
+          </el-form>
+        </el-col>
+        <el-col :span="12" style="text-align: right">
+          <el-alert
+            style="width: 230px"
+            :closable="false"
+            :title="
+              type === '2'
+                ? '报表会在提交后开始执行！'
+                : '报表会在明天01:00开始生成'
+            "
+            type="warning"
+          >
+          </el-alert>
+        </el-col>
+        <el-col :span="12" style="text-align: right">
+          <el-button v-if="!isDetail" type="primary" @click="submitForm"
+            >保 存
+          </el-button>
+          <el-button @click="showModelThis = false">{{
+            isDetail ? "关 闭" : "取 消"
+          }}</el-button>
+        </el-col>
+      </el-row>
+    </el-card>
+  </el-dialog>
+</template>
+<script>
+import asyncRequest from "@/apis/service/reportQuery/financeReport/index.js";
+import resToken from "@/mixins/resToken";
+import PeriodDatePicker from "./components/PeriodDatePicker";
+export default {
+  name: "stockReport",
+  props: ["showModel", "sitem", "type"],
+  mixins: [resToken],
+  components: {
+    PeriodDatePicker,
+  },
+
+  data() {
+    const validateTime = (rule, value, callback) => {
+      if (value === "") {
+        callback(new Error("数据开始时间不能为空！"));
+      } else {
+        if (this.ruleForm.end === "") {
+          callback(new Error("数据结束时间不能为空！"));
+        } else {
+          callback();
+        }
+      }
+    };
+    return {
+      options: [],
+      loading: false,
+      title: "添加账号",
+      showModelThis: this.showModel,
+      ruleForm: {
+        start: "",
+        end: "",
+        id: "",
+      },
+      rulesThis: this.rules,
+      rules: {
+        start: [
+          {
+            required: true,
+            validator: validateTime,
+            trigger: "change",
+          },
+        ],
+        id: [
+          {
+            required: true,
+            message: "请选择业务表！",
+            trigger: "change",
+          },
+        ],
+      },
+    };
+  },
+  watch: {
+    showModel: function (val) {
+      this.showModelThis = val;
+      if (val) {
+        this.initForm();
+      }
+    },
+    showModelThis(val) {
+      if (!val) {
+        this.$emit("cancel");
+      }
+    },
+  },
+  methods: {
+    closeModel() {
+      console.log("closeModel!!");
+    },
+    async initForm() {
+      this.loading = true;
+      this.options = [];
+      this.rulesThis = this.rules;
+      await this.resetForm();
+      this.loading = false;
+    },
+    async timeReturned(e) {
+      if (e.startTime !== "") {
+        this.ruleForm.start = e.startTime;
+      } else {
+        this.ruleForm.start = "";
+      }
+      if (e.endTime !== "") {
+        this.ruleForm.end = e.endTime;
+      } else {
+        this.ruleForm.end = "";
+      }
+    },
+    async resetForm() {
+      // 重置
+      await this.$nextTick(() => {
+        if (this.$refs.ruleForm) {
+          this.$refs.ruleForm.resetFields();
+          this.$refs.ruleForm.clearValidate();
+          const { start, end, id, name } = this.sitem;
+          // console.log(this.sitem);
+          this.options = [
+            {
+              value: id,
+              label: name,
+            },
+          ];
+          this.ruleForm = {
+            start: "",
+            end: "",
+            id: id || "",
+          };
+          console.log(this.ruleForm);
+        }
+      });
+    },
+    async submitForm() {
+      await this.$refs.ruleForm.validate(async (valid) => {
+        if (valid) {
+          if (this.loading) {
+            return;
+          }
+          this.loading = true;
+          const model = JSON.parse(JSON.stringify(this.ruleForm));
+          let res = await asyncRequest.add(model);
+          this.loading = false;
+          if (res && res.code === 0) {
+            this.$notify.success({
+              title: "需求创建成功！",
+              message: "",
+            });
+            this.showModelThis = false;
+            // 刷新
+            this.$emit("refresh");
+          } else if (res && res.code >= 100 && res.code <= 104) {
+            await this.logout();
+          } else {
+            this.$message.warning(res.message);
+          }
+        } else {
+          console.log("error submit!!");
+          return false;
+        }
+      });
+    },
+  },
+};
+</script>
+
+   <style lang="scss" scoped>
+.account {
+}
+</style>

src/views/reportQuery/stockReport/components/ExTableNew.vue

@@ -0,0 +1,463 @@
+<template>
+  <div>
+    <div class="table-header">
+      <template v-for="(item, index) in table._defaultHeader_">
+        <el-dropdown
+          v-if="item == 'setcol'"
+          placement="bottom-end"
+          trigger="click"
+          class="setcol-table-lie"
+          :hide-on-click="false"
+          :key="index"
+        >
+          <el-button size="small">列设置</el-button>
+          <el-dropdown-menu slot="dropdown" :class="'ex-table-setcol-dropdown'">
+            <template v-for="(column, index) in setColumns">
+              <el-dropdown-item
+                v-if="!column._noset_"
+                :key="'setColumns' + index"
+              >
+                <el-switch
+                  v-model="column._hidden_"
+                  :active-text="column.label"
+                  :active-value="false"
+                  :inactive-value="true"
+                ></el-switch>
+              </el-dropdown-item>
+            </template>
+          </el-dropdown-menu>
+        </el-dropdown>
+      </template>
+      <slot
+        name="table-header"
+        :selection="tableSelection"
+        :alldata="data"
+      ></slot>
+    </div>
+    <el-table
+      ref="elTable"
+      :data="data"
+      v-bind="table"
+      :size="size"
+      v-on="$listeners"
+      @selection-change="tableSelection = $event"
+      :span-method="arraySpanMethod"
+      style="width: 100%"
+    >
+      <template v-for="(column, index) in columns">
+        <el-table-column
+          align="center"
+          v-if="!column._hidden_ && column.type && !column._slot_"
+          v-bind="column"
+          :key="index"
+          width="45px"
+        ></el-table-column>
+        <el-table-column
+        show-overflow-tooltip
+          v-else-if="!column._hidden_"
+          v-bind="column"
+          :key="index"
+        >
+          <template slot="header" slot-scope="scope">
+            <span>{{ column.label }}</span>
+            <span
+              v-if="column._screen_"
+              @click.stop="addConditionItemByCol(column, scope)"
+            >
+              <i
+                v-if="column._screen_tip_ === false"
+                :style="isHasScreenColumn(column) ? 'color:#3888e5;' : ''"
+                class="el-icon-connection"
+              />
+              <el-tooltip
+                v-else
+                 
+                :effect="column._screen_tip_effect_ || 'dark'"
+                :content="column._screen_tip_ || '筛选'"
+                :placement="column._screen_tip_placement_ || 'top'"
+              >
+                <i
+                  :style="isHasScreenColumn(column) ? 'color:#3888e5;' : ''"
+                  class="el-icon-connection"
+                />
+              </el-tooltip>
+            </span>
+          </template>
+          <slot
+            v-if="column._slot_"
+            slot-scope="scope"
+            :name="column._slot_"
+            :scope="scope"
+          ></slot>
+          <template v-else-if="column._render_" slot-scope="scope">
+            <ex-slot
+              :column="column"
+              :render="column._render_"
+              :scope="scope"
+            ></ex-slot>
+          </template>
+          <template v-else slot-scope="scope">
+            <span>{{
+              column._format_
+                ? column._format_(scope.row)
+                : getObjPrototype(scope.row, column.prop)
+            }}</span>
+          </template>
+        </el-table-column>
+      </template>
+    </el-table>
+    <!-- <el-pagination
+      v-if="page !== false && data && data.length > 0"
+      :current-page="page.curr"
+      :page-sizes="[10, 20, 50, 100]"
+      :total="page.total"
+      layout="total, sizes, prev, pager, next, jumper"
+      style="text-align: right"
+      class="fu-page"
+      @current-change="$emit('page-curr-change', $event)"
+      @size-change="$emit('page-size-change', $event)"
+    />
+  -->
+    <div
+      v-if="page !== false && data && data.length > 0"
+      class="Pagination"
+      style="text-align: right; margin-top: 10px"
+    >
+      <el-pagination
+        :current-page="page.curr"
+        :page-sizes="[15, 50, 100]"
+        :page-size="page.size"
+        :size="searchSize"
+        layout="total, sizes, prev, pager, next, jumper"
+        :total="page.total"
+        @size-change="$emit('page-size-change', $event)"
+        @current-change="$emit('page-curr-change', $event)"
+      />
+    </div>
+  </div>
+</template>
+
+<script>
+import Sortable from "sortablejs";
+export default {
+  name: "ex-table",
+  components: {
+    "ex-slot": {
+      functional: true,
+      props: {
+        render: Function,
+        scope: {
+          type: Object,
+          default: null,
+        },
+        column: {
+          type: Object,
+          default: null,
+        },
+      },
+      render: (h, data) => {
+        if (data.props.column) data.props.scope.column = data.props.column;
+        return data.props.render(h, data.props.scope);
+      },
+    },
+  },
+  props: {
+    /**
+     * el-table 属性集合
+     * 自定义属性：
+     * @param {Array} _defaultHeader_  : 默认的表格头部，支持['setcol', 'screen'] setcol-列设置 screen-筛选
+     * 可使用插槽扩展表格头部：
+     * table-header - 具名插槽
+     * slotProps：selection - 表格选中的数据  alldata - 表格当前全部数据
+     * <template #table-header="slotProps">
+     *   <el-button size="small" @click="click(slotProps)">扩展1</el-button>
+     * </template>
+     */
+    table: {
+      type: Object,
+      default: () => {},
+    },
+    // el-table 表格数据 对应data字段
+    data: {
+      type: Array,
+      default: () => [],
+    },
+    /**
+     * el-table-column 表格列属性集合
+     * 自定义属性：
+     * @param {String}       _filter_       : 是否不允许设置列
+     * @param {Boolean}       _noset_        : 是否不允许设置列
+     * @param {Boolean}        _screen_      : 是否允许筛选
+     * @param {Boolean}        _hidden_      : 是否隐藏列
+     * @param {String/Boolean} _screen_tip_  : 筛选按钮提示信息，为false不提示
+     * @param {String} _screen_tip_effect_   : 筛选按钮提示信息主题，dark/light
+     * @param {String} _screen_tip_placement_: 筛选按钮提示信息位置，top/top-start/top-end/bottom/bottom-start/bottom-end/left/left-start/left-end/right/right-start/right-end
+     * @param {Array}          _keys_        : 支持的筛选key
+     * @param {Array}      _select_options_  : 若需支持包含select的key，value的备选数据，示例：{_select_options_: [{id:'', label:''},...]}
+     * @param {Array}  _select_options_end_  : 若需支持包含select的key，value_end的备选数据，默认使用_select_options_，示例：{_select_options_: [{id:'', label:''},...]}
+     * @param {Array}          _keys_        : 支持的筛选key
+     * @param {String}         _slot_        : 使用具名插槽时的名称
+     * @param {Function}       _format_      : 数据格式化函数，支持返回html
+     * @param {Function}       _render_      : 自定义列，采用vue中的render函数，示例: { _render_:(h, scope) => { return h(...) } }
+     */
+    columns: {
+      type: Array,
+      default: () => [],
+    },
+    /**
+     * el-pagination
+     * @param {Boolean} page 是否开启表格分页，若不传或传false则不开启
+     * @param {Object} page {
+     *   size: '10'
+     *   total: '100'
+     *   curr: '1'
+     * }
+     * Event:
+     * page-curr-change  分页当前页改变
+     * page-size-change  分页大小改变
+     */
+    page: {
+      type: [Boolean, Object],
+      default: false,
+    },
+    /**
+     * 筛选条件集合
+     */
+    conditions: {
+      type: Array,
+      default: () => [],
+    },
+    /**
+     * 是否允许拖拽行
+     */
+    isRowDrop: {
+      type: Boolean,
+      default: false,
+    },
+    /**
+     * 是否允许拖拽列
+     */
+    isColDrop: {
+      type: Boolean,
+      default: false,
+    },
+    /**
+     * 表格大小
+     */
+    size: {
+      type: String,
+      default: "mini",
+    },
+  },
+  computed: {
+    // 允许筛选的列
+    screenColumns() {
+      return this.columns.filter((item) => item._screen_ === true);
+    },
+    // 允许设置的列
+    setColumns() {
+      return this.columns.filter((item) => !item._noset_);
+    },
+    // 筛选条件是否包含当前列
+    isHasScreenColumn() {
+      return function (col) {
+        return this.conditions.some((item) => item.prop === col.prop);
+      };
+    },
+  },
+  data() {
+    return {
+      // 表格选中项
+      tableSelection: [],
+    };
+  },
+   computed: {
+    page_curr() {
+      return this.page.curr;
+    },
+    page_size() {
+      return this.page.size;
+    },
+    page_total() {
+      return this.page.total;
+    },
+  },
+  watch: {
+    page_curr: function (val) {
+      this.page.curr = val;
+    },
+    page_size: function (val) {
+      this.page.size = val;
+    },
+    page_total: function (val) {
+      this.page.total = val;
+    },
+  },
+  mounted() {
+    // 拖拽绑定
+    this.rowDrop();
+    this.columnDrop();
+  },
+  directives: {
+    // v-drap  可拖拽指令
+    drap: {
+      inserted: function (element, binding) {
+        element.onmousedown = function (e) {
+          let el = binding.modifiers.parent ? element.parentNode : element,
+            bodyWidth = document.body.offsetWidth,
+            bodyHeight = document.body.offsetHeight,
+            elWidth = el.offsetWidth,
+            elHeight = el.offsetHeight;
+          // 开始拖动，记录左上角坐标点
+          let disX = e.clientX - el.offsetLeft;
+          let disY = e.clientY - el.offsetTop;
+          document.onmousemove = function (e) {
+            // 拖动中，修改dom的左上角坐标点
+            let l = e.clientX - disX;
+            let t = e.clientY - disY;
+            if (binding.modifiers.limit) {
+              l = l < 0 ? 0 : l;
+              t = t < 0 ? 0 : t;
+              l = l > bodyWidth - elWidth ? bodyWidth - elWidth : l;
+              t = t > bodyHeight - elHeight ? bodyHeight - elHeight : t;
+            }
+            el.style.left = l + "px";
+            el.style.top = t + "px";
+          };
+          document.onmouseup = function () {
+            // 结束拖动
+            document.onmousemove = null;
+          };
+        };
+      },
+    },
+  },
+  methods: {
+    //
+    arraySpanMethod({ row, column, rowIndex, columnIndex }) {
+      // if (rowIndex % 2 === 0) {
+      //   if (columnIndex === 0) {
+      //     return [1, 2];
+      //   } else if (columnIndex === 1) {
+      //     return [0, 0];
+      //   }
+      // }
+    },
+    objectSpanMethod({ row, column, rowIndex, columnIndex }) {
+      if (columnIndex === 0) {
+        if (rowIndex % 2 === 0) {
+          return {
+            rowspan: 2,
+            colspan: 1,
+          };
+        } else {
+          return {
+            rowspan: 0,
+            colspan: 0,
+          };
+        }
+      }
+    },
+
+    //行拖拽
+    rowDrop() {
+      const tbody = document.querySelector(
+        ".el-table__body-wrapper > table > tbody"
+      );
+      Sortable.create(tbody, {
+        disabled: !this.isRowDrop,
+        ghostClass: "sortable-ghost",
+        animation: 180,
+        delay: 0,
+        onEndevt: (evt) => {
+          const currItem = this.data.splice(evt.oldIndex, 1)[0];
+          this.data.splice(evt.newIndex, 0, currItem);
+        },
+      });
+    },
+    //列拖拽
+    columnDrop() {
+      const wrapperTr = document.querySelector(".el-table__header-wrapper tr");
+      Sortable.create(wrapperTr, {
+        disabled: !this.isColDrop,
+        ghostClass: "sortable-ghost",
+        animation: 180,
+        delay: 0,
+        onEnd: (evt) => {
+          const currItem = this.columns.splice(evt.oldIndex, 1)[0];
+          this.columns.splice(evt.newIndex, 0, currItem);
+        },
+      });
+    },
+    // 获取对象的属性
+    getObjPrototype(o, a) {
+      let fn = Function;
+      return new fn("obj", `return obj.${a}`)(o);
+    },
+    /** 表格方法 传递给el-table，后续有需要可继续增加 **/
+    // 对 Table 进行重新布局。当 Table 或其祖先元素由隐藏切换为显示时，可能需要调用此方法
+    doLayout(...arg) {
+      this.$refs.elTable.doLayout(...arg);
+    },
+    // 用于多选表格，清空用户的选择
+    clearSelection(...arg) {
+      this.$refs.elTable.clearSelection(...arg);
+    },
+    // 用于多选表格，切换某一行的选中状态
+    toggleRowSelection(...arg) {
+      this.$refs.elTable.toggleRowSelection(...arg);
+    },
+    // 用于多选表格，切换所有行的选中状态
+    toggleAllSelection(...arg) {
+      this.$refs.elTable.toggleAllSelection(...arg);
+    },
+    // 用于单选表格，设定某一行为选中行
+    setCurrentRow(...arg) {
+      this.$refs.elTable.setCurrentRow(...arg);
+    },
+    // 用于可展开表格与树形表格，切换某一行的展开状态，如果使用了第二个参数，则是设置这一行展开与否（expanded 为 true 则展开）
+    toggleRowExpansion(...arg) {
+      this.$refs.elTable.toggleRowExpansion(...arg);
+    },
+  },
+};
+</script>
+
+<style lang="css">
+.el-switch__core {
+  flex-shrink: 0;
+}
+.el-switch,
+.el-switch__label {
+  height: auto;
+}
+
+.ex-table-setcol-dropdown {
+  max-width: 180px;
+  max-height: 280px;
+  overflow-y: auto;
+}
+</style>
+
+<style lang="scss" scoped>
+.table-header {
+  display: flex;
+  position: relative;
+  display: -webkit-flex;
+  // background-color: #f5f5f5;
+  padding: 0 0;
+  .setcol-table-lie{
+    position: absolute;
+    top:0;
+    left:0;
+    z-index: 7;
+  }
+}
+.table-header > * {
+  margin-top: 10px;
+  margin-bottom: 12px;
+}
+// .table-header :nth-child(n + 2) {
+//   margin-left: 10px;
+// }
+</style>

src/views/reportQuery/stockReport/components/PeriodDatePicker.vue

@@ -0,0 +1,149 @@
+<template>
+  <div class="fl time">
+    <el-date-picker
+      v-model="startTime"
+      style="margin: 0"
+      class="date-picker"
+      :type="timeType || 'date'"
+      :size="size"
+      :style="{ width: width }"
+      placeholder="开始日期"
+      value-format="yyyy-MM-dd"
+      :picker-options="pickerOptions1"
+      :editable="false"
+      :clearable="true"
+      :disabled="isEdit"
+      @change="timeChange"
+    />
+    <samp style="padding: 0 3px; margin: 0">至</samp>
+    <el-date-picker
+      style="margin: 0"
+      :size="size"
+      v-model="endTime"
+      class="date-picker"
+      :style="{ width: width }"
+      :type="timeType || 'date'"
+      placeholder="结束日期"
+      :disabled="isEdit"
+      :picker-options="pickerOptions2"
+      :editable="false"
+      value-format="yyyy-MM-dd"
+      :clearable="true"
+      @change="timeChange"
+    />
+  </div>
+</template>
+
+<script>
+// 选择时间段(只有日期)组件
+// timeReturned 返回值{startTime: Number,endTime: Number}
+export default {
+  name: "PeriodDatePicker",
+  props: ["start", "end", "disabled", "size", "width", "type", "timeType"],
+  data() {
+    return {
+      startTime: this.start,
+      endTime: this.end,
+      isEdit: this.disabled,
+      pickerOptions1: {
+        disabledDate: (time) => {
+          if (this.endTime != null && this.endTime != "" && time) {
+            return time.getTime() > new Date(this.endTime).valueOf();
+          }
+        
+        },
+      },
+      pickerOptions2: {
+        disabledDate: (time) => {
+          if (this.startTime != null && this.startTime != "" && time) {
+            return time.getTime() < new Date(this.startTime).valueOf();
+          }
+          
+        },
+      },
+    };
+  },
+  watch: {
+    disabled: function (val) {
+      this.isEdit = val;
+    },
+    start(val) {
+      this.startTime = val;
+    },
+    end(val) {
+      this.endTime = val;
+    },
+  },
+  mounted() {},
+  methods: {
+    timeChange() {
+      if (
+        this.startTime !== "" &&
+        this.startTime !== null &&
+        this.endTime !== "" &&
+        this.endTime !== null
+      ) {
+        if (this.type + "" === "1" && !this.setType(365)) {
+          this.showMessage("时间跨度不能超过一年！");
+          return;
+        } else if (this.type + "" === "2" && !this.setType(90)) {
+          this.showMessage("时间跨度不能超过90天！");
+          return;
+        } else if (this.type + "" === "3" && !this.setType(30)) {
+          this.showMessage("时间跨度不能超过30天！");
+          return;
+        }else if (
+          new Date(this.endTime).valueOf() < new Date(this.startTime).valueOf()
+        ) {
+          this.showMessage("结束时间不大于开始时间！");
+          return;
+        } else {
+          this.timeReturned();
+        }
+      } else {
+        this.timeReturned();
+      }
+    },
+    timeReturned() {
+      let s = this.startTime == null ? "" : this.startTime;
+      let e = this.endTime == null ? "" : this.endTime;
+      let model = {
+        startTime: s == "" ? "" : this.transformTime(s),
+        endTime: e == "" ? "" : this.transformTime(e),
+      };
+
+      this.$emit("timeReturned", model);
+    },
+
+    transformTime(tTime) {
+      let time = new Date(tTime);
+      let y = time.getFullYear();
+      let M = time.getMonth() + 1;
+      let d = time.getDate();
+      return y + "-" + (M < 10 ? "0" + M : M) + "-" + (d < 10 ? "0" + d : d);
+    },
+    showMessage(message) {
+      this.$message.error(message);
+      this.startTime = "";
+      this.endTime = "";
+      this.timeReturned();
+    },
+    setType(days) {
+      let step = 24 * 3600 * 1000;
+      let sDay = new Date(this.startTime).valueOf();
+      let eDay = new Date(this.endTime).valueOf();
+      let isok = true;
+      if (eDay - sDay > step * days) {
+        isok = false;
+      }
+
+      return isok;
+    },
+  },
+};
+</script>
+<style lang="scss">
+.date-picker.el-input {
+  // width: 150px !important;
+}
+</style>

src/views/reportQuery/stockReport/history-data.vue

@@ -0,0 +1,278 @@
+<template>
+  <div class="pre-export">
+    <ex-table
+      style="margin-top: -10px"
+      v-loading="loading"
+      :table="table"
+      :data="tableData"
+      :columns="columns"
+      :page="pageInfo"
+      :size="size"
+      @page-curr-change="handlePageChange"
+      @page-size-change="handleSizeChange"
+      @screen-reset="
+        pageInfo.curr = 1;
+        parmValue.page = 1;
+        searchList();
+      "
+      @screen-submit="
+        pageInfo.curr = 1;
+        parmValue.page = 1;
+        searchList();
+      "
+    >
+      <template #table-header="{}">
+        <div style="width: 100%">
+          <el-row style="padding: 0 0 0 80px">
+            <el-col :span="24">
+              <el-col :span="12" style="width: 355px">
+                <el-alert
+                  :closable="false"
+                  title="申请下载后，文件会在几分钟后生成！"
+                  type="warning"
+                >
+                </el-alert>
+              </el-col>
+
+              <el-col
+                :span="3"
+                style="width: 66px; float: right"
+              >
+                <el-button
+                  :size="searchSize"
+                  type="primary"
+                  style="float: right; margin-left: 5px"
+                  @click="searchList"
+                >
+                  刷新
+                </el-button>
+              </el-col>
+            </el-col>
+          </el-row>
+        </div>
+      </template>
+      <template #status="{ scope }">
+        <el-tag
+          :size="tablebtnSize"
+          :type="
+            (statusOptions.find((item) => item.id == scope.row.status) || {})
+              .type || ''
+          "
+          v-text="
+            (statusOptions.find((item) => item.id == scope.row.status) || {})
+              .label || '--'
+          "
+        ></el-tag>
+      </template>
+      <template #operation="{ scope }">
+        <el-tooltip
+          effect="dark"
+          content="申请下载"
+          placement="top"
+          v-if="
+            scope.row.status !== '1'
+          "
+        >
+          <i class="el-icon-thumb tb-icon" @click="setStatus(scope.row.id)"></i>
+        </el-tooltip>
+        <el-tooltip
+          v-if="scope.row.status == '2'"
+          effect="dark"
+          content="下载"
+          placement="top"
+        >
+          <i
+            class="el-icon-download tb-icon"
+            @click="batchExport(scope.row.down_url)"
+          ></i>
+        </el-tooltip>
+      </template>
+    </ex-table>
+  </div>
+</template>
+<script>
+import mixinPage from "@/mixins/elPaginationHandle";
+import asyncRequest from "@/apis/service/reportQuery/financeReport/index.js";
+import ExTable from "./components/ExTableNew.vue";
+import { mapGetters } from "vuex";
+import urlConfig from "@/apis/url-config";
+import resToken from "@/mixins/resToken";
+export default {
+  name: "Account",
+  components: {
+    ExTable,
+  },
+  mixins: [mixinPage, resToken],
+  computed: {
+    ...mapGetters(["tablebtnSize", "searchSize", "size"]),
+    powers() {
+      let tran =
+        this.$store.getters.btnList.find(
+          (item) => item.menu_route == "stockReport"
+        ) || {};
+      if (tran && tran.action && tran.action.length > 0) {
+        return tran.action;
+      } else {
+        return [];
+      }
+    },
+  },
+  data() {
+    return {
+      fileUrl: urlConfig.testURL,
+      // 状态
+      statusOptions: [
+        { id: "0", label: "待申请", type: "info" },
+        { id: "1", label: "系统处理中", type: "warning" },
+        { id: "2", label: "已完成", type: "success" },
+        { id: "3", label: "下载失败", type: "danger" },
+      ],
+      loading: true,
+      showModel: false,
+      sitem: null,
+      parmValue: {
+        page: 1, // 页码
+        size: 15, // 每页显示条数
+      },
+      // 表格 - 数据
+      tableData: [],
+      // 表格 - 参数
+      table: {
+        stripe: true,
+        border: true,
+        _defaultHeader_: ["setcol"],
+      },
+      // 表格 - 分页
+      pageInfo: {
+        size: 15,
+        curr: 1,
+        total: 0,
+      },
+      // 表格 - 列参数
+      columns: [
+        {
+          prop: "name",
+          label: "业务表名称",
+          "min-width":"145px"
+        },
+        //    {
+        //   prop: "apply_name",
+        //   label: "申请人",
+        //   width:"80px"
+        // },
+        {
+          prop: "status",
+          label: "状态",
+          _slot_: "status",
+          "min-width":"100px"
+        },
+        
+        {
+          prop: "remark",
+          label: "下载反馈备注",
+          "min-width":"145px"
+        },
+
+        {
+          prop: "expiretime",
+          label: "文件过期时间",
+          "width":"145px"
+        },
+        {
+          prop: "updatetime",
+          label: "更新时间",
+          "width":"145px"
+        },
+        {
+          prop: "addtime",
+          label: "创建时间",
+          "width":"145px"
+        },
+        {
+          prop: "",
+          label: "操作",
+          fixed: "right",
+          width: "80px",
+          _slot_: "operation",
+        },
+      ],
+    };
+  },
+  mounted() {
+    this.searchList();
+  },
+  methods: {
+    restSearch() {
+      this.parmValue = {
+        page: 1, // 页码
+        size: 15, // 每页显示条数
+      };
+      this.searchList();
+    },
+    openModal(sitem) {
+      this.showModel = true;
+      this.sitem = sitem;
+    },
+
+    batchExport(content) {
+      if (!this.loading) {
+        this.loading = true;
+        let aEle = document.createElement("a"); // 创建a标签
+        // aEle.download = fileName; // 设置下载文件的文件名
+        aEle.href = this.fileUrl + content; // content为后台返回的下载地址
+        aEle.click(); // 设置点击事件
+        // document.body.removeChild(aEle); //下载完成移除元素
+        this.$message.success(`下载成功！`);
+        setTimeout(() => {
+          this.loading = false;
+        }, 500);
+      }
+    },
+    async setStatus(id) {
+      if (!this.loading) {
+        this.loading = true;
+        const model = {
+          id: id,
+        };
+        const res = await asyncRequest.download(model);
+      
+        if (res && res.code === 0) {
+          this.$notify.success({
+            title: "申请成功，请等待系统执行完成！",
+            message: "",
+          });
+          await this.searchList();
+        } else if (res && res.code >= 100 && res.code <= 104) {
+          await this.logout();
+        } else {
+          this.$message.warning(res.message);
+        }
+          this.loading = false;
+      }
+    },
+    async searchList() {
+      this.loading = true;
+      const res = await asyncRequest.hlist(this.parmValue);
+      if (res && res.code === 0 && res.data) {
+        this.tableData = res.data.list;
+        this.tableData.forEach((v) => {
+          if (v.status !== "3") {
+            v.remark = "";
+          }
+        });
+        this.pageInfo.total = Number(res.data.count);
+      } else if (res && res.code >= 100 && res.code <= 104) {
+        await this.logout();
+      } else {
+        this.tableData = [];
+        this.pageInfo.total = 0;
+      }
+      this.loading = false;
+    },
+  },
+};
+</script>
+   <style lang="scss" scoped>
+.account {
+}
+</style>

src/views/reportQuery/stockReport/index.vue

@@ -0,0 +1,78 @@
+<template>
+  <div class="financeReport pagePadding">
+    <div
+      v-loading="loading"
+      v-if="powers && powers.length > 0 && powers.some((item) => item == '001')"
+      style="margin-top:25px"
+    >
+      <el-tabs type="border-card" v-model="activeName">
+        <!-- <el-tab-pane label="实时下载" name="1">
+          <real-time-export />
+        </el-tab-pane> -->
+         <el-tab-pane label="延时下载" name="1">
+          <real-time-export-new />
+        </el-tab-pane>
+        <!-- <el-tab-pane label="预约下载" name="3">
+          <pre-export />
+        </el-tab-pane> -->
+
+
+        <!-- <el-tab-pane label="往年数据下载" name="4">
+          <history-data />
+        </el-tab-pane> -->
+      </el-tabs>
+    </div>
+    <no-auth v-else></no-auth>
+  </div>
+</template>
+<script>
+import resToken from "@/mixins/resToken";
+import urlConfig from "@/apis/url-config";
+import realTimeExport from "./real-time-export";
+import preExport from "./pre-export";
+import historyData from "./history-data";
+import realTimeExportNew from "./real-time-export-new";
+import { mapGetters } from "vuex";
+export default {
+  name: "stockReport",
+  mixins: [resToken],
+  components: {
+    realTimeExport,
+    preExport,
+    historyData,
+    realTimeExportNew
+  },
+  computed: {
+    //组件SIZE设置
+    ...mapGetters(["tablebtnSize", "searchSize", "size"]),
+    //组件SIZE设置
+    powers() {
+      let tran =
+        this.$store.getters.btnList.find(
+          (item) => item.menu_route == "stockReport"
+        ) || {};
+      if (tran && tran.action && tran.action.length > 0) {
+        return tran.action;
+      } else {
+        return [];
+      }
+    },
+  },
+  data() {
+    return {
+      activeName: "1",
+      loading: false,
+      fileUrl: urlConfig.baseURL,
+    };
+  },
+  mounted() {
+    this.activeName = "1";
+  },
+  methods: {},
+};
+</script>
+
+<style lang="scss" scoped>
+.financeReport {
+}
+</style>

src/views/reportQuery/stockReport/pre-export.vue

@@ -0,0 +1,180 @@
+<template>
+  <div class="pre-export">
+    <el-row style="padding: 0 0 14px 0">
+      <el-col :span="12" style="width: 355px">
+        <el-alert
+          :closable="false"
+          title="新建的需求业务报表，会在隔天01:00开始生成文件！"
+          type="warning"
+        >
+        </el-alert>
+      </el-col>
+
+      <el-col
+        :span="3"
+        style="width: 66px; float: right"
+      >
+        <el-button
+          :size="searchSize"
+          type="primary"
+          style="float: right; margin-left: 5px"
+          @click="searchList"
+        >
+          刷新
+        </el-button>
+      </el-col>
+    </el-row>
+
+    <el-table
+      :data="tableData"
+      border
+      v-loading="loading"
+      :size="size"
+      style="width: 100%"
+    >
+      <el-table-column  prop="name" label="业务表名称" min-width="140"/>
+      <el-table-column prop="start" label="数据开始时间" min-width="140"/>
+      <el-table-column prop="end" label="数据结束时间" min-width="140"/>
+      <el-table-column prop="apply_name" label="申请人" min-width="70"/>
+      <el-table-column prop="status" label="状态" min-width="70">
+          <template slot-scope="scope">
+               <el-tag
+          :size="tablebtnSize"
+          :type="scope.row.status == '2' ? 'success' : scope.row.status == '1'?'warning':'info'"
+          v-text="
+            (statusOptions.find((item) => item.id == scope.row.status) || {})
+              .label || '--'
+          "
+        ></el-tag>
+          </template>
+      </el-table-column>
+      <el-table-column prop="expiretime" label="文件过期时间" min-width="140"/>
+      <el-table-column prop="updatetime" label="创建时间" min-width="140"/>
+      <el-table-column fixed="right" label="操作" width="82">
+        <template slot-scope="scope">
+          <el-tooltip
+            effect="dark"
+            content="编辑"
+            placement="top"
+          >
+            <i class="el-icon-edit tb-icon" @click="openModal(scope.row)"></i>
+          </el-tooltip>
+          <el-tooltip
+            effect="dark"
+            content="下载"
+            placement="top"
+            v-if="
+              scope.row.status == '2'
+            "
+          >
+            <i
+              class="el-icon-download tb-icon"
+              @click="batchExport(scope.row.down_url)"
+            ></i>
+          </el-tooltip>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <add-edit
+      :sitem="sitem"
+      :show-model="showModel"
+      @refresh="searchList"
+      :type="'1'"
+      @cancel="showModel = false"
+    />
+  </div>
+</template>
+<script>
+import asyncRequest from "@/apis/service/reportQuery/financeReport/index.js";
+import addEdit from "./addEdit";
+import { mapGetters } from "vuex";
+import urlConfig from "@/apis/url-config";
+import resToken from "@/mixins/resToken";
+export default {
+  name: "Account",
+  components: {
+    addEdit,
+  },
+  mixins: [ resToken],
+  computed: {
+    ...mapGetters(["tablebtnSize", "searchSize", "size"]),
+    powers() {
+      let tran =
+        this.$store.getters.btnList.find(
+          (item) => item.menu_route == "stockReport"
+        ) || {};
+      if (tran && tran.action && tran.action.length > 0) {
+        return tran.action;
+      } else {
+        return [];
+      }
+    },
+  },
+  data() {
+    return {
+      fileUrl: urlConfig.baseURL,
+      // 状态
+      statusOptions: [
+        { id: "0", label: "待创建" },
+        { id: "1", label: "待执行" },
+        { id: "2", label: "已完成" },
+      ],
+      loading: true,
+      showModel: false,
+      sitem: null,
+      parmValue: {
+        page: 1, // 页码
+        size: 15, // 每页显示条数
+      },
+      // 表格 - 数据
+      tableData: [],
+    };
+  },
+  mounted() {
+    this.searchList();
+  },
+  methods: {
+    restSearch() {
+      this.parmValue = {
+        page: 1, // 页码
+        size: 15, // 每页显示条数
+      };
+      this.searchList();
+    },
+    openModal(sitem) {
+      this.showModel = true;
+      this.sitem = sitem;
+    },
+
+    batchExport(content) {
+      if (!this.loading) {
+        this.loading = true;
+        let aEle = document.createElement("a"); // 创建a标签
+        aEle.href = this.fileUrl + content; // content为后台返回的下载地址
+        aEle.click(); // 设置点击事件
+        this.$message.success(`下载成功！`);
+        setTimeout(() => {
+          this.loading = false;
+        }, 500);
+      }
+    },
+    async searchList() {
+      this.loading = true;
+      const res = await asyncRequest.exportList(this.parmValue);
+      if (res && res.code === 0 && res.data) {
+        this.tableData = res.data.list;
+      } else if (res && res.code >= 100 && res.code <= 104) {
+        await this.logout();
+      } else {
+        this.tableData = [];
+      }
+      this.loading = false;
+    },
+  },
+};
+</script>
+   <style lang="scss" scoped>
+.account {
+}
+</style>

src/views/reportQuery/stockReport/real-time-export-new.vue

@@ -0,0 +1,183 @@
+<template>
+  <div class="pre-export">
+    <el-row style="padding: 0 0 14px 0">
+      <el-col :span="12" style="width: 355px">
+        <el-alert
+          :closable="false"
+          title="申请下载后，文件会在几分钟后生成！"
+          type="warning"
+        >
+        </el-alert>
+      </el-col>
+
+      <el-col
+        :span="3"
+        style="width: 66px; float: right"
+
+      >
+        <el-button
+          :size="searchSize"
+          type="primary"
+          style="float: right; margin-left: 5px"
+          @click="searchList"
+        >
+          刷新
+        </el-button>
+      </el-col>
+    </el-row>
+
+    <el-table
+      :data="tableData"
+      border
+      v-loading="loading"
+      :size="size"
+      style="width: 100%"
+    >
+      <el-table-column  prop="name" label="业务表名称" min-width="140"/>
+      <el-table-column prop="start" label="数据开始时间" min-width="140"/>
+      <el-table-column prop="end" label="数据结束时间" min-width="140"/>
+      <el-table-column prop="apply_name" label="申请人" min-width="70"/>
+      <el-table-column prop="status" label="状态" min-width="70">
+          <template slot-scope="scope">
+               <el-tag
+          :size="tablebtnSize"
+          :type="scope.row.status == '2' ? 'success' : scope.row.status == '1'?'warning':'info'"
+          v-text="
+            (statusOptions.find((item) => item.id == scope.row.status) || {})
+              .label || '--'
+          "
+        ></el-tag>
+          </template>
+      </el-table-column>
+      <el-table-column prop="updatetime" label="状态更新时间" min-width="140"/>
+      <el-table-column prop="addtime" label="创建时间" min-width="140"/>
+      <el-table-column fixed="right" label="操作" width="82">
+        <template slot-scope="scope">
+          <el-tooltip
+            effect="dark"
+            content="编辑"
+            placement="top"
+          >
+            <i class="el-icon-edit tb-icon" @click="openModal(scope.row)"></i>
+          </el-tooltip>
+          <el-tooltip
+            effect="dark"
+            content="下载"
+            placement="top"
+            v-if="
+ scope.row.status == '2'
+            "
+          >
+            <i
+              class="el-icon-download tb-icon"
+              @click="batchExport(scope.row.down_url)"
+            ></i>
+          </el-tooltip>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <add-edit
+      :sitem="sitem"
+      :show-model="showModel"
+      :type="'2'"
+      @refresh="searchList"
+      @cancel="showModel = false"
+    />
+  </div>
+</template>
+<script>
+import asyncRequest from "@/apis/service/reportQuery/saleReportOrder/index.js";
+import addEdit from "./addEdit";
+import { mapGetters } from "vuex";
+import urlConfig from "@/apis/url-config";
+import resToken from "@/mixins/resToken";
+export default {
+  name: "Account",
+  components: {
+    addEdit,
+  },
+  mixins: [ resToken],
+  computed: {
+    ...mapGetters(["tablebtnSize", "searchSize", "size"]),
+    powers() {
+      let tran =
+        this.$store.getters.btnList.find(
+          (item) => item.menu_route == "stockReport"
+        ) || {};
+      if (tran && tran.action && tran.action.length > 0) {
+        return tran.action;
+      } else {
+        return [];
+      }
+    },
+  },
+  data() {
+    return {
+      fileUrl: urlConfig.baseURL,
+      // 状态
+      statusOptions: [
+        { id: "0", label: "待创建" },
+        { id: "1", label: "执行中" },
+        { id: "2", label: "已完成" },
+      ],
+      loading: true,
+      showModel: false,
+      sitem: null,
+      //接口用的是财务报表导出的接口
+      parmValue: {
+        page: 1, // 页码
+        size: 15, // 每页显示条数
+        type:3 //报表类型，1财务,2销售,3库存
+      },
+      // 表格 - 数据
+      tableData: [],
+    };
+  },
+  mounted() {
+    this.searchList();
+  },
+  methods: {
+    restSearch() {
+      this.parmValue = {
+        page: 1, // 页码
+        size: 15, // 每页显示条数
+      };
+      this.searchList();
+    },
+    openModal(sitem) {
+      this.showModel = true;
+      this.sitem = sitem;
+    },
+
+    batchExport(content) {
+      if (!this.loading) {
+        this.loading = true;
+        let aEle = document.createElement("a"); // 创建a标签
+        aEle.href = this.fileUrl + content; // content为后台返回的下载地址
+        aEle.click(); // 设置点击事件
+        this.$message.success(`下载成功！`);
+        setTimeout(() => {
+          this.loading = false;
+        }, 500);
+      }
+    },
+    async searchList() {
+      this.loading = true;
+      const res = await asyncRequest.realNewList(this.parmValue);
+      if (res && res.code === 0 && res.data) {
+           this.tableData = res.data.list;
+      } else if (res && res.code >= 100 && res.code <= 104) {
+        await this.logout();
+      } else {
+        this.tableData = [];
+      }
+      this.loading = false;
+    },
+  },
+};
+</script>
+   <style lang="scss" scoped>
+.account {
+}
+</style>

src/views/reportQuery/stockReport/real-time-export.vue

@@ -0,0 +1,334 @@
+<template>
+  <div class="real-time-export" v-loading="loading">
+    <div class="financeReport-ul-box">
+      <ul class="financeReport-ul clearfix">
+        <li v-for="item in options" :key="item.value">
+          <div class="label">{{ item.label }}：</div>
+          <div class="time">
+            <period-date-picker
+              :start="item.start"
+              :end="item.end"
+              :type="3"
+              :width="'135px'"
+              :size="searchSize"
+              @timeReturned="timeReturned($event, item.value)"
+            />
+          </div>
+          <div class="operation">
+            <el-button
+              type="primary"
+              class="fr"
+              icon="el-icon-download"
+              style="margin-left: 15px"
+              :size="searchSize"
+
+              @click="batchExport(item.value)"
+              >下载</el-button
+            >
+            <el-button
+              type="warning"
+              class="fr"
+              :size="searchSize"
+              @click="restSearch(item.value)"
+            >
+              重置
+            </el-button>
+          </div>
+        </li>
+      </ul>
+    </div>
+  </div>
+</template>
+<script>
+import resToken from "@/mixins/resToken";
+import urlConfig from "@/apis/url-config";
+import PeriodDatePicker from "./components/PeriodDatePicker";
+import { mapGetters } from "vuex";
+export default {
+  name: "stockReport",
+  mixins: [resToken],
+  components: {
+    PeriodDatePicker,
+  },
+  computed: {
+    //组件SIZE设置
+    ...mapGetters(["tablebtnSize", "searchSize", "size"]),
+    //组件SIZE设置
+    powers() {
+      let tran =
+        this.$store.getters.btnList.find(
+          (item) => item.menu_route == "stockReport"
+        ) || {};
+      if (tran && tran.action && tran.action.length > 0) {
+        return tran.action;
+      } else {
+        return [];
+      }
+    },
+  },
+  data() {
+    return {
+      options: [
+        // {
+        //   value: "13",
+        //   label: "出入库明细表",
+        //   start: "",
+        //   end: "",
+        //   url: "outinreport",
+        // },
+        // {
+        //   value: "14",
+        //   label: "收入明细表",
+        //   start: "",
+        //   end: "",
+        //   url: "inforeport",
+        // },
+        // {
+        //   value: "15",
+        //   label: "回票公司明细表",
+        //   start: "",
+        //   end: "",
+        //   url: "invcomreport",
+        // },
+        // {
+        //   value: "16",
+        //   label: "回票明细表",
+        //   start: "",
+        //   end: "",
+        //   url: "invreport",
+        // },
+        // {
+        //   value: "11",
+        //   label: "应收账款账龄表",
+        //   start: "",
+        //   end: "",
+        //   url: "downqrdpay",
+        // },
+        // {
+        //   value: "12",
+        //   label: "应收账款开票汇总表",
+        //   start: "",
+        //   end: "",
+        //   url: "downqrdinv",
+        // },
+
+        // {
+        //   value: "6",
+        //   label: "应收台账",
+        //   start: "",
+        //   end: "",
+        //   url: "Admin/downreportcwtz",
+        // },
+        // {
+        //   value: "1",
+        //   label: "确认单台账",
+        //   start: "",
+        //   end: "",
+        //   url: "Admin/downreportqrdtz",
+        // },
+        // {
+        //   value: "2",
+        //   label: "确认单明细",
+        //   start: "",
+        //   end: "",
+        //   url: "Admin/downreportqrd",
+        // },
+        {
+          value: "16",
+          label: "经营分析报表",
+          start: "",
+          end: "",
+          url: "Admin/getjingfen",
+        },
+        // {
+        //   value: "3",
+        //   label: "采购单台账",
+        //   start: "",
+        //   end: "",
+        //   url: "Admin/downreportcgdtz",
+        // },
+        // {
+        //   value: "4",
+        //   label: "采购单明细",
+        //   start: "",
+        //   end: "",
+        //   url: "Admin/downreportcgd",
+        // },
+
+        // {
+        //   value: "5",
+        //   label: "退货台账",
+        //   start: "",
+        //   end: "",
+        //   url: "Admin/downreportthtz",
+        // },
+        // {
+        //   value: "7",
+        //   label: "核算确认单",
+        //   start: "",
+        //   end: "",
+        //   url: "downqrd",
+        // },
+        // {
+        //   value: "8",
+        //   label: "核算采购单",
+        //   start: "",
+        //   end: "",
+        //   url: "downcgd",
+        // },
+        // {
+        //   value: "9",
+        //   label: "业绩确认采购单",
+        //   start: "",
+        //   end: "",
+        //   url: "downqrdtz",
+        // },
+        // {
+        //   value: "10",
+        //   label: "业绩退货单",
+        //   start: "",
+        //   end: "",
+        //   url: "downth",
+        // },
+      ],
+      loading: false,
+      fileUrl: urlConfig.baseURL,
+    };
+  },
+  methods: {
+    restSearch(type) {
+      let index = this.resType(type);
+      if (index !== -1) {
+        this.options[index].start = "";
+        this.options[index].end = "";
+      }
+    },
+
+    async timeReturned(e, type) {
+      let index = this.resType(type);
+      if (index !== -1) {
+        if (e.startTime !== "") {
+          this.options[index].start = e.startTime;
+        } else {
+          this.options[index].start = "";
+        }
+        if (e.endTime !== "") {
+          this.options[index].end = e.endTime;
+        } else {
+          this.options[index].end = "";
+        }
+      }
+    },
+
+    resType(value) {
+      return this.options.findIndex((v1) => v1.value === value);
+    },
+    /**
+     * 批量下载开票信息
+     * * @param {Array} selection //选中的对账编码
+     */
+    async batchExport(type) {
+      let index = this.resType(type);
+      if (index !== -1) {
+        let url = this.options[index].url;
+        let title = this.options[index].label;
+        let model = {
+          start: this.options[index].start,
+          end: this.options[index].end,
+        };
+        if (!this.loading) {
+          if (model.start === "" || model.end === "") {
+            this.$message.warning("请选择时间区间！");
+            return;
+          }
+          this.loading = true;
+          let httpType = `aplication/zip`;
+          axios({
+            method: "post",
+            url: this.fileUrl + url,
+            responseType: "blob",
+            data: model,
+            headers: {
+              Accept: httpType,
+            },
+          })
+            .then((res) => {
+              if (res && res.status == 200 && res.data) {
+                let blob = new Blob([res.data], {
+                  type: httpType,
+                });
+                let url = window.URL.createObjectURL(blob);
+                let aLink = document.createElement("a");
+                aLink.style.display = "none";
+                aLink.href = url;
+                aLink.setAttribute(
+                  "download",
+                  `${model.start}至${model.end}${title}.zip`
+                );
+                document.body.appendChild(aLink);
+                aLink.click();
+                document.body.removeChild(aLink); //下载完成移除元素
+                window.URL.revokeObjectURL(url); //释放掉blob对象
+
+                this.$message.success(title + `信息下载成功！`);
+                setTimeout(() => {
+                  this.loading = false;
+                }, 500);
+              } else {
+                this.$message.error("时间区间过长，请修改后再试！");
+                setTimeout(() => {
+                  this.loading = false;
+                }, 500);
+              }
+            })
+            .catch((error) => {
+               this.$message.error("时间区间过长，请修改后再试！");
+              this.loading = false;
+            });
+        }
+      }
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.real-time-export {
+  .financeReport-ul-box {
+    width: 100%;
+    padding: 0 10% 0 4%;
+    text-align: center;
+
+    .financeReport-ul {
+      width: 680px;
+      display: block;
+      box-sizing: border-box;
+      text-align: left;
+      margin: 0 auto;
+      li {
+        float: left;
+        width: 100%;
+        display: block;
+        box-sizing: border-box;
+        padding: 10px 0;
+        .label {
+          width: 180px;
+          float: left;
+          height: 32px;
+          text-align: right;
+          line-height: 32px;
+          padding: 0 15px 0 0;
+        }
+        .time {
+          float: left;
+          width: 300px;
+        }
+        .operation {
+          float: left;
+          width: 160px;
+        }
+      }
+    }
+  }
+}
+</style>

src/views/test/components/bottomCenter.vue

@@ -0,0 +1,212 @@
+<template>
+  <div class="txtSize">
+    <div class="title">
+      <span style="margin-bottom:20px;">竞价情况</span>
+      <!-- <span style="width"></span> -->
+      <div style="display: flex">
+        <span style="width: 100px">
+          <el-select v-model="region" size="mini">
+            <el-option label="不限部门" value="1"></el-option>
+            <el-option label="网络部" value="2"></el-option>
+          </el-select>
+        </span>
+        <span style="width: 60px">
+          <el-select v-model="region1" size="mini">
+            <el-option label="日" value="1"></el-option>
+            <el-option label="月" value="2"></el-option>
+            <el-option label="年" value="3"></el-option>
+          </el-select>
+        </span>
+        <span style="width: 140px">
+
+          <el-date-picker
+            style="width:100%"
+            size="mini"
+            :clearable="false"
+            v-model="region2"
+            :type="region1 == 1 ? 'date' : region1 == 2 ? 'month' : 'year'"
+            placeholder="选择日期">
+          </el-date-picker>
+        </span>
+      </div>
+    </div>
+
+    <!-- <div id="bottomCenter" style="width: auto; height: 300px"></div> -->
+
+    <!-- <div id="bottomCenterCon" style="width: auto; height: 300px; top:-80px"></div> -->
+    <!-- <bottomCenterCon></bottomCenterCon> -->
+
+    <Echart
+      :options="options"
+      id="bottomCenter"
+      height="300px"
+      width="100%"
+    ></Echart>
+  
+    <Echart
+      :options="optionsPie"
+      id="bottomCenterCon"
+      height="300px"
+      width="100%"
+    ></Echart>
+  </div>
+</template>
+
+<script>
+import Echart from "@/common/echart";
+
+
+export default {
+  components: {
+    Echart,
+  },
+  props: {
+    cdata: {
+      type: Object,
+      default: () => ({}),
+    },
+  },
+  data() {
+    return {
+      region: "1",
+      region1: "1",
+      region2: "1",
+      options: {
+        // title: {
+        //   text: "Funnel",
+        // },
+        tooltip: {
+          trigger: "item",
+          formatter: "{b} : {c}",
+        },
+        legend: {
+          data: ["竞价单数", "已反馈单数", "生成订单"],
+        },
+        series: [
+          {
+            name: "Funnel",
+            type: "funnel",
+            left: "10%",
+            top: 60,
+            bottom: 60,
+            width: "80%",
+            min: 0,
+            max: 100,
+            minSize: "30%",
+            maxSize: "100%",
+            sort: "descending",
+            gap: 2,
+            label: {
+              show: true,
+              position: "inside",
+              formatter:((params)=>{
+                //返回值对大数额做处理
+               return `${params.data.name} : ${this.$options.filters['getNum_noPrice'](params.data.value) }`
+              })
+            },
+            labelLine: {
+              length: 10,
+              lineStyle: {
+                width: 1,
+                type: "solid",
+              },
+            },
+            itemStyle: {
+              borderColor: "#fff",
+              borderWidth: 1,
+            },
+            // emphasis: {
+            //   label: {
+            //     fontSize: 20,
+            //   },
+            // },
+            data: [
+              { value: 456760, name: "生成订单" },
+              { value: 8880, name: "已反馈单数" },
+              { value: 100, name: "竞价单数" },
+            ],
+          },
+        ],
+      },
+
+
+      optionsPie: {
+  tooltip: {
+    trigger: 'item'
+  },
+  legend: {
+    // top: '50%',
+    bottom: '1%'
+  },
+   title: {
+          text: `空反：\n总单数\n${1111}`,
+          fontWeight:"normal",
+          fontSize:14,
+          lineHeight: 26,
+          left:'40%',
+          top:"40%",
+        },
+  series: [
+    {
+      name: '空反',
+      type: 'pie',
+      radius: ['40%', '70%'],
+      avoidLabelOverlap: false,
+      label: {
+        show: true,
+        position: 'inner',
+        formatter:((params)=>{
+                //返回值对大数额做处理
+               return `${this.$options.filters['getNum_noPrice'](params.data.value) }`
+              })
+      },
+   
+      labelLine: {
+        show: false
+      },
+      data: [
+        { value: 1048, name: '进行中' },
+        { value: 735, name: '已结束' },
+      ]
+    }
+  ]
+}
+    };
+  },
+  mounted() {
+    // this.cinit();
+  },
+  methods: {
+    cinit() {
+      this.$echarts
+        .init(document.getElementById("bottomCenter"))
+        .setOption(this.options);
+
+    
+        this.$echarts
+        .init(document.getElementById("bottomCenterCon"))
+        .setOption(this.optionsPie);
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.txtSize {
+  // font-size: 0px;
+  position: relative;
+  top: -270px;
+}
+.title {
+  font-size: 18px;
+  margin: 20px 0;
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: space-between;
+  align-items: center;
+}
+#bottomCenterCon{
+  position: relative;
+  top:0px;
+}
+</style>

src/views/test/components/bottomLeft.vue

@@ -0,0 +1,126 @@
+<template>
+  <div class="txtSize">
+    <div class="title">
+      <span>销售转单时长</span>
+      <!-- <span style="width"></span> -->
+      <div style="display: flex">
+        <span style="width: 100px">
+          <el-select v-model="region" size="mini">
+            <el-option label="不限部门" value="1"></el-option>
+            <el-option label="网络部" value="2"></el-option>
+          </el-select>
+        </span>
+        <span style="width: 60px">
+          <el-select v-model="region1" size="mini">
+            <el-option label="日" value="1"></el-option>
+            <el-option label="月" value="2"></el-option>
+            <el-option label="年" value="3"></el-option>
+          </el-select>
+        </span>
+        <span style="width: 140px">
+
+          <el-date-picker
+            style="width:100%"
+            size="mini"
+            :clearable="false"
+            v-model="region2"
+            :type="region1 == 1 ? 'date' : region1 == 2 ? 'month' : 'year'"
+            placeholder="选择日期">
+          </el-date-picker>
+        </span>
+      </div>
+    </div>
+    <div class="dv">
+      <p style="font-size: 12px">平均时长（分钟）</p>
+      <dv-decoration-9>10</dv-decoration-9>
+    </div>
+    <!-- <div id="bottomLeft" style="width: auto; height: 400px"></div> -->
+    <Echart
+      :options="options"
+      id="bottomLeft"
+      height="400px"
+      width="100%"
+    ></Echart>
+  </div>
+</template>
+
+<script>
+import Echart from "@/common/echart";
+
+export default {
+  components: {
+    Echart,
+  },
+  props: {
+    cdata: {
+      type: Object,
+      default: () => ({}),
+    },
+  },
+  data() {
+    return {
+      region: "1",
+      region1: "1",
+      region2: "1",
+      options: {
+        label: {
+          show: true,
+          position: "inside",
+        },
+        xAxis: {
+          type: "category",
+          data: ["1小时以内", "1-2小时", "2-4小时", "4-24小时", "24小时以上"],
+        },
+        yAxis: {
+          type: "value",
+        },
+        series: [
+          {
+            data: [200, 172, 150, 80, 70],
+            type: "bar",
+          },
+        ],
+      },
+    };
+  },
+  mounted() {
+    // this.cinit();
+  },
+  methods: {
+    cinit() {
+      this.$echarts
+        .init(document.getElementById("bottomLeft"))
+        .setOption(this.options);
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.txtSize {
+  // font-size: 0px;
+  position: relative;
+}
+.title {
+  font-size: 18px;
+  margin: 20px 0;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+#topCenter {
+  width: 100%;
+  height: 350px;
+}
+.dv {
+  width: 100px;
+  height: 100px;
+  position: absolute;
+  right: -86px;
+  z-index: 99;
+}
+.dv > p {
+  text-align: center;
+  padding-bottom: 5px;
+}
+</style>

src/views/test/components/bottomRight.vue

@@ -0,0 +1,127 @@
+<template>
+  <div class="txtSize">
+    <div class="title">
+      <span>采购返单时长</span>
+      <!-- <span style="width"></span> -->
+      <div style="display: flex">
+        <span style="width: 100px">
+          <el-select v-model="region" size="mini">
+            <el-option label="不限部门" value="1"></el-option>
+            <el-option label="网络部" value="2"></el-option>
+          </el-select>
+        </span>
+        <span style="width: 60px">
+          <el-select v-model="region1" size="mini">
+            <el-option label="日" value="1"></el-option>
+            <el-option label="月" value="2"></el-option>
+            <el-option label="年" value="3"></el-option>
+          </el-select>
+        </span>
+        <span style="width: 140px">
+
+          <el-date-picker
+            style="width:100%"
+            size="mini"
+            :clearable="false"
+            v-model="region2"
+            :type="region1 == 1 ? 'date' : region1 == 2 ? 'month' : 'year'"
+            placeholder="选择日期">
+          </el-date-picker>
+        </span>
+      </div>
+    </div>
+    <div class="dv">
+      <p style="font-size: 12px">平均时长（分钟）</p>
+      <dv-decoration-9>10</dv-decoration-9>
+    </div>
+    <!-- <div id="bottomRight" style="width: auto; height: 400px"></div> -->
+    <Echart
+      :options="options"
+      id="bottomRight"
+      height="400px"
+      width="100%"
+    ></Echart>
+  </div>
+</template>
+
+<script>
+import Echart from "@/common/echart";
+
+export default {
+  components: {
+    Echart,
+  },
+  props: {
+    cdata: {
+      type: Object,
+      default: () => ({}),
+    },
+  },
+  data() {
+    return {
+      region: "1",
+      region1: "1",
+      region2: "1",
+      options: {
+        label: {
+        show: true,
+        position: 'inside'
+      },
+  legend: {},
+  tooltip: {},
+  dataset: {
+    source: [
+      ['product', '返单商品数', '中标商品数'],
+      ['1小时以内', 43.3, 85.8],
+      ['1-2小时', 83.1, 73.4],
+      ['2-4小时', 86.4, 65.2],
+      ['4-24小时', 72.4, 53.9],
+      ['24小时以上', 72.4, 53.9]
+    ]
+  },
+  xAxis: { type: 'category' },
+  yAxis: {},
+  // Declare several bar series, each will be mapped
+  // to a column of dataset.source by default.
+  series: [{ type: 'bar' }, { type: 'bar' }]
+},
+    };
+  },
+  mounted() {
+    // this.cinit();
+  },
+  methods: {
+    cinit() {
+      this.$echarts
+        .init(document.getElementById("bottomRight"))
+        .setOption(this.options);
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.txtSize {
+  // font-size: 0px;
+  position: relative;
+}
+.title {
+  font-size: 18px;
+  margin: 20px 0;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+.dv{
+     width: 100px;
+     height: 100px;
+     position: absolute;
+     z-index: 99;
+     left: -86px;
+   }
+   .dv>p{
+     text-align: center;
+     padding-bottom: 5px;
+   }
+</style>

src/views/test/components/centerCon.vue

@@ -0,0 +1,81 @@
+<template>
+  <div class="txtSize">
+    <div class="title">
+      <span>今年目标</span>
+      <!-- <span style="width"></span> -->
+      <span style="width: 110px">
+          {{9000000 | getNum}}
+        </span>
+    </div>
+
+        <dv-water-level-pond :config="config" style="width:300px;height:300px;margin:40px auto 10px" />
+        <div class="dv">
+      
+          <dv-decoration-9></dv-decoration-9>
+        </div>
+
+    <!-- <Echart
+      :options="options"
+      id="topCenterChart"
+      height="450px"
+      width="100%"
+    ></Echart> -->
+  </div>
+</template>
+
+<script>
+import Echart from "@/common/echart";
+
+export default {
+  components: {
+    Echart,
+  },
+  props: {
+    cdata: {
+      type: Object,
+      default: () => ({}),
+    },
+  },
+  data() {
+    return {
+      config:{}
+    };
+  },
+  mounted() {
+    this.$nextTick(()=>{
+
+        this.cinit();
+    })
+  },
+  methods: {
+    cinit() {
+      this.config = {
+        //要水位的话、这个值不能动
+        data: [50],
+        shape: 'round',
+        //通过这个值去改你要改的
+        formatter:this.$options.filters['getNum'](9000000)
+      }
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.txtSize {
+  // font-size: 0px;
+  position: relative;
+  top: -255px;
+}
+.title {
+  font-size: 18px;
+  padding: 0 70px;
+  margin: 20px 0;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+
+
+</style>

src/views/test/components/centerLeft.vue

@@ -0,0 +1,129 @@
+<template>
+  <div class="txtSize">
+    <div class="title">
+      <span>销售转单数</span>
+      <!-- <span style="width"></span> -->
+      <div style="display: flex">
+        <span style="width: 100px">
+          <el-select v-model="region" size="mini">
+            <el-option label="不限部门" value="1"></el-option>
+            <el-option label="网络部" value="2"></el-option>
+          </el-select>
+        </span>
+        <span style="width: 60px">
+          <el-select v-model="region1" size="mini">
+            <el-option label="日" value="1"></el-option>
+            <el-option label="月" value="2"></el-option>
+            <el-option label="年" value="3"></el-option>
+          </el-select>
+        </span>
+        <span style="width: 140px">
+
+          <el-date-picker
+            style="width:100%"
+            size="mini"
+            :clearable="false"
+            v-model="region2"
+            :type="region1 == 1 ? 'date' : region1 == 2 ? 'month' : 'year'"
+            placeholder="选择日期">
+          </el-date-picker>
+        </span>
+      </div>
+    </div>
+    <!-- <div id="centerLeft" style="width: auto; height: 400px"></div> -->
+    <Echart
+      :options="options"
+      id="centerLeft"
+      height="300px"
+      width="100%"
+    ></Echart>
+  </div>
+</template>
+
+<script>
+import Echart from "@/common/echart";
+
+export default {
+  components: {
+    Echart,
+  },
+  props: {
+    cdata: {
+      type: Object,
+      default: () => ({}),
+    },
+  },
+  data() {
+    return {
+      region: "1",
+      region1: "1",
+      region2: "1",
+      options: {
+        label: {
+          show: true,
+          position: "inner",
+          formatter: function (params) {
+            return params.value + "%";
+          },
+        },
+        title: {
+          text: "总单数/中标单数/转单率",
+          left: "center",
+        },
+        tooltip: {
+          trigger: "item",
+        },
+        legend: {
+          orient: "vertical",
+          left: "left",
+        },
+        series: [
+          {
+            name: "Access From",
+            type: "pie",
+            radius: "50%",
+            data: [
+              { value: 1048, name: "Search Engine" },
+              { value: 735, name: "Direct" },
+              { value: 580, name: "Email" },
+              { value: 484, name: "Union Ads" },
+              { value: 300, name: "Video Ads" },
+            ],
+            emphasis: {
+              itemStyle: {
+                shadowBlur: 10,
+                shadowOffsetX: 0,
+                shadowColor: "rgba(0, 0, 0, 0.5)",
+              },
+            },
+          },
+        ],
+      },
+    };
+  },
+  mounted() {
+    // this.cinit();
+  },
+  methods: {
+    cinit() {
+      this.$echarts
+        .init(document.getElementById("centerLeft"))
+        .setOption(this.options);
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.txtSize {
+  // font-size: 0px;
+}
+.title {
+  font-size: 18px;
+  margin: 20px 0;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+</style>

src/views/test/components/centerRight.vue

@@ -0,0 +1,125 @@
+<template>
+  <div class="txtSize">
+    <div class="title">
+      <span>采购返单数</span>
+      <!-- <span style="width"></span> -->
+      <div style="display: flex">
+
+        <span style="width: 70px">
+          <el-select v-model="region1" size="mini">
+            <el-option label="日" value="1"></el-option>
+            <el-option label="月" value="2"></el-option>
+            <el-option label="年" value="3"></el-option>
+          </el-select>
+        </span>
+        <span style="width: 140px">
+
+          <el-date-picker
+            style="width:100%"
+            size="mini"
+            :clearable="false"
+            v-model="region2"
+            :type="region1 == 1 ? 'date' : region1 == 2 ? 'month' : 'year'"
+            placeholder="选择日期">
+          </el-date-picker>
+        </span>
+      </div>
+    </div>
+    <!-- <div id="centerRight" style="width: auto; height: 400px"></div> -->
+    <Echart
+      :options="options"
+      id="centerRight"
+      height="300px"
+      width="100%"
+    ></Echart>
+  </div>
+</template>
+
+<script>
+import Echart from "@/common/echart";
+
+export default {
+  components: {
+    Echart,
+  },
+  props: {
+    cdata: {
+      type: Object,
+      default: () => ({}),
+    },
+  },
+  data() {
+    return {
+      region: "1",
+      region1: "1",
+      region2: "1",
+      options: {
+        label: {
+          show: true,
+          position: "inner",
+          formatter: function (params) {
+            return params.value + "%";
+          },
+        },
+        title: {
+          text: "总单数/中标单数/转单率/参与度",
+          subtext: '参与度:(参与竞价单总数-参与竞价单最高商品成本记录)/竞价总数',
+          left: "center",
+        },
+        tooltip: {
+          trigger: "item",
+        },
+        legend: {
+          orient: "vertical",
+          left: "left",
+        },
+        series: [
+          {
+            name: "Access From",
+            type: "pie",
+            radius: "50%",
+            data: [
+              { value: 1048, name: "Search Engine" },
+              { value: 735, name: "Direct" },
+              { value: 580, name: "Email" },
+              { value: 484, name: "Union Ads" },
+              { value: 300, name: "Video Ads" },
+            ],
+            emphasis: {
+              itemStyle: {
+                shadowBlur: 10,
+                shadowOffsetX: 0,
+                shadowColor: "rgba(0, 0, 0, 0.5)",
+              },
+            },
+          },
+        ],
+      },
+    };
+  },
+  mounted() {
+    // this.cinit();
+  },
+  methods: {
+    cinit() {
+      this.$echarts
+        .init(document.getElementById("centerRight"))
+        .setOption(this.options);
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.txtSize {
+  // font-size: 0px;
+}
+.title {
+  font-size: 18px;
+  margin: 20px 0;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+</style>

src/views/test/components/topCenter.vue

@@ -0,0 +1,130 @@
+<template>
+  <div class="txtSize">
+    <div class="title">
+      <span>部门业绩</span>
+      <span style="width: 80px" class="mouth">
+        <el-select v-model="region" size="mini">
+          <el-option label="本月" value="1"></el-option>
+          <el-option label="本年" value="2"></el-option>
+        </el-select>
+      </span>
+    </div>
+    <!-- <div id="topCenter" style="width: auto; height: 400px"></div> -->
+    <Echart
+      :options="options"
+      id="topCenter"
+      height="350px"
+      width="100%"
+    ></Echart>
+  </div>
+</template>
+
+<script>
+import Echart from "@/common/echart";
+
+export default {
+  components: {
+    Echart,
+  },
+  data() {
+    return {
+      
+      region: "1",
+      options: {
+        label: {
+          show: true,
+          position: "inside",
+          formatter: function (params) {
+            return params.value + "%";
+          },
+        },
+        tooltip: {
+          trigger: "axis",
+        },
+        xAxis: {
+          // splitLine: {
+          //   show: true,
+          // },
+          data: ["网络部", "客服部", "项目部", "平台部"],
+
+          type: "category",
+        },
+
+        yAxis: {
+            // splitLine: {
+            //   show: false,
+            // },
+          type: "value",
+        },
+
+        series: [
+          {
+            name: "可用",
+
+            type: "bar",
+
+            stack: "使用情况",
+
+            data: [5, 20, 36, 10],
+
+            itemStyle: {
+              normal: { color: "#19BE6B" },
+            },
+
+            barWidth: 30, //柱图宽度
+          },
+          {
+            name: "不可用",
+
+            type: "bar",
+
+            stack: "使用情况",
+
+            data: [90, 22, 18, 35],
+
+            itemStyle: {
+              normal: { color: "#2D8CF0" },
+            },
+
+            barWidth: 30, //柱图宽度
+          },
+        ],
+      },
+    };
+  },
+  mounted() {
+    // this.cinit();
+  },
+  methods: {
+    cinit() {
+      this.$echarts.init(document.getElementById("topCenter")).setOption(
+        this.options
+       );
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.txtSize {
+  // font-size: 0px;
+  
+}
+.title {
+  font-size: 18px;
+  margin: 20px 0;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+#topCenter {
+  width: 100%;
+  height: 350px;
+  top: -40px;
+  // z-index: 0;
+}
+.mouth{
+  position: relative;
+  z-index: 90;
+}
+</style>

src/views/test/components/topLeft.vue

@@ -0,0 +1,166 @@
+<template>
+  <div class="txtSize">
+    <div class="title">
+      <span>今日销售</span>
+    </div>
+    <ul class="xs">
+      <li>
+        <p>{{999999 | getNum}}</p>
+        <p>销售金额</p>
+      </li>
+      <li>
+        <p>{{999999 | getNum_noPrice}}</p>
+        <p>订单数</p>
+      </li>
+      <li>
+        <p>{{999999 | getNum_noPrice}}</p>
+        <p>商品数</p>
+      </li>
+    </ul>
+
+    <div class="title">
+      <span>今日采购</span>
+    </div>
+    <ul class="cg">
+      <li>
+        <p>{{999999 | getNum_noPrice}}</p>
+        <p>竞价中标数</p>
+      </li>
+      <li>
+        <p>{{999999 | getNum_noPrice}}</p>
+        <p>反馈商品数</p>
+      </li>
+      <li>
+        <p>{{999999 | getNum_noPrice}}</p>
+        <p>订单数</p>
+      </li>
+      <li>
+        <p>{{999999 | getNum_noPrice}}</p>
+        <p>商品数</p>
+      </li>
+    </ul>
+
+    <div class="title">
+      <span>今日结算</span>
+    </div>
+    <el-table
+      :header-cell-style="{ background: 'oldlace' }"
+      :data="tableData"
+      style="width: 100%"
+    >
+      <el-table-column prop="name" label="待处理" min-width="100">
+      </el-table-column>
+      <el-table-column prop="date" label="单数（单）" min-width="100">
+        <template slot-scope="scope">
+          <div>
+            {{scope.row.date | getNum_noPrice}}
+          </div>
+        </template>
+      </el-table-column>
+      <el-table-column prop="address" label="金额（元）" min-width="100">
+        <template slot-scope="scope">
+          <div>
+            {{scope.row.address | getNum}}
+          </div>
+        </template>
+      </el-table-column>
+    </el-table>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      tableData: [
+        {
+          date: "222222",
+          name: "待开票",
+          address: "567890",
+        },
+        {
+          date: "3333333",
+          name: "待回款",
+          address: "45678",
+        },
+        {
+          date: "44444",
+          name: "待回票",
+          address: "456789",
+        },
+        {
+          date: "55555",
+          name: "待付款",
+          address: "4567890",
+        },
+      ],
+    };
+  },
+  methods: {
+    getNum(num) {
+      num = Number(num);
+      if (!num) return "0.00";
+      if (num > 10000 || num < -10000) {
+        const moneys = num / 10000;
+        const realVal = parseFloat(moneys).toFixed(2);
+        return realVal + "万";
+      } else {
+        return num.toFixed(2);
+      }
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.txtSize {
+  // font-size: 0px;
+}
+.title {
+  font-size: 18px;
+  margin: 35px 0;
+}
+.title:first-child {
+  margin: 20px 0 35px;
+}
+.xs {
+  display: flex;
+  justify-content: space-between;
+
+  li {
+    padding: 5px;
+    box-sizing: border-box;
+    width: 28%;
+    border: 1px solid #ccc;
+    background: oldlace;
+    border-radius: 10px;
+    p {
+      width: 100%;
+      text-align: center;
+    }
+  }
+  li:first-child {
+    width: 40%;
+  }
+}
+.cg {
+  display: flex;
+  justify-content: space-between;
+
+  li {
+    padding: 5px;
+    box-sizing: border-box;
+    width: 23%;
+    border: 1px solid #ccc;
+     background: oldlace;
+    border-radius: 10px;
+    p {
+      width: 100%;
+      text-align: center;
+    }
+  }
+}
+/deep/.el-table tr{
+  background: #f0f9eb;
+}
+</style>

src/views/test/components/topRight1.vue

@@ -0,0 +1,84 @@
+<template>
+  <div class="txtSize">
+    <div class="title">
+      <span>今日订单</span>
+    </div>
+    <el-table
+      :header-cell-style="{ background: 'oldlace' }"
+      :data="tableData"
+      style="width: 100%"
+    >
+      <el-table-column prop="name" label="部门" min-width="100">
+        
+      </el-table-column>
+      <el-table-column prop="date" label="订单单数" min-width="100">
+        <template slot-scope="scope">
+          <div>
+            {{scope.row.date | getNum_noPrice}}
+          </div>
+        </template>
+      </el-table-column>
+      <el-table-column prop="test" label="退货金额" min-width="100">
+        <template slot-scope="scope">
+          <div>
+            {{scope.row.test | getNum}}
+          </div>
+        </template>
+      </el-table-column>
+      <el-table-column prop="address" label="订单金额" min-width="100">
+        <template slot-scope="scope">
+          <div>
+            {{scope.row.address | getNum}}
+          </div>
+        </template>
+      </el-table-column>
+    </el-table>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      tableData: [
+        {
+          date: "222222",
+          name: "待开票",
+          test:"111111",
+          address: "567890",
+        },
+        {
+          date: "3333333",
+          name: "待回款",
+          test:"111111",
+          address: "45678",
+        },
+        {
+          date: "44444",
+          name: "待回票",
+          test:"111111",
+          address: "456789",
+        },
+        {
+          date: "55555",
+          name: "待付款",
+          test:"111111",
+          address: "4567890",
+        },
+      ],
+    };
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.txtSize {
+  // font-size: 0px;
+}
+.title {
+  margin: 20px 0;
+}
+/deep/.el-table tr{
+  background: #f0f9eb;
+}
+</style>

src/views/test/components/topRight2.vue

@@ -0,0 +1,84 @@
+<template>
+  <div class="txtSize">
+    <div class="title">
+      <span>今日销冠</span>
+    </div>
+    <el-table
+      :header-cell-style="{ background: 'oldlace' }"
+      :data="tableData"
+      style="width: 100%"
+    >
+      <el-table-column prop="name" label="人员/部门" min-width="100">
+      
+      </el-table-column>
+      <el-table-column prop="date" label="订单单数" min-width="100">
+        <template slot-scope="scope">
+          <div>
+            {{scope.row.date | getNum_noPrice}}
+          </div>
+        </template>
+      </el-table-column>
+      <el-table-column prop="test" label="退货金额" min-width="100">
+        <template slot-scope="scope">
+          <div>
+            {{scope.row.test | getNum}}
+          </div>
+        </template>
+      </el-table-column>
+      <el-table-column prop="address" label="订单金额" min-width="100">
+        <template slot-scope="scope">
+          <div>
+            {{scope.row.address | getNum}}
+          </div>
+        </template>
+      </el-table-column>
+    </el-table>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      tableData: [
+        {
+          date: "222222",
+          name: "待开票",
+          test:"111111",
+          address: "567890",
+        },
+        {
+          date: "3333333",
+          name: "待回款",
+          test:"111111",
+          address: "45678",
+        },
+        {
+          date: "44444",
+          name: "待回票",
+          test:"111111",
+          address: "456789",
+        },
+        {
+          date: "55555",
+          name: "待付款",
+          test:"111111",
+          address: "4567890",
+        },
+      ],
+    };
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.txtSize {
+  // font-size: 0px;
+}
+.title {
+  margin: 20px 0;
+}
+/deep/.el-table tr{
+  background: #f0f9eb;
+}
+</style>

src/views/test/index.vue

@@ -0,0 +1,149 @@
+<template>
+  <div class="datavScr box">
+    <div
+      v-if="powers && powers.length > 0 && powers.some((item) => item == '001')"
+    >
+      <div class="dataBox">
+        <div class="top">
+          <div style="width: 35%">
+            <topLeft></topLeft>
+          </div>
+          <div style="width: 20%">
+            <topCenter></topCenter>
+          </div>
+          <div
+            style="width: 35%; "
+          >
+            <div style="width: 100%">
+              <topRight1></topRight1>
+            </div>
+            <div style="width: 100%">
+              <topRight2></topRight2>
+            </div>
+          </div>
+        </div>
+
+        <div class="center">
+          <div style="width: 30%">
+            <centerLeft></centerLeft>
+          </div>
+          <div style="width: 30%">
+            <centerCon></centerCon>
+          </div>
+          <div style="width: 30%">
+            <centerRight></centerRight>
+          </div>
+        </div>
+
+        <div class="bottom">
+          <div style="width: 35%">
+            <bottomLeft></bottomLeft>
+          </div>
+          <div style="width: 20%">
+            <bottomCenter></bottomCenter>
+          </div>
+          <div style="width: 35%">
+            <bottomRight></bottomRight>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <div v-else>
+      <no-auth></no-auth>
+    </div>
+  </div>
+</template>
+
+<script>
+// import drawMixin from "../drawMixin";
+import { mapGetters } from "vuex";
+import resToken from "@/mixins/resToken";
+import topLeft from "./components/topLeft";
+import topCenter from "./components/topCenter";
+import topRight1 from "./components/topRight1";
+import topRight2 from "./components/topRight2";
+import centerLeft from "./components/centerLeft";
+import centerCon from "./components/centerCon";
+import centerRight from "./components/centerRight";
+import bottomLeft from "./components/bottomLeft";
+import bottomCenter from "./components/bottomCenter";
+import bottomRight from "./components/bottomRight";
+
+export default {
+  mixins: [resToken],
+  computed: {
+    ...mapGetters(["tablebtnSize", "searchSize", "size"]),
+    powers() {
+      let tran =
+        this.$store.getters.btnList.find(
+          (item) => item.menu_route == "newDatavScr"
+        ) || {};
+      if (tran && tran.action && tran.action.length > 0) {
+        return tran.action;
+      } else {
+        return [];
+      }
+    },
+  },
+  data() {
+    return {
+      loading: true,
+    };
+  },
+  components: {
+    topLeft,
+    topCenter,
+    topRight1,
+    topRight2,
+    centerLeft,
+    centerCon,
+    centerRight,
+    bottomLeft,
+    bottomCenter,
+    bottomRight
+  },
+  mounted() {},
+  beforeDestroy() {},
+  methods: {},
+};
+</script>
+
+<style lang="scss" scoped>
+.datavScr.box {
+  width: 100%;
+//   height: 100vh;
+    // background: #000;
+    // background: url("./img/pageBg.png");
+    background: url("./img/1.jpeg");
+    background-size: 100% 100%;
+  margin: 0;
+  padding: 20px 20px 70px;
+  // color: #fff;
+}
+.dataBox {
+  width: 100%;
+  height: 100%;
+  min-width: 1300px;
+
+}
+
+.top {
+  width: 100%;
+  display: flex;
+  justify-content: space-between;
+}
+.center{
+  width: 100%;
+  display: flex;
+  justify-content: space-between;
+  margin-top: 30px;
+}
+.bottom{
+width: 100%;
+  display: flex;
+  justify-content: space-between;
+//   margin-top: 30px;
+  max-height: 400px;
+}
+</style>