1.生产进度报表提交

loulijun2021

2023-05-11 c588a47c9c7fbcbe6e0a479cfb081ffa4db2a94c

 src/views/xtsy/index.vue

@@ -11,14 +11,18 @@
            <div class="top_card_content_flex">
              <div class="content" style="width: 84%">
                <div class="content_title1">今日登录</div>
                <div class="content_end1" :style="{color:`rgb(${barTopColor01[0]})`}">1/409</div>
                <div class="content_end1" :style="{color:`rgb(${barTopColor01[0]})`}">5/18
                  <countTo :start-val="0" :end-val="18" :duration="3000" />
                </div>
              </div>
              <div id="barTop01" class="barTop" style="width: 100%;" />
              <div id="barTop01" class="barTop" style="width: 87%;" />
              <div class="content" style="width: 84%">
                <div class="content_title1">昨日登录</div>
                <div class="content_end1">0/409</div>
                <div class="content_end1">6/18
                  <countTo :start-val="0" :end-val="18" :duration="3000" />
                </div>
              </div>
              <div id="barTop02" class="barTop" />
              <div id="barTop02" class="barTop" style="width: 100%;" />
            </div>
          </div>
        </div>
@@ -29,14 +33,18 @@
            <div class="top_card_content_flex">
              <div class="content" style="width: 84%">
                <div class="content_title1">今日活跃</div>
                <div class="content_end1" :style="{color:`rgb(${barTopColor02[0]})`}">0/409</div>
                <div class="content_end1" :style="{color:`rgb(${barTopColor02[0]})`}">5/18
                  <countTo :start-val="0" :end-val="18" :duration="3000" />
                </div>
              </div>
              <div id="barTop03" class="barTop" />
              <div id="barTop03" class="barTop" style="width: 87%;" />
              <div class="content" style="width: 84%">
                <div class="content_title1">昨日活跃</div>
                <div class="content_end1">0/409</div>
                <div class="content_end1">6/18
                  <countTo :start-val="0" :end-val="18" :duration="3000" />
                </div>
              </div>
              <div id="barTop04" class="barTop" />
              <div id="barTop04" class="barTop" style="width: 100%;" />
            </div>
          </div>
        </div>
@@ -47,14 +55,18 @@
            <div class="top_card_content_flex">
              <div class="content" style="width: 84%">
                <div class="content_title1">今日活跃</div>
                <div class="content_end1" :style="{color:`rgb(${barTopColor03[0]})`}">0/409</div>
                <div class="content_end1" :style="{color:`rgb(${barTopColor03[0]})`}">5/18
                  <countTo :start-val="0" :end-val="18" :duration="3000" />
                </div>
              </div>
              <div id="barTop05" class="barTop" />
              <div id="barTop05" class="barTop" style="width: 87%;" />
              <div class="content" style="width: 84%">
                <div class="content_title1">昨日活跃</div>
                <div class="content_end1">0/409</div>
                <div class="content_end1">6/18
                  <countTo :start-val="0" :end-val="18" :duration="3000" />
                </div>
              </div>
              <div id="barTop06" class="barTop" />
              <div id="barTop06" class="barTop" style="width: 100%;" />
            </div>
          </div>
        </div>
@@ -65,12 +77,16 @@
            <div class="top_card_content_flex">
              <div class="content" style="width: 84%">
                <div class="content_title1">今日活跃</div>
                <div class="content_end1" :style="{color:`rgb(${barTopColor04[0]})`}">0/409</div>
                <div class="content_end1" :style="{color:`rgb(${barTopColor04[0]})`}">0/18
                  <countTo :start-val="0" :end-val="18" :duration="3000" />
                </div>
              </div>
              <div id="barTop07" class="barTop" />
              <div class="content" style="width: 84%">
                <div class="content_title1">昨日活跃</div>
                <div class="content_end1">0/409</div>
                <div class="content_end1">0/18
                  <countTo :start-val="0" :end-val="18" :duration="3000" />
                </div>
              </div>
              <div id="barTop08" class="barTop" />
            </div>
@@ -116,7 +132,7 @@
      mainHeight: 0,
      tableHeight: 0,
      barTopColor01: ['42,197,137', '187,236,218'],
      barTopColor02: ['248,216,76', '255,250,238'],
      barTopColor02: ['248,216,76', '255,250,188'],
      barTopColor03: ['42,197,137', '187,236,218'],
      barTopColor04: ['232,103,103', '253,240,240']
    }
@@ -149,28 +165,28 @@
      this.getLine01()
    },
    getTopData() {
      loadEcharts('barTop01', barTop(1, this.barTopColor01))
      loadEcharts('barTop02', barTop(0, this.barTopColor01))
      loadEcharts('barTop03', barTop(0, this.barTopColor02))
      loadEcharts('barTop04', barTop(0, this.barTopColor02))
      loadEcharts('barTop05', barTop(0, this.barTopColor03))
      loadEcharts('barTop06', barTop(0, this.barTopColor03))
      loadEcharts('barTop01', barTop(5, this.barTopColor01))
      loadEcharts('barTop02', barTop(6, this.barTopColor01))
      loadEcharts('barTop03', barTop(5, this.barTopColor02))
      loadEcharts('barTop04', barTop(6, this.barTopColor02))
      loadEcharts('barTop05', barTop(5, this.barTopColor03))
      loadEcharts('barTop06', barTop(6, this.barTopColor03))
      loadEcharts('barTop07', barTop(0, this.barTopColor04))
      loadEcharts('barTop08', barTop(0, this.barTopColor04))
    },
    async getBar01() {
      // const res=await  xxx()
      let data = [
        { key: '生产经理', value: 300 },
        { key: '生产副总', value: 310 },
        { key: '一线线长', value: 180 },
        { key: '二线线长', value: 190 },
        { key: '三线线长', value: 120 },
        { key: '四线线长', value: 230 },
        { key: '五线线长', value: 270 },
        { key: '一线包装工', value: 250 },
        { key: '二线包装工', value: 260 },
        { key: '三线包装工', value: 180 }
        { key: '生产经理', value: 553 },
        { key: '生产副总', value: 530 },
        { key: '一线线长', value: 341 },
        { key: '二线线长', value: 196 },
        { key: '三线线长', value: 521 },
        { key: '四线线长', value: 431 },
        { key: '五线线长', value: 370 },
        { key: '一线包装工', value: 258 },
        { key: '二线包装工', value: 269 },
        { key: '三线包装工', value: 289 }
      ]
      data = data.sort((a, b) => b.value - a.value)
      loadEcharts('bar01', bar01(data))