修改了登录页面和首页

pages/index.vue

 <template>
-  <div>
-    <h2>欢迎来到首页~</h2>
+  <div style="background-color: #f5f7f9">
+    <div class="cardBox">
+      <el-row :gutter="20">
+        <el-col :span="6">
+          <div class="grid-content bg-purple">
+            <el-card class="box-card">
+              <div class="cardHead">
+                <span>个人项目量</span>
+                <el-tooltip class="item" effect="dark" content="说明" placement="top">
+                  <i style="float: right; font-size: 15px;margin-top: 3px;cursor: pointer" class="el-icon-warning" />
+                </el-tooltip>
+              </div>
+              <div class="cardBody" style="padding-bottom: 20px;">
+                <span style="font-size: 30px;color: #000000;">{{ personalData.taskTotal }}</span><br>
+                <span>周同比 {{ personalData.weekOnWeek }}</span><span class="el-icon-caret-top" /><br>
+                <span>日同比 {{ personalData.dayOnDay }}</span><span class="el-icon-caret-bottom" /><br>
+              </div>
+              <div class="cardFooter" style="border-top: 1px solid gray;padding-top: 10px;">
+                <span>待检项目量 {{ personalData.noTestNum }}</span>
+              </div>
+            </el-card>
+          </div>
+        </el-col>
+        <el-col :span="6">
+          <div class="grid-content bg-purple">
+            <el-card class="box-card" style="position: relative">
+              <div class="cardHead">
+                <span>个人报检量</span>
+                <el-tooltip class="item" effect="dark" content="说明" placement="top">
+                  <i style="float: right; font-size: 15px;margin-top: 3px;cursor: pointer" class="el-icon-warning" />
+                </el-tooltip>
+              </div>
+              <div class="cardBody" style="padding-bottom: 0px;">
+                <div id="waveImg" style="width: 100%;height: 100px;" />
+              </div>
+              <div style="position: absolute;left: 20px;top: 35px;;">
+                <span style="color: #000000;font-size: 30px">{{ personalData.inspectionTotal }}</span>
+              </div>
+              <div class="cardFooter" style="border-top: 1px solid gray;padding-top: 10px;">
+                <span>今日报检量 {{ personalData.inspectionDayNum }}</span>
+              </div>
+            </el-card>
+          </div>
+        </el-col>
+        <el-col :span="6">
+          <div class="grid-content bg-purple">
+            <el-card class="box-card" style="position: relative">
+              <div class="cardHead">
+                <span>个人收样量</span>
+                <el-tooltip class="item" effect="dark" content="说明" placement="top">
+                  <i style="float: right; font-size: 15px;margin-top: 3px; cursor: pointer" class="el-icon-warning" />
+                </el-tooltip>
+              </div>
+              <div class="cardBody" style="padding-bottom: 0px;">
+                <div id="histogram" style="width: 100%;height: 100px;" />
+              </div>
+              <div style="position: absolute;left: 20px;top: 35px;;">
+                <span style="color: #000000;font-size: 30px">{{ personalData.receiveTotal }}</span>
+              </div>
+              <div class="cardFooter" style="border-top: 1px solid gray;padding-top: 10px;">
+                <span>今日收样量 {{ personalData.receiveDayNum }}</span>
+              </div>
+            </el-card>
+          </div>
+        </el-col>
+        <el-col :span="6">
+          <div class="grid-content bg-purple" />
+        </el-col>
+      </el-row>
+    </div>
+    <div class="tabBox clearfix" style="position: relative;background-color: white;margin-bottom: 20px;margin-top: 20px;">
+      <el-tabs v-model="activeName">
+        <el-tab-pane label="不合格项目" name="first">
+          <div class="saleBox" style="padding-left: 20px;float: left;">
+            <p style="font-size: 14px;">
+              {{ range }}不合格数量
+            </p>
+            <div id="saleImg" style="width: 660px;height: 260px;" />
+          </div>
+          <div class="shopBox" style="float: left;margin-left: 40px;">
+            <p style="font-size: 14px;">
+              {{ range }} 物料报检量排行榜
+            </p>
+            <div class="shopName">
+              <ul class="shopNameList">
+                <li v-for="(item,index) in sampleList" :key="index" style="text-align: center;margin-bottom: 10px;">
+                  <span class="serial" style="float: left;">{{ index+1 }}</span>
+                  <span style="float: left;font-size: 14px;width: 200px;text-align: left">&nbsp;&nbsp;&nbsp;&nbsp;名称：{{ item.name }}&nbsp;&nbsp;&nbsp;&nbsp;</span>
+                  <span style="font-size: 14px;">报检数量：{{ item.number }}</span>
+                </li>
+              </ul>
+            </div>
+          </div>
+        </el-tab-pane>
+        <el-tab-pane label="物料报检量" name="second">
+          <div class="salesTrendBox" style="padding-left: 20px;float: left;">
+            <p style="font-size: 14px;">
+              报检数量
+            </p>
+            <div id="salesTrendImg" style="width: 660px;height: 260px;" />
+          </div>
+          <div class="shopBox" style="float: left;">
+            <p style="font-size: 14px;">
+              物料报检量排行榜
+            </p>
+            <div class="shopName">
+              <ul class="shopNameList">
+                <li v-for="(item,index) in sampleList" :key="index" style="text-align: center;margin-bottom: 10px;">
+                  <span class="serial" style="float: left;">{{ index+1 }}</span>
+                  <span style="float: left;font-size: 14px;width: 200px;text-align: left">&nbsp;&nbsp;&nbsp;&nbsp;名称：{{ item.name }}&nbsp;&nbsp;&nbsp;&nbsp;</span>
+                  <span style="font-size: 14px;">报检数量：{{ item.number }}</span>
+                </li>
+              </ul>
+            </div>
+          </div>
+        </el-tab-pane>
+      </el-tabs>
+      <div class="timeBox" style="float: right;position: absolute;right: 0px;top: 0px;">
+        <div style="float: left;line-height: 34px;">
+          <a :class="{actived:pitch=='_rangeDayChange'}" @click="_rangeDayChange">今日</a>
+          <a :class="{actived:pitch=='_rangeWeekChange'}" @click="_rangeWeekChange">本周</a>
+          <a :class="{actived:pitch=='_rangeMonthChange'}" @click="_rangeMonthChange">本月</a>
+          <a :class="{actived:pitch=='_rangeYearChange'}" @click="_rangeYearChange">本年</a>
+          <!--          <a-->
+          <!--            v-for="(item,index) in date"-->
+          <!--            :key="index"-->
+          <!--            href="#"-->
+          <!--            style="margin-right: 10px;"-->
+          <!--            :class="{actived:pitch==index}"-->
+          <!--            @click="Gather(index)"-->
+          <!--          >{{ item }}</a>-->
+        </div>
+        <div class="calendar" style="overflow: hidden">
+          <div class="block">
+            <!--            <el-date-picker-->
+            <!--              v-model="dateValue"-->
+            <!--              type="daterange"-->
+            <!--              -->
+            <!--              start-placeholder="开始日期"-->
+            <!--              end-placeholder="结束日期"-->
+            <!--              range-separator="至"-->
+            <!--              style="width: 300px;margin-left: 20px;"-->
+            <!--              @change="dateChange()"-->
+            <!--            />-->
+            <el-date-picker
+              v-model="dateValue"
+              class="databox"
+              value-format="yyyy-MM-dd"
+              type="daterange"
+              range-separator="至"
+              start-placeholder="开始日期"
+              end-placeholder="结束日期"
+              @change="dateChange()"
+            />
+          </div>
+        </div>
+      </div>
+    </div>
+    <div class="visitNum">
+      <el-card class="box-card" style="height: 100%">
+        <div slot="header" class="clearfix">
+          <span>报检量项目量统计</span>
+        </div>
+        <div class="clearfix">
+          <div style="float: left;width: 30%;text-align: center">
+            <p style="font-size: 14px; color: rgba(0, 0, 0, 0.45)">
+              今日报检量
+            </p>
+            <p style="font-size: 24px;">
+              {{ sampleItemNum.daySample }}
+            </p>
+            <i />
+          </div>
+          <div style="float: left;width: 40%;text-align: center">
+            <p style="font-size: 14px; color: rgba(0, 0, 0, 0.45)">
+              今日项目量
+            </p>
+            <p style="font-size: 24px;">
+              {{ sampleItemNum.dayItem }}
+            </p>
+            <i />
+          </div>
+          <div style="float: left;width: 30%;text-align: center">
+            <p style="font-size: 14px; color: rgba(0, 0, 0, 0.45)">
+              总报检量
+            </p>
+            <p style="font-size: 24px;">
+              {{ sampleItemNum.totalSample }}
+            </p>
+            <i />
+          </div>
+        </div>
+        <div id="visitImg" style="width: 100%;height: 350px;" />
+      </el-card>
+    </div>
+    <div class="footer">
+      <div style="text-align: center">
+        <p>LIMS首页</p>
+      </div>
+    </div>
     <!--<a @click="_change(language[0])">-->
     <!--例子点击此处【{{ language[0].name }}】-->
     <!--</a>-->