添加全局

package-lock.json

@@ -7101,8 +7101,8 @@
     },
     "lodash": {
       "version": "4.17.21",
-      "resolved": "https://registry.npm.taobao.org/lodash/download/lodash-4.17.21.tgz",
-      "integrity": "sha1-Z5WRxWTDv/quhFTPCz3zcMPWkRw="
+      "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz",
+      "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg=="
     },
     "lodash.debounce": {
       "version": "4.0.8",
@@ -11578,6 +11578,11 @@
       "integrity": "sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c=",
       "dev": true
     },
+    "typescript": {
+      "version": "3.9.10",
+      "resolved": "https://registry.npmjs.org/typescript/-/typescript-3.9.10.tgz",
+      "integrity": "sha512-w6fIxVE/H1PkLKcCPsFqKE7Kv7QUwhU8qQY2MueZXWx5cPZdwFupLgKK3vntcK98BtNHZtAF4LA/yl2a7k8R6Q=="
+    },
     "uglify-js": {
       "version": "3.4.10",
       "resolved": "https://registry.nlark.com/uglify-js/download/uglify-js-3.4.10.tgz",
@@ -12015,6 +12020,14 @@
       "integrity": "sha1-HuO8mhbsv1EYvjNLsV+cRvgvWCU=",
       "dev": true
     },
+    "vue-text-format": {
+      "version": "1.2.6",
+      "resolved": "https://registry.npmjs.org/vue-text-format/-/vue-text-format-1.2.6.tgz",
+      "integrity": "sha512-sElP1rPPiNNrzVB+Sx/3QxF/bumsA5Nrv+PDLZQAlTEqn+ll3JIacaGFovhWH8NFjjXqw/0+joYkabWM20sCdg==",
+      "requires": {
+        "typescript": "^3.6.3"
+      }
+    },
     "vuex": {
       "version": "3.6.2",
       "resolved": "https://registry.nlark.com/vuex/download/vuex-3.6.2.tgz",

package.json

@@ -20,6 +20,7 @@
     "js-base64": "^2.5.1",
     "js-cookie": "^2.2.0",
     "js-md5": "^0.7.3",
+    "lodash": "^4.17.21",
     "mockjs": "^1.0.1-beta3",
     "node-gyp": "^5.0.6",
     "nprogress": "^0.2.0",
@@ -29,6 +30,7 @@
     "vue-axios": "^2.1.2",
     "vue-i18n": "^8.7.0",
     "vue-router": "^3.0.1",
+    "vue-text-format": "^1.2.6",
     "vuex": "^3.1.1"
   },
   "devDependencies": {

src/components/basic-block/main.vue

@@ -71,8 +71,7 @@ export default {
   }
 }
 </script>
-
-<style lang="scss">
+<style lang="scss" scoped>
 .basic-block {
   opacity: 0;
 

src/main.js

@@ -22,6 +22,8 @@ import thirdRegister from './components/third-register/main';
 import avueUeditor from 'avue-plugin-ueditor';
 import website from '@/config/website';
 import crudCommon from '@/mixins/crud';
+import format from 'vue-text-format';//v-format
+
 // 注册全局crud驱动
 window.$crudCommon = crudCommon;
 // 加载Vue拓展
@@ -36,6 +38,7 @@ Vue.use(window.AVUE, {
   calcHeight: 65,
   i18n: (key, value) => i18n.t(key, value)
 });
+Vue.use(format);//v-format
 // 注册全局容器
 Vue.component('basicContainer', basicContainer);
 Vue.component('basicBlock', basicBlock);

src/styles/variables.scss

@@ -2,4 +2,10 @@
 $mainBg: #409eff;
 .avue-form__menu--center {
   text-align: right;
+}
+.el-col {
+  margin-bottom: 0px !important;
+}
+p{
+  margin: 0 !important;
 }

src/util/filters.js

@@ -0,0 +1,4 @@
+//金额千分符
+export function thousandsFormatting(amount) {
+    return this.textFormat(amount,'#,##0.00')
+}

src/views/maintenance/priceManagement/detailsPageEdit.vue

@@ -26,7 +26,7 @@
                 <el-date-picker v-if="item.type === 'datetime'" style="width: 100%;" v-model="form[item.prop]" size="small" type="datetime" placeholder="选择日期" value-format="yyyy-MM-dd HH:mm:ss"/>
                 <span v-else-if="item.type === 'select'">
                   <el-select v-model="form[item.prop]" slot="prepend" style="width: 100%;" size="small" placeholder="请选择">
-                  <el-option v-for="item in item.dicData" :label="item.label" :value="item.value"></el-option>
+                  <el-option v-for="(item,index2) in item.dicData" :key="index2" :label="item.label" :value="item.value"></el-option>
                 </el-select>
                 </span>
                 <el-input type="age" v-else v-model="form[item.prop]" size="small" autocomplete="off"></el-input>

src/views/wel/components/butCard.vue

@@ -0,0 +1,44 @@
+<template>
+  <div style="padding:5px">
+    <div class="card">
+      <div class="card-content">
+        <i :class="iconName"></i>
+        <div>{{ name }}</div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {};
+  },
+  props: {
+    name: {
+      type: String
+    },
+    iconName: {
+      type: String
+    }
+  },
+  methods: {}
+};
+</script>
+
+<style lang="scss" scoped>
+.card{
+  background: #ff7d13;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  height: 14vh;
+  .card-content{
+    text-align: center;
+    color: #fff;
+    i{
+      font-size: 30px;
+    }
+  }
+}
+</style>

src/views/wel/components/card.vue

@@ -4,7 +4,9 @@
       <div class="card-head">
         <span> <i :class="iconName" class="index-icon"></i>{{title}}</span>
       </div>
