Domovská stránka Prehľadávať Pomoc
Prihlásiť sa
xuyunhui
/
E-commerce
1
0
Fork 0
Súbory Issues 0 Pull requesty 0 Wiki
Prechádzať zdrojové kódy

Merge branch 'dev' of http://gogs.gzzzyd.com/xiaowenhua/vueDataV into dev

Cooklalala 5 mesiacov pred
rodič
014c29a93b c5743c2a76
commit
3341858496
11 zmenil súbory, kde vykonal 115 pridanie a 116 odobranie
Rozdelené zobrazenie Ukázať štatistiku rozdielnych dát
  1. 0 31
      index.html
  2. 0 54
      index2.html
  3. 45 0
      mm/mm.config.js
  4. 1 0
      public/index.html
  5. 1 1
      src/components/bgBox/index.vue
  6. 22 7
      src/util/index.js
  7. 15 10
      src/views/Login.vue
  8. 21 10
      src/views/page1/index.vue
  9. 1 1
      src/views/page2/index.vue
  10. 5 1
      src/views/page2/item.vue
  11. 4 1
      src/views/page2/leftBox.vue

Rozdielové dáta súboru neboli zobrazené, pretože súbor je príliš veľký
+ 0 - 31
index.html


+ 0 - 54
index2.html
Zobraziť súbor 

@@ -1,54 +0,0 @@
 
-<!DOCTYPE html>
 
-<html lang="zh-CN">
 
-<head>
 
-    <meta charset="utf-8">
 
-    <title>鼠标穿透示例</title>
 
-    <style>
 
-        body {
 
-            margin: 0;
 
-            height: 100vh;
 
-            background-color: #f0f0f0;
 
-            display: flex;
 
-            justify-content: center;
 
-            align-items: center;
 
-        }
 
-        .container {
 
-            position: relative;
 
-            width: 300px;
 
-            height: 300px;
 
-            background-color: rgba(0, 150, 255, 0.5); /* 半透明 */
 
-            display: flex;
 
-            justify-content: center;
 
-            align-items: center;
 
-            color: white;
 
-            font-size: 24px;
 
-            text-align: center;
 
-        }
 
-        .transparent-area {
 
-            position: absolute;
 
-            top: 20px;  /* 设置透明区域的顶部位置 */
 
-            left: 20px; /* 设置透明区域的左边位置 */
 
-            width: 100px; /* 设置透明区域宽度 */
 
-            height: 100px; /* 设置透明区域高度 */
 
-            background-color: transparent; /* 透明度 */
 
-            pointer-events: none; /* 允许鼠标事件穿透 */
 
-        }
 
-        .underlying {
 
-            position: absolute;
 
-            width: 100px;
 
-            height: 100px;
 
-            background-color: orange;
 
-            top: 100px;
 
-            left: 100px;
 
-            z-index: -1; /* 确保位于底层 */
 
-        }
 
-    </style>
 
-</head>
 
-<body>
 
-    <div class="container">
 
-        <div>鼠标穿透示例</div>
 
-        <div class="transparent-area"></div> <!-- 允许鼠标穿透的区域 -->
 
-        <div class="underlying"></div> <!-- 背后的元素 -->
 
-    </div>
 
-</body>
 
-</html>

+ 45 - 0
mm/mm.config.js
Zobraziť súbor 

@@ -49,6 +49,51 @@ module.exports = async (util) => {
 
           )
 
         },
 
       }),
 
