init

src/App.vue

@@ -0,0 +1,26 @@
+<template>
+  <div id="app">
+    <v-toast v-show="showToast"></v-toast>
+    <v-dialog v-show="showAlert"></v-dialog>
+    <router-view/>
+  </div>
+</template>
+
+<script>
+import toast from '@/components/toast'
+import dialog from '@/components/dialog'
+import { mapGetters } from 'vuex'
+export default {
+  name: 'App',
+  components: {
+    'v-toast': toast,
+    'v-dialog': dialog
+  },
+  data () {
+    return {}
+  },
+  computed: {
+    ...mapGetters(['showToast', 'showAlert'])
+  }
+}
+</script>

src/assets/css/iconfont.styl

@@ -0,0 +1,18 @@
+@font-face {
+  font-family: "iconfont"; /* Project id 1255596 */
+  src: url('iconfont/iconfont.woff2?t=1620977303191') format('woff2'),
+       url('iconfont/iconfont.woff?t=1620977303191') format('woff'),
+       url('iconfont/iconfont.ttf?t=1620977303191') format('truetype');
+}
+
+.iconfont {
+  font-family: "iconfont" !important;
+  font-size: 16px;
+  font-style: normal;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+.icon-guanbi:before {
+  content: "\e60f";
+}

src/assets/css/iconfont/iconfont.json

@@ -0,0 +1,37 @@
+{
+  "id": "1255596",
+  "name": "nl-hht-hl",
+  "font_family": "iconfont",
+  "css_prefix_text": "icon-",
+  "description": "",
+  "glyphs": [
+    {
+      "icon_id": "2229060",
+      "name": "无信号",
+      "font_class": "no-signal",
+      "unicode": "e76b",
+      "unicode_decimal": 59243
+    },
+    {
+      "icon_id": "400034",
+      "name": "下拉",
+      "font_class": "htmal5icon03",
+      "unicode": "e626",
+      "unicode_decimal": 58918
+    },
+    {
+      "icon_id": "731140",
+      "name": "选择",
+      "font_class": "guanbi1",
+      "unicode": "e608",
+      "unicode_decimal": 58888
+    },
+    {
+      "icon_id": "4736203",
+      "name": "关闭",
+      "font_class": "guanbi",
+      "unicode": "e60f",
+      "unicode_decimal": 58895
+    }
+  ]
+}

src/assets/css/mixin.styl

@@ -0,0 +1,47 @@
+$green = #30EBC9
+$yellow = #E2BB0E
+$gray = #516282
+$orange = #F96700
+$green2 = #65d837
+
+.green
+  background-color $green
+.yellow
+  background-color $yellow
+.gray
+  background-color $gray
+.orange
+  background-color $orange
+.green2
+  background-color $green2
+
+//宽高
+_wh(w, h)
+  width: w
+  height: h
+
+//字体大小、行高、颜色
+_font(size,height,color=#ffffff,weight=normal,align=center)
+  font-size: size
+  line-height: height
+  color: color
+  font-weight: weight
+  text-align: align
+
+// 背景图片地址和大小
+_bis(url,w=100%,h=100%,x=center,y=center,r=no-repeat)
+  background-position: x y
+  background-size: w h
+  background-image: url(url)
+  background-repeat: r
+
+// 背景图片改变颜色
+_shadow(w,c)
+  filter drop-shadow(w 0 0 c)
+
+//flex 布局和 子元素 对其方式
+_fj(c=column, x=space-between,y=center)
+  display: flex
+  flex-direction: c
+  justify-content: x
+  align-items: y

src/assets/css/reset.css

@@ -0,0 +1,154 @@
+html, body, div, span, applet, object, iframe,
+h1, h2, h3, h4, h5, h6, p, blockquote, pre,
+a, abbr, acronym, address, big, cite, code,
+del, dfn, em, img, ins, kbd, q, s, samp,
+small, strike, strong, sub, sup, tt, var,
+b, u, i, center,
+dl, dt, dd, ol, ul, li,
+fieldset, form, label, legend,
+table, caption, tbody, tfoot, thead, tr, th, td,
+article, aside, canvas, details, embed,
+figure, figcaption, footer, header,
+menu, nav, output, ruby, section, summary,
+time, mark, audio, video, input {
+    margin: 0;
+    padding: 0;
+    border: 0;
+    font-size: 0.16rem;
+    line-height: inherit;
+    color: #ffffff;
+    font-weight: normal;
+    vertical-align: baseline;
+}
+ 
+/* HTML5 display-role reset for older browsers */
+article, aside, details, figcaption, figure,
+footer, header, menu, nav, section {
+     display: block;
+}
+ 
+body {
+     line-height: 1;
+}
+ 
+blockquote, q {
+     quotes: none;
+}
+
+ blockquote:before, blockquote:after,
+q:before, q:after {
+     content: none;
+}
+ 
+table {
+     border-collapse: collapse;
+     border-spacing: 0;
+}
+ 
+/* custom */
+a,a:link,a:visited,a:active {
+     color: #7e8c8d;
+     text-decoration: none;
+     -webkit-backface-visibility: hidden;
+}
+ 
+li {
+     list-style: none;
+}
+ 
+::-webkit-scrollbar {
+     width: 5px;
+     height: 5px;
+}
+ 
+::-webkit-scrollbar-track-piece {
+     background-color: rgba(0, 0, 0, 0.2);
+     -webkit-border-radius: 6px;
+}
+ 
+::-webkit-scrollbar-thumb:vertical {
+     height: 5px;
+     background-color: rgba(125, 125, 125, 0.7);
+     -webkit-border-radius: 6px;
+}
+ 
+::-webkit-scrollbar-thumb:horizontal {
+     width: 5px;
+     background-color: rgba(125, 125, 125, 0.7);
+     -webkit-border-radius: 6px;
+}
+ 
+html, body {
+     width: 100%;
+     max-width: 1920px;
+     min-width: 1550px;
+     height: 1040px;
+     /* width: 1920px;
+     height: 1040px; */
+}
+ 
+body {
+     -webkit-text-size-adjust: none;
+     -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
+     -moz-user-select:none;/*火狐*/
+     -webkit-user-select:none;/*webkit浏览器*/
+     -ms-user-select:none;/*IE10*/
+     -khtml-user-select:none;/*早期浏览器*/
+     user-select:none;
+     background: #05032a center center / 100% 100% url(../../assets/images/bg.png) no-repeat;
+}
+
+div, p {
+     box-sizing: border-box;
+}
+
+.clearfix { 
+    zoom: 1; 
+}
+    
+.clearfix:after {
+    content: "";
+    display: table;
+    clear: both;
+}
+    
+.ellipsis {
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+    
+.fl {
+    float: left !important;
+} 
+
+.fr {
+    float: right !important;
+}
+
+.hide {
+     visibility: hidden;
+}
+
+.fontselect {
+    -moz-user-select:none;/*火狐*/
+    -webkit-user-select:none;/*webkit浏览器*/
+    -ms-user-select:none;/*IE10*/
+    -khtml-user-select:none;/*早期浏览器*/
+    user-select:none;
+}
+
+.flexcenter {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+}
+
+.pl10 {padding-left: 10px;}
+.pl20 {padding-left: 20px;}
+.mgb3 {margin-bottom: .03rem;}
+.mgb14 {margin-bottom: .14rem;}
+.mgb08 {margin-bottom: .08rem;}
+.mgt3 { margin-top: .03rem;}
+.mgt80 { margin-top: .8rem;}