-      <div class="card-content"></div>
+      <div class="card-content">
+        <slot name='content'></slot>
+      </div>
     </div>
   </div>
 </template>
@@ -42,7 +44,7 @@ export default {
     border-right: 1px solid #d6d6d6;
     border-bottom: 1px solid #d6d6d6;
     padding: 10px;
-    height: 18.2vh;
+    height: 100%;
   }
 }
 .index-icon {

src/views/wel/index.vue

@@ -1,22 +1,74 @@
 <template>
   <basic-container>
-    <el-row>
+    <div class="container">
+      <div class="container-items">
+        <but-card iconName="el-icon-edit-outline" name="新建工单" />
+        <but-card iconName="el-icon-edit-outline" name="新建工单" />
+        <but-card iconName="el-icon-edit-outline" name="新建工单" />
+        <but-card iconName="el-icon-edit-outline" name="新建工单" />
+        <but-card iconName="el-icon-edit-outline" name="新建工单" />
+        <but-card iconName="el-icon-edit-outline" name="新建工单" />
+        <but-card iconName="el-icon-edit-outline" name="新建工单" />
+        <but-card iconName="el-icon-edit-outline" name="新建工单" />
+        <but-card iconName="el-icon-edit-outline" name="新建工单" />
+        <but-card iconName="el-icon-edit-outline" name="新建工单" />
+      </div>
+      <index-card title="今日工作看板" iconName="el-icon-view">
+        <div slot="content" style="height:25vh"></div>
+      </index-card>
+      <index-card title="待办事项" iconName="el-icon-s-fold">
+        <div slot="content" style="height:17vh"></div>
+      </index-card>
+      <index-card title="今日营业" iconName="el-icon-chat-line-round">
+        <div slot="content" style="height:17vh" class="operate">
+          <div class="operate-item">
+            <div>
+              今日到店
+              <p>0</p>
+              台次
+            </div>
+          </div>
+          <div class="operate-item">
+            <div>
+              今日到店
+              <p>0</p>
+              台次
+            </div>
+          </div>
+          <div class="operate-item">
+            <div>
+              今日到店
+              <p>0</p>
+              台次
+            </div>
+          </div>
+        </div>
+      </index-card>
+      <index-card title="客户数据" iconName="el-icon-user">
+        <div slot="content" style="height:17vh">1</div>
+      </index-card>
+      <index-card title="新闻公告" iconName="el-icon-s-fold">
+        <div slot="content" style="height:17vh">1</div>
+      </index-card>
+    </div>
+    <!-- <el-row>
       <el-col :span="12">
-         <index-card title="标题" iconName="el-icon-view"></index-card>
-        <!-- <el-row>
-          <el-col :span="6">
-            <div class="but-card">
-              <div>
-                <i class="el-icon-s-order"></i>
-              </div>
-              <div>
-                工单新建
+        <div class="home-brand">
+          <div>
+            <div class="index" style="padding:10px">
+              <div class="but-card">
+                <div class="content">
+                  <div class="icon">
+                    <i class="el-icon-folder-add "></i>
+                  </div>
+                  <div class="name">
+                    工单新建
+                  </div>
+                </div>
               </div>
             </div>
-          </el-col>
-          <el-col :span="6"> </el-col>
-          <el-col :span="6"> </el-col>
-        </el-row> -->
+          </div>
+        </div>
       </el-col>
       <el-col :span="12">
         <index-card title="今日工作看板" iconName="el-icon-view"></index-card>
@@ -40,13 +92,14 @@
       <el-col :span="12">
         <index-card title="新闻公告" iconName="el-icon-s-fold"></index-card>
       </el-col>
-    </el-row>
+    </el-row> -->
   </basic-container>
 </template>
 
 <script>
 import { mapGetters } from "vuex";
 import indexCard from "./components/card.vue";
+import butCard from "./components/butCard.vue";
 export default {
   name: "wel",
   data() {
@@ -56,7 +109,8 @@ export default {
     };
   },
   components: {
-    indexCard
+    indexCard,
+    butCard
   },
   computed: {
     ...mapGetters(["userInfo"])
@@ -68,12 +122,36 @@ export default {
   }
 };
 </script>
-
-<style>
-.el-font-size {
-  font-size: 14px;
+<style lang="scss" scoped>
+.container {
+  display: grid;
+  grid-template-columns: repeat(auto-fill, 50%);
+  grid-template-rows: 40% 30% 30%;
+  height: 80vh;
+  .container-items {
+    display: grid;
+    grid-template-columns: repeat(auto-fill, 20%);
+    grid-template-rows: repeat(auto-fill, 50%);
+    align-items: center;
+  }
 }
-.but-card{
-  background:#FF7D13;
+//今日营业
+.operate {
+  display: grid;
+  grid-template-rows: repeat(auto-fill, 33.33%);
+  .operate-item {
+    display: flex;
+    align-items: center;
+    div {
+      display: flex;
+      align-items: end;
+      font-size: 14px;
+    }
+    p {
+      font-size: 24px;
+      line-height: 24px;
+      margin: 0 4px !important;
+    }
+  }
 }
 </style>

vue.config.js

@@ -26,11 +26,11 @@ module.exports = {
     proxy: {
       '/api': {
         //本地服务接口地址
-        // target: 'http://192.168.1.177',
+        target: 'http://192.168.1.177',
         //远程演示服务地址,可用于直接启动项目
         // target: 'https://saber.bladex.vip/api',
         // 打包地址
-        target: 'http://121.37.83.47:10004',
+        // target: 'http://121.37.83.47:10004',
         ws: true,
         pathRewrite: {
           '^/api': '/'