+      'post /api/login': util.side({
 
+        tags: [`公用`],
 
+        summary: `登录`,
 
+        schema: {
 
+          body: joi
 
+            .object({
 
+              userName: joi
 
+                .string()
 
+                .default(`admin`)
 
+                .required()
 
+                .description(`用户名`),
 
+              userPwd: joi
 
+                .string()
 
+                .default(`123456`)
 
+                .required()
 
+                .description(`密码`),
 
+            })
 
+            .description(`用户信息`),
 
+        },
 
+        async action(req, res) {
 
+          const { userName, userPwd } = req.body
 
+          if (userName == `admin` && userPwd == `123456`) {
 
+            res.json(
 
+              wrapApiData(
 
+                util.libObj.mockjs.mock({
 
+                  data: {
 
+                    token: `@uuid`,
 
+                  },
 
+                })
 
+              )
 
+            )
 
+          } else {
 
+            res.status(401).json(
 
+              wrapApiData(
 
+                util.libObj.mockjs.mock({
 
+                  code: 401,
 
+                  data: {
 
+                    message: `用户名或密码错误`,
 
+                  },
 
+                })
 
+              )
 
+            )
 
+          }
 
+        },
 
+      }),
 
       'get /api/mapOfTongren': util.side({
 
         tags: [`公用`],
 
         summary: `铜仁地图数据`,

+ 1 - 0
public/index.html
Zobraziť súbor 

@@ -13,6 +13,7 @@
 
     <script src="//cdn.jsdelivr.net/npm/echarts-gl/dist/echarts-gl.min.js"></script>
 
     <script src="//cdn.jsdelivr.net/npm/echarts-liquidfill@3.1.0/dist/echarts-liquidfill.min.js"></script>
 
     <script src="//cdn.staticfile.org/axios/0.19.0/axios.min.js"></script>
 
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.5.2/animate.min.css">
 
     <noscript>
 
       <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
 
     </noscript>

+ 1 - 1
src/components/bgBox/index.vue
Zobraziť súbor 

@@ -50,7 +50,7 @@
 
       </div>
 
     </div>
 
     <div class="box">
 
-      <slot>内容区</slot>
 
+      <slot>&nbsp;</slot>
 
     </div>
 
     <div :class="[`bg`, bgType]"></div>
 
   </div>

+ 22 - 7
src/util/index.js
Zobraziť súbor 

@@ -21,20 +21,35 @@ function isType(data, type = undefined) {
 
     }
 
   ]
 
 **/
 
-function autoVueFn(autoList = [], vm) {
 
-  vm._timer = []
 
-  autoList.forEach((item) => {
 
-    const fn = () => {
 
-      item.fn.call(vm)
 
+function autoVueFn(autoList = [], opt) {
 
+  if (!opt) {
 
+    opt = {
 
+      vm: this,
 
+    }
 
+  } else if (opt.$attrs) {
 
+    opt = {
 
+      vm: opt,
 
+    }
 
+  }
 
+  const { vm, batEnd } = opt
 
+  let end = 0
 
+  vm.timer_ = []
 
+  autoList.forEach(async (item) => {
 
+    const fn = async () => {
 
+      await item.fn.call(vm)
 
+      end = end + 1
 
+      if (end >= autoList.length) {
 
+        batEnd && batEnd.call(vm)
 
+      }
 
     }
 
     fn()
 
     const timer = setInterval(fn, item.time)
 
-    vm._timer.push(timer)
 
+    vm.timer_.push(timer)
 
   })
 
   vm.$options.beforeDestroy = [
 
     ...(vm.$options.beforeDestroy || []),
 
     function () {
 
-      vm._timer.forEach((item) => {
 
+      vm.timer_.forEach((item) => {
 
         console.log(`卸载`, item)
 
         clearInterval(item)
 
       })

+ 15 - 10
src/views/Login.vue
Zobraziť súbor 

@@ -91,18 +91,23 @@ export default {
 
   created() {},
 
   mounted() {},
 
   methods: {
 
-    login() {
 
-      if (this.userName == `admin` && this.userPwd == `123456`) {
 
-        this.$router.push({
 
-          path: `/page1`,
 
+    async login() {
 
+      await this.$http
 
+        .post(`/api/login`, {
 
+          userName: this.userName,
 
+          userPwd: this.userPwd,
 
         })
 
-      } else {
 
-        this.$Toast({
 
-          content: `请输入正确的用户名和密码`,
 
-          type: `error`,
 
-          // hasClose: true
 
+        .then((res) => {
 
+          this.$router.push({
 
+            path: `/page1`,
 
+          })
 
+        })
 
+        .catch(() => {
 
+          this.$Toast({
 
+            content: `请输入正确的用户名和密码`,
 
+            type: `error`,
 
+          })
 
         })
 
-      }
 
     },
 
     confirm() {
 
       this.visible = false

+ 21 - 10
src/views/page1/index.vue
Zobraziť súbor 

@@ -4,10 +4,12 @@
 
       style="position: absolute; top: 115px; left: 50px"
 
       title="实时统计"
 
       :data="statisticsData"
 
+      class="animated fadeInLeft"
 
       v-if="isCake"
 
     />
 
     <cylindricalHistogram
 
       style="position: absolute; left: 50px; top: 430px"
 
+      class="animated fadeInLeft"
 
       v-if="isGetData"
 
       :unit="`公斤/产量`"
 
       title="各区域移栽产量分析"
 
@@ -17,6 +19,7 @@
 
     <weatherForecast
 
       :unit="`摄氏度`"
 
       style="position: absolute; left: 50px; top: 760px"
 
+      class="animated fadeInLeft"
 
       v-if="isWeather"
 
       title="天气预报"
 
       :area="Weatherarea"
 
@@ -27,6 +30,7 @@
 
       :unit="`平方米/面积`"
 
       id="`wavyLineChart`"
 
       style="position: absolute; right: 50px; top: 115px"
 
+      class="animated fadeInRight"
 
       v-if="isWavyLine"
 
       title="各区域移栽面积"
 
       :area.sync="wavyLineArea"
 
@@ -35,6 +39,7 @@
 
     />
 
     <HorizontalHistogram
 
       style="position: absolute; right: 50px; top: 430px"
 
+      class="animated fadeInRight"
 
       v-if="isHorizontal"
 
       id="`移栽情况分析`"
 
       title="移栽情 况分析"
 
@@ -44,12 +49,14 @@
 
     <wavyLineChart
 
       id="`移栽趋势分析`"
 
       style="position: absolute; right: 50px; top: 760px"
 
+      class="animated fadeInRight"
 
       v-if="isWavyLine"
 
       title="移栽趋势分析"
 
       :area.sync="trendarea"
 
       :dataArray.sync="trendDataArray"
 
     />
 
     <threeMap
 
+      class="animated zoomIn"
 
       style="
 
         position: absolute;
 
         top: 50%;
 
@@ -85,6 +92,7 @@ export default {
 
   },
 
   data() {
 
     return {
 
+      autoVueFnInit: false,
 
       statisticsData: {
 
         title: `目标完成率`,
 
         value: 0,
 
@@ -128,6 +136,7 @@ export default {
 
   },
 
   computed: {},
 
   created() {
 
+    this.getJSON()
 
     this.$util.autoVueFn(
 
       [
 
         {
 
@@ -155,14 +164,16 @@ export default {
 
           fn: this.getTrendAnalysis,
 
         },
 
       ],
 
-      this
 
+      {
 
+        vm: this,
 
+        batEnd() {
 
+          this.autoVueFnInit = true
 
+        },
 
+      }
 
     )
 
-    this.getJSON()
 
     // this.$http.get(`https://httpbin.org/get`)
 
   },
 
-  mounted() {
 
-    screenSize(this.$refs.editor)
 
-  },
 
+  mounted() {},
 
   methods: {
 
     tabChange(val) {
 
       if (val === 0) {
 
@@ -173,7 +184,7 @@ export default {
 
       console.log(`val`, val)
 
     },
 
     getAnalysisOfTransplantYieldInVariousRegions() {
 
-      this.$http
 
+      return this.$http
 
         .get(`/api/analysisOfTransplantYieldInVariousRegions`)
 
         .then((res) => {
 
           const area = []
 
@@ -188,7 +199,7 @@ export default {
 
         })
 
     },
 
     getWeatherForecast() {
 
-      this.$http.get(`/api/weatherForecast`).then((res) => {
 
+      return this.$http.get(`/api/weatherForecast`).then((res) => {
 
         const area = []
 
         const dataArray = []
 
         res.forEach((element) => {
 
@@ -201,7 +212,7 @@ export default {
 
       })
 
     },
 
     getTransplantAreaInEachRegion() {
 
-      this.$http.get(`/api/transplantAreaInEachRegion`).then((res) => {
 
+      return this.$http.get(`/api/transplantAreaInEachRegion`).then((res) => {
 
         const area = []
 
         const dataArray = {
 
           LastYear: [],
 
@@ -236,7 +247,7 @@ export default {
 
       })
 
     },
 
     getStatistics() {
 
-      this.$http.get(`/api/realTimeStatistics`).then((res) => {
 
+      return this.$http.get(`/api/realTimeStatistics`).then((res) => {
 
         const obj = this.statisticsData
 
         // eslint-disable-next-line no-prototype-builtins
 
         if (res.hasOwnProperty(obj.title)) {
 
@@ -262,7 +273,7 @@ export default {
 
       })
 
     },
 
     getTrendAnalysis() {
 
-      this.$http.get(`/api/transplantTrendAnalysis`).then((res) => {
 
+      return this.$http.get(`/api/transplantTrendAnalysis`).then((res) => {
 
         const area = []
 
         const dataArray = {
 
           LastYear: [],

+ 1 - 1
src/views/page2/index.vue
Zobraziť súbor 

@@ -1,7 +1,7 @@
 
 <template>
 
   <div>
 
     <bgBox class="bgBox" bgType="g-bg2" :tabChange="tabChange" :tabIndex="1">
 
-      <leftBox class="lefBox" />
 
+      <leftBox class="lefBox animated fadeInLeft" />
 
       <cmap />
 
       <HorizontalHistogram
 
         style="position: absolute; right: 50px; top: 115px; z-index: 10"

+ 5 - 1
src/views/page2/item.vue
Zobraziť súbor 

@@ -1,6 +1,10 @@
 
 <template>
 
   <div class="list">
 
-    <div class="containerBox" v-for="(item, index) in list" :key="index">
 
+    <div
 
+      class="containerBox animated fadeInDown"
 
+      v-for="(item, index) in list"
 
+      :key="index"
 
+    >
 
       <div class="left">
 
         <p class="title">{{ item.名称 }}</p>
 
         <p>种植数量：{{ item.已种植 }}</p>

+ 4 - 1
src/views/page2/leftBox.vue
Zobraziť súbor 

@@ -54,7 +54,10 @@ export default {
 
           名称_like: this.leftBox.input || undefined,
 
         },
 
       })
 
-      this.leftBox.list = data
 
+      this.leftBox.list = []
 
+      this.$nextTick(() => {
 
+        this.leftBox.list = data
 
+      })
 
     },
 
     clearFn() {
 
       this.leftBox.input = ``

Niektoré súbory nie sú zobrazené, pretože je v týchto rozdielových dátach zmenené mnoho súborov