BJ_web_developers / huangshi

Commit 5fcc13527ca6ce2cc8ef562241b1f3786b8399b7

Authored by Andy
1 parent 09fb20ce

add 车主模板 左侧菜单

Inline Side-by-side
Showing 49 changed files with 3739 additions and 80 deletions
package.json
  View file @5fcc135
... ... @@ -10,6 +10,7 @@
10 10 "build": "node build/build.js"
11 11 },
12 12 "dependencies": {
  13 + "element-ui": "^2.10.1",
13 14 "node-sass": "^4.12.0",
14 15 "sass-loader": "^7.1.0",
15 16 "vue": "^2.5.2",
... ...
src/App.vue
  View file @5fcc135
... ... @@ -29,9 +29,16 @@ export default {
29 29 -moz-osx-font-smoothing: grayscale;
30 30 text-align: center;
31 31 font-size: 14px;
  32 + display: -webkit-box;
  33 + display: -ms-flexbox;
  34 + -webkit-box-orient: vertical;
  35 + -webkit-box-direction: normal;
  36 + -ms-flex-flow: column;
  37 + flex-flow: column;
32 38 }
33 39  
34 40 .wrap {
35 41 flex: 1;
  42 + height: 100%;
36 43 }
37 44 </style>
... ...
src/assets/service/icon_analyze.png 0 → 100755
View file @5fcc135

635 Bytes
src/assets/service/icon_create.png 0 → 100755
View file @5fcc135

550 Bytes
src/assets/service/icon_home.png 0 → 100755
View file @5fcc135

604 Bytes
src/assets/service/icon_myact.png 0 → 100755
View file @5fcc135

558 Bytes
src/assets/service/icon_user.png 0 → 100755
View file @5fcc135

562 Bytes
src/components/NavMenu.vue 0 → 100755
  View file @5fcc135
  1 +<template>
  2 + <div class="navMenu">
  3 +
  4 + <label v-for="navMenu in navMenus">
  5 +
  6 + <el-menu-item v-if="navMenu.childs==null&&navMenu.entity"
  7 + :key="navMenu.entity.id" :data="navMenu" :index="navMenu.entity.url">
  8 + <i :class="navMenu.entity.icon"></i>
  9 + <span slot="title">{{navMenu.entity.title}}</span>
  10 + </el-menu-item>
  11 +
  12 + <el-submenu v-if="navMenu.childs&&navMenu.entity"
  13 + :key="navMenu.entity.id" :data="navMenu" :index="navMenu.entity.url">
  14 + <template slot="title">
  15 + <i :class="navMenu.entity.icon"></i>
  16 + <span>{{navMenu.entity.title}}</span>
  17 + </template>
  18 + <NavMenu :navMenus="navMenu.childs"></NavMenu>
  19 + </el-submenu>
  20 + </label>
  21 +
  22 + </div>
  23 +</template>
  24 +
  25 +<script>
  26 + export default {
  27 + name: 'NavMenu',
  28 + props: ['navMenus'],
  29 + data() {
  30 + return {}
  31 + },
  32 + methods: {}
  33 + }
  34 +</script>
  35 +<style scoped>
  36 +
  37 +</style>
... ...
src/components/SvgIcon/index.vue 0 → 100644
  View file @5fcc135
  1 +<template>
  2 + <div v-if="isExternal" :style="styleExternalIcon" class="svg-external-icon svg-icon" v-on="$listeners" />
  3 + <svg v-else :class="svgClass" aria-hidden="true" v-on="$listeners">
  4 + <use :xlink:href="iconName" />
  5 + </svg>
  6 +</template>
  7 +
  8 +<script>
  9 +// doc: https://panjiachen.github.io/vue-element-admin-site/feature/component/svg-icon.html#usage
  10 +import { isExternal } from '@/utils/validate'
  11 +
  12 +export default {
  13 + name: 'SvgIcon',
  14 + props: {
  15 + iconClass: {
  16 + type: String,
  17 + required: true
  18 + },
  19 + className: {
  20 + type: String,
  21 + default: ''
  22 + }
  23 + },
  24 + computed: {
  25 + isExternal() {
  26 + return isExternal(this.iconClass)
  27 + },
  28 + iconName() {
  29 + return `#icon-${this.iconClass}`
  30 + },
  31 + svgClass() {
  32 + if (this.className) {
  33 + return 'svg-icon ' + this.className
  34 + } else {
  35 + return 'svg-icon'
  36 + }
  37 + },
  38 + styleExternalIcon() {
  39 + return {
  40 + mask: `url(${this.iconClass}) no-repeat 50% 50%`,
  41 + '-webkit-mask': `url(${this.iconClass}) no-repeat 50% 50%`
  42 + }
  43 + }
  44 + }
  45 +}
  46 +</script>
  47 +
  48 +<style scoped>
  49 +.svg-icon {
  50 + width: 1em;
  51 + height: 1em;
  52 + vertical-align: -0.15em;
  53 + fill: currentColor;
  54 + overflow: hidden;
  55 +}
  56 +
  57 +.svg-external-icon {
  58 + background-color: currentColor;
  59 + mask-size: cover!important;
  60 + display: inline-block;
  61 +}
  62 +</style>
... ...
src/components/VFooter.vue
  View file @5fcc135
... ... @@ -14,7 +14,8 @@ export default {
14 14 .footer{
15 15 height:64px;
16 16 line-height: 64px;
17   - background:rgba(6,8,10,1);
  17 + /*background:rgba(6,8,10,1);*/
  18 + background:#545c64;
18 19 color:rgba(255,255,255,0.65);
19 20 }
20 21 </style>
... ...
src/components/config.js 0 → 100755
  View file @5fcc135
  1 +let config = {
  2 + "entity": null,
  3 + "childs": [
  4 + {
  5 + "entity": {
  6 + "id": 1, //id标识
  7 + "title": "中心首页", //菜单标题
  8 + "icon": "el-icon-s-home",//菜单logo
  9 + "url": "/views/dashboard",//菜单路径
  10 + },
  11 + },
  12 + {
  13 + "entity": {
  14 + "id": 2,
  15 + "title": "我的钱包",
  16 + "icon": "el-icon-bank-card",
  17 + "url": "example",
  18 + },
  19 + "childs": [
  20 + {
  21 + "entity": {
  22 + "id": 2-1,
  23 + "title": "我的账户",
  24 + "url": "account",
  25 + },
  26 + "childs": null
  27 + },
  28 + {
  29 + "entity": {
  30 + "id": 2-2,
  31 + "title": "我的卡券",
  32 + "url": "cardticket",
  33 + }
  34 + },
  35 + ]
  36 + },
  37 + {
  38 + "entity": {
  39 + "id": 3,
  40 + "title": "我的订单",
  41 + "icon": "el-icon-tickets",
  42 + "url": "order",
  43 + },
  44 +
  45 + },
  46 + {
  47 + "entity": {
  48 + "id": 4,
  49 + "title": "欠费补缴",
  50 + "icon": "el-icon-document-checked",
  51 + "url": "payback",
  52 + }
  53 + },
  54 + {
  55 + "entity": {
  56 + "id": 5,
  57 + "title": "我的车辆",
  58 + "icon": "el-icon-truck",
  59 + "url": "mycar",
  60 + }
  61 + },
  62 + {
  63 + "entity": {
  64 + "id": 6,
  65 + "title": "个人中心",
  66 + "icon": "el-icon-s-custom",
  67 + "url": "mycar",
  68 + },
  69 + "childs": [
  70 + {
  71 + "entity": {
  72 + "id": 6-1,
  73 + "title": "个人资料",
  74 + "url": "information",
  75 + },
  76 + "childs": null
  77 + },
  78 + {
  79 + "entity": {
  80 + "id": 6-2,
  81 + "title": "我的评价",
  82 + "url": "myevaluate",
  83 + }
  84 + },
  85 + ]
  86 + },
  87 + ]
  88 +}
  89 +export default config
... ...
src/icons/index.js 0 → 100644
  View file @5fcc135
  1 +import Vue from 'vue'
  2 +import SvgIcon from '@/components/SvgIcon'// svg component
  3 +
  4 +// register globally
  5 +Vue.component('svg-icon', SvgIcon)
  6 +
  7 +const req = require.context('./svg', false, /\.svg$/)
  8 +const requireAll = requireContext => requireContext.keys().map(requireContext)
  9 +requireAll(req)
... ...
src/icons/svg/dashboard.svg 0 → 100644
  View file @5fcc135
  1 +<svg width="128" height="100" xmlns="http://www.w3.org/2000/svg"><path d="M27.429 63.638c0-2.508-.893-4.65-2.679-6.424-1.786-1.775-3.94-2.662-6.464-2.662-2.524 0-4.679.887-6.465 2.662-1.785 1.774-2.678 3.916-2.678 6.424 0 2.508.893 4.65 2.678 6.424 1.786 1.775 3.94 2.662 6.465 2.662 2.524 0 4.678-.887 6.464-2.662 1.786-1.775 2.679-3.916 2.679-6.424zm13.714-31.801c0-2.508-.893-4.65-2.679-6.424-1.785-1.775-3.94-2.662-6.464-2.662-2.524 0-4.679.887-6.464 2.662-1.786 1.774-2.679 3.916-2.679 6.424 0 2.508.893 4.65 2.679 6.424 1.785 1.774 3.94 2.662 6.464 2.662 2.524 0 4.679-.888 6.464-2.662 1.786-1.775 2.679-3.916 2.679-6.424zM71.714 65.98l7.215-27.116c.285-1.23.107-2.378-.536-3.443-.643-1.064-1.56-1.762-2.75-2.094-1.19-.33-2.333-.177-3.429.462-1.095.639-1.81 1.573-2.143 2.804l-7.214 27.116c-2.857.237-5.405 1.266-7.643 3.088-2.238 1.822-3.738 4.152-4.5 6.992-.952 3.644-.476 7.098 1.429 10.364 1.905 3.265 4.69 5.37 8.357 6.317 3.667.947 7.143.474 10.429-1.42 3.285-1.892 5.404-4.66 6.357-8.305.762-2.84.619-5.607-.429-8.305-1.047-2.697-2.762-4.85-5.143-6.46zm47.143-2.342c0-2.508-.893-4.65-2.678-6.424-1.786-1.775-3.94-2.662-6.465-2.662-2.524 0-4.678.887-6.464 2.662-1.786 1.774-2.679 3.916-2.679 6.424 0 2.508.893 4.65 2.679 6.424 1.786 1.775 3.94 2.662 6.464 2.662 2.524 0 4.679-.887 6.465-2.662 1.785-1.775 2.678-3.916 2.678-6.424zm-45.714-45.43c0-2.509-.893-4.65-2.679-6.425C68.68 10.01 66.524 9.122 64 9.122c-2.524 0-4.679.887-6.464 2.661-1.786 1.775-2.679 3.916-2.679 6.425 0 2.508.893 4.65 2.679 6.424 1.785 1.774 3.94 2.662 6.464 2.662 2.524 0 4.679-.888 6.464-2.662 1.786-1.775 2.679-3.916 2.679-6.424zm32 13.629c0-2.508-.893-4.65-2.679-6.424-1.785-1.775-3.94-2.662-6.464-2.662-2.524 0-4.679.887-6.464 2.662-1.786 1.774-2.679 3.916-2.679 6.424 0 2.508.893 4.65 2.679 6.424 1.785 1.774 3.94 2.662 6.464 2.662 2.524 0 4.679-.888 6.464-2.662 1.786-1.775 2.679-3.916 2.679-6.424zM128 63.638c0 12.351-3.357 23.78-10.071 34.286-.905 1.372-2.19 2.058-3.858 2.058H13.93c-1.667 0-2.953-.686-3.858-2.058C3.357 87.465 0 76.037 0 63.638c0-8.613 1.69-16.847 5.071-24.703C8.452 31.08 13 24.312 18.714 18.634c5.715-5.68 12.524-10.199 20.429-13.559C47.048 1.715 55.333.035 64 .035c8.667 0 16.952 1.68 24.857 5.04 7.905 3.36 14.714 7.88 20.429 13.559 5.714 5.678 10.262 12.446 13.643 20.301 3.38 7.856 5.071 16.09 5.071 24.703z"/></svg>
0 2 \ No newline at end of file
... ...
src/icons/svg/example.svg 0 → 100644
  View file @5fcc135
  1 +<svg width="128" height="128" xmlns="http://www.w3.org/2000/svg"><path d="M96.258 57.462h31.421C124.794 27.323 100.426 2.956 70.287.07v31.422a32.856 32.856 0 0 1 25.971 25.97zm-38.796-25.97V.07C27.323 2.956 2.956 27.323.07 57.462h31.422a32.856 32.856 0 0 1 25.97-25.97zm12.825 64.766v31.421c30.46-2.885 54.507-27.253 57.713-57.712H96.579c-2.886 13.466-13.146 23.726-26.292 26.291zM31.492 70.287H.07c2.886 30.46 27.253 54.507 57.713 57.713V96.579c-13.466-2.886-23.726-13.146-26.291-26.292z"/></svg>
0 2 \ No newline at end of file
... ...
src/icons/svg/eye-open.svg 0 → 100644
  View file @5fcc135
  1 +<svg class="icon" viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" width="128" height="128"><defs><style/></defs><path d="M512 128q69.675 0 135.51 21.163t115.498 54.997 93.483 74.837 73.685 82.006 51.67 74.837 32.17 54.827L1024 512q-2.347 4.992-6.315 13.483T998.87 560.17t-31.658 51.669-44.331 59.99-56.832 64.34-69.504 60.16-82.347 51.5-94.848 34.687T512 896q-69.675 0-135.51-21.163t-115.498-54.826-93.483-74.326-73.685-81.493-51.67-74.496-32.17-54.997L0 513.707q2.347-4.992 6.315-13.483t18.816-34.816 31.658-51.84 44.331-60.33 56.832-64.683 69.504-60.331 82.347-51.84 94.848-34.816T512 128.085zm0 85.333q-46.677 0-91.648 12.331t-81.152 31.83-70.656 47.146-59.648 54.485-48.853 57.686-37.675 52.821-26.325 43.99q12.33 21.674 26.325 43.52t37.675 52.351 48.853 57.003 59.648 53.845T339.2 767.02t81.152 31.488T512 810.667t91.648-12.331 81.152-31.659 70.656-46.848 59.648-54.186 48.853-57.344 37.675-52.651T927.957 512q-12.33-21.675-26.325-43.648t-37.675-52.65-48.853-57.345-59.648-54.186-70.656-46.848-81.152-31.659T512 213.334zm0 128q70.656 0 120.661 50.006T682.667 512 632.66 632.661 512 682.667 391.339 632.66 341.333 512t50.006-120.661T512 341.333zm0 85.334q-35.328 0-60.33 25.002T426.666 512t25.002 60.33T512 597.334t60.33-25.002T597.334 512t-25.002-60.33T512 426.666z"/></svg>
0 2 \ No newline at end of file
... ...
src/icons/svg/eye.svg 0 → 100644
  View file @5fcc135
  1 +<svg width="128" height="64" xmlns="http://www.w3.org/2000/svg"><path d="M127.072 7.994c1.37-2.208.914-5.152-.914-6.87-2.056-1.717-4.797-1.226-6.396.982-.229.245-25.586 32.382-55.74 32.382-29.24 0-55.74-32.382-55.968-32.627-1.6-1.963-4.57-2.208-6.397-.49C-.17 3.086-.399 6.275 1.2 8.238c.457.736 5.94 7.36 14.62 14.72L4.17 35.96c-1.828 1.963-1.6 5.152.228 6.87.457.98 1.6 1.471 2.742 1.471s2.284-.49 3.198-1.472l12.564-13.983c5.94 4.416 13.021 8.587 20.788 11.53l-4.797 17.418c-.685 2.699.686 5.397 3.198 6.133h1.37c2.057 0 3.884-1.472 4.341-3.68L52.6 42.83c3.655.736 7.538 1.227 11.422 1.227 3.883 0 7.767-.49 11.422-1.227l4.797 17.173c.457 2.208 2.513 3.68 4.34 3.68.457 0 .914 0 1.143-.246 2.513-.736 3.883-3.434 3.198-6.133l-4.797-17.172c7.767-2.944 14.848-7.114 20.788-11.53l12.336 13.738c.913.981 2.056 1.472 3.198 1.472s2.284-.49 3.198-1.472c1.828-1.963 1.828-4.906.228-6.87l-11.65-13.001c9.366-7.36 14.849-14.474 14.849-14.474z"/></svg>
0 2 \ No newline at end of file
... ...
src/icons/svg/form.svg 0 → 100644
  View file @5fcc135
  1 +<svg width="128" height="128" xmlns="http://www.w3.org/2000/svg"><path d="M84.068 23.784c-1.02 0-1.877-.32-2.572-.96a8.588 8.588 0 0 1-1.738-2.237 11.524 11.524 0 0 1-1.042-2.621c-.232-.895-.348-1.641-.348-2.238V0h.278c.834 0 1.622.085 2.363.256.742.17 1.645.575 2.711 1.214 1.066.64 2.363 1.535 3.892 2.686 1.53 1.15 3.453 2.664 5.77 4.54 2.502 2.045 4.494 3.771 5.977 5.178 1.483 1.406 2.618 2.6 3.406 3.58.787.98 1.274 1.812 1.46 2.494.185.682.277 1.278.277 1.79v2.046H84.068zM127.3 84.01c.278.682.464 1.535.556 2.558.093 1.023-.37 2.003-1.39 2.94-.463.427-.88.832-1.25 1.215-.372.384-.696.704-.974.96a6.69 6.69 0 0 1-.973.767l-11.816-10.741a44.331 44.331 0 0 0 1.877-1.535 31.028 31.028 0 0 1 1.737-1.406c1.112-.938 2.317-1.343 3.615-1.215 1.297.128 2.363.405 3.197.83.927.427 1.923 1.173 2.989 2.239 1.065 1.065 1.876 2.195 2.432 3.388zM78.23 95.902c2.038 0 3.752-.511 5.143-1.534l-26.969 25.83H18.037c-1.761 0-3.684-.47-5.77-1.407a24.549 24.549 0 0 1-5.838-3.709 21.373 21.373 0 0 1-4.518-5.306c-1.204-2.003-1.807-4.07-1.807-6.202V16.495c0-1.79.44-3.665 1.32-5.626A18.41 18.41 0 0 1 5.04 5.562a21.798 21.798 0 0 1 5.213-3.964C12.198.533 14.237 0 16.37 0h53.24v15.984c0 1.62.278 3.367.834 5.242a16.704 16.704 0 0 0 2.572 5.179c1.159 1.577 2.665 2.898 4.518 3.964 1.853 1.066 4.078 1.598 6.673 1.598h20.295v42.325L85.458 92.45c1.02-1.364 1.529-2.856 1.529-4.476 0-2.216-.857-4.113-2.572-5.69-1.714-1.577-3.776-2.366-6.186-2.366H26.1c-2.409 0-4.448.789-6.116 2.366-1.668 1.577-2.502 3.474-2.502 5.69 0 2.217.834 4.092 2.502 5.626 1.668 1.535 3.707 2.302 6.117 2.302h52.13zM26.1 47.951c-2.41 0-4.449.789-6.117 2.366-1.668 1.577-2.502 3.473-2.502 5.69 0 2.216.834 4.092 2.502 5.626 1.668 1.534 3.707 2.302 6.117 2.302h52.13c2.409 0 4.47-.768 6.185-2.302 1.715-1.534 2.572-3.41 2.572-5.626 0-2.217-.857-4.113-2.572-5.69-1.714-1.577-3.776-2.366-6.186-2.366H26.1zm52.407 64.063l1.807-1.663 3.476-3.196a479.75 479.75 0 0 0 4.587-4.284 500.757 500.757 0 0 1 5.004-4.667c3.985-3.666 8.48-7.758 13.485-12.276l11.677 10.741-13.485 12.404-5.004 4.603-4.587 4.22a179.46 179.46 0 0 0-3.267 3.068c-.88.853-1.367 1.322-1.46 1.407-.463.341-.973.703-1.529 1.087-.556.383-1.112.703-1.668.959-.556.256-1.413.575-2.572.959a83.5 83.5 0 0 1-3.545 1.087 72.2 72.2 0 0 1-3.475.895c-1.112.256-1.946.426-2.502.511-1.112.17-1.854.043-2.224-.383-.371-.426-.464-1.151-.278-2.174.092-.511.278-1.279.556-2.302.278-1.023.602-2.067.973-3.132l1.042-3.005c.325-.938.58-1.577.765-1.918a10.157 10.157 0 0 1 2.224-2.941z"/></svg>
0 2 \ No newline at end of file
... ...
src/icons/svg/give.svg 0 → 100644
  View file @5fcc135
  1 +<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1561604131415" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="8713" xmlns:xlink="http://www.w3.org/1999/xlink" width="48" height="48"><defs><style type="text/css"></style></defs><path d="M512 800c-6.4 0-19.2-6.4-25.6-12.8L249.6 499.2C236.8 492.8 236.8 473.6 243.2 467.2l70.4-134.4C320 320 326.4 313.6 339.2 313.6l345.6 0c12.8 0 25.6 6.4 25.6 19.2l70.4 134.4c6.4 12.8 6.4 25.6-6.4 32l-243.2 288C531.2 793.6 518.4 800 512 800zM307.2 473.6 512 716.8l204.8-243.2-51.2-96L358.4 377.6 307.2 473.6z" p-id="8714" fill="#409eff"></path><path d="M512 1024c-281.6 0-512-230.4-512-512s230.4-512 512-512 512 230.4 512 512c0 19.2-12.8 32-32 32S960 531.2 960 512c0-249.6-198.4-448-448-448S64 262.4 64 512s198.4 448 448 448c19.2 0 32 12.8 32 32S531.2 1024 512 1024z" p-id="8715" fill="#409eff"></path><path d="M992 864l-320 0c-19.2 0-32-12.8-32-32s12.8-32 32-32l320 0c19.2 0 32 12.8 32 32S1011.2 864 992 864z" p-id="8716" fill="#409eff"></path><path d="M832 1024c-19.2 0-32-12.8-32-32l0-320c0-19.2 12.8-32 32-32s32 12.8 32 32l0 320C864 1011.2 851.2 1024 832 1024z" p-id="8717" fill="#409eff"></path></svg>
0 2 \ No newline at end of file
... ...
src/icons/svg/link.svg 0 → 100644
  View file @5fcc135
  1 +<svg width="128" height="128" xmlns="http://www.w3.org/2000/svg"><path d="M115.625 127.937H.063V12.375h57.781v12.374H12.438v90.813h90.813V70.156h12.374z"/><path d="M116.426 2.821l8.753 8.753-56.734 56.734-8.753-8.745z"/><path d="M127.893 37.982h-12.375V12.375H88.706V0h39.187z"/></svg>
0 2 \ No newline at end of file
... ...
src/icons/svg/money.svg 0 → 100644
  View file @5fcc135
  1 +<svg width="128" height="128" xmlns="http://www.w3.org/2000/svg"><path d="M54.122 127.892v-28.68H7.513V87.274h46.609v-12.4H7.513v-12.86h38.003L.099 0h22.6l32.556 45.07c3.617 5.144 6.44 9.611 8.487 13.385 1.788-3.05 4.89-7.779 9.301-14.186L103.93 0h24.01L82.385 62.013h38.34v12.862h-46.41v12.4h46.41v11.937h-46.41v28.68H54.123z"/></svg>
0 2 \ No newline at end of file
... ...
src/icons/svg/nested.svg 0 → 100644
  View file @5fcc135
  1 +<svg width="128" height="128" xmlns="http://www.w3.org/2000/svg"><path d="M.002 9.2c0 5.044 3.58 9.133 7.998 9.133 4.417 0 7.997-4.089 7.997-9.133 0-5.043-3.58-9.132-7.997-9.132S.002 4.157.002 9.2zM31.997.066h95.981V18.33H31.997V.066zm0 45.669c0 5.044 3.58 9.132 7.998 9.132 4.417 0 7.997-4.088 7.997-9.132 0-3.263-1.524-6.278-3.998-7.91-2.475-1.63-5.524-1.63-7.998 0-2.475 1.632-4 4.647-4 7.91zM63.992 36.6h63.986v18.265H63.992V36.6zm-31.995 82.2c0 5.043 3.58 9.132 7.998 9.132 4.417 0 7.997-4.089 7.997-9.132 0-5.044-3.58-9.133-7.997-9.133s-7.998 4.089-7.998 9.133zm31.995-9.131h63.986v18.265H63.992V109.67zm0-27.404c0 5.044 3.58 9.133 7.998 9.133 4.417 0 7.997-4.089 7.997-9.133 0-3.263-1.524-6.277-3.998-7.909-2.475-1.631-5.524-1.631-7.998 0-2.475 1.632-4 4.646-4 7.91zm31.995-9.13h31.991V91.4H95.987V73.135z"/></svg>
0 2 \ No newline at end of file
... ...
src/icons/svg/password.svg 0 → 100644
  View file @5fcc135
  1 +<svg width="128" height="128" xmlns="http://www.w3.org/2000/svg"><path d="M108.8 44.322H89.6v-5.36c0-9.04-3.308-24.163-25.6-24.163-23.145 0-25.6 16.881-25.6 24.162v5.361H19.2v-5.36C19.2 15.281 36.798 0 64 0c27.202 0 44.8 15.281 44.8 38.961v5.361zm-32 39.356c0-5.44-5.763-9.832-12.8-9.832-7.037 0-12.8 4.392-12.8 9.832 0 3.682 2.567 6.808 6.407 8.477v11.205c0 2.718 2.875 4.962 6.4 4.962 3.524 0 6.4-2.244 6.4-4.962V92.155c3.833-1.669 6.393-4.795 6.393-8.477zM128 64v49.201c0 8.158-8.645 14.799-19.2 14.799H19.2C8.651 128 0 121.359 0 113.201V64c0-8.153 8.645-14.799 19.2-14.799h89.6c10.555 0 19.2 6.646 19.2 14.799z"/></svg>
0 2 \ No newline at end of file
... ...
src/icons/svg/people.svg 0 → 100644
  View file @5fcc135
  1 +<svg width="128" height="128" xmlns="http://www.w3.org/2000/svg"><path d="M104.185 95.254c8.161 7.574 13.145 17.441 13.145 28.28 0 1.508-.098 2.998-.285 4.466h-10.784c.238-1.465.403-2.948.403-4.465 0-8.983-4.36-17.115-11.419-23.216C86 104.66 75.355 107.162 64 107.162c-11.344 0-21.98-2.495-31.22-6.83-7.064 6.099-11.444 14.218-11.444 23.203 0 1.517.165 3 .403 4.465H10.955a35.444 35.444 0 0 1-.285-4.465c0-10.838 4.974-20.713 13.127-28.291C9.294 85.42.003 70.417.003 53.58.003 23.99 28.656.001 64 .001s63.997 23.988 63.997 53.58c0 16.842-9.299 31.85-23.812 41.673zM64 36.867c-29.454 0-53.33-10.077-53.33 15.342 0 25.418 23.876 46.023 53.33 46.023 29.454 0 53.33-20.605 53.33-46.023 0-25.419-23.876-15.342-53.33-15.342zm24.888 25.644c-3.927 0-7.111-2.665-7.111-5.953 0-3.288 3.184-5.954 7.11-5.954 3.928 0 7.111 2.666 7.111 5.954s-3.183 5.953-7.11 5.953zm-3.556 16.372c0 4.11-9.55 7.442-21.332 7.442-11.781 0-21.332-3.332-21.332-7.442 0-1.06.656-2.064 1.8-2.976 3.295 2.626 10.79 4.465 19.532 4.465 8.743 0 16.237-1.84 19.531-4.465 1.145.912 1.801 1.916 1.801 2.976zm-46.22-16.372c-3.927 0-7.11-2.665-7.11-5.953 0-3.288 3.183-5.954 7.11-5.954 3.927 0 7.111 2.666 7.111 5.954s-3.184 5.953-7.11 5.953z"/></svg>
0 2 \ No newline at end of file
... ...
src/icons/svg/phone.svg 0 → 100644
  View file @5fcc135
  1 +<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1562056404689" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4051" xmlns:xlink="http://www.w3.org/1999/xlink" width="32" height="32"><defs><style type="text/css"></style></defs><path d="M191.918519 959.457008l-0.031722-895.446136 639.72601 0-0.072655 895.446136L191.918519 959.457008zM517.665535 923.471422c32.980135 0 59.696614-26.715455 59.696614-59.697637 0-32.985252-26.716478-59.69559-59.696614-59.69559-32.985252 0-59.69559 26.710338-59.69559 59.69559C457.968921 896.754944 484.680283 923.471422 517.665535 923.471422L517.665535 923.471422zM767.400343 128.005372 255.832178 128.005372l0 639.310547 511.568165 0L767.400343 128.005372 767.400343 128.005372zM767.400343 128.005372" p-id="4052" fill="#889aa4"></path></svg>
0 2 \ No newline at end of file
... ...
src/icons/svg/recharge.svg 0 → 100644
  View file @5fcc135
  1 +<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1561603267733" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5863" xmlns:xlink="http://www.w3.org/1999/xlink" width="48" height="48"><defs><style type="text/css"></style></defs><path d="M512 750.509317c-19.080745 0-31.801242-12.720497-31.801242-31.801242L480.198758 432.496894c0-19.080745 12.720497-31.801242 31.801242-31.801242s31.801242 12.720497 31.801242 31.801242l0 286.21118C537.440994 737.78882 524.720497 750.509317 512 750.509317z" p-id="5864" fill="#409eff"></path><path d="M651.925466 534.26087 365.714286 534.26087c-19.080745 0-31.801242-12.720497-31.801242-31.801242 0-19.080745 12.720497-31.801242 31.801242-31.801242l286.21118 0c19.080745 0 31.801242 12.720497 31.801242 31.801242C683.726708 521.540373 671.006211 534.26087 651.925466 534.26087z" p-id="5865" fill="#409eff"></path><path d="M651.925466 648.745342 365.714286 648.745342c-19.080745 0-31.801242-12.720497-31.801242-31.801242 0-19.080745 12.720497-31.801242 31.801242-31.801242l286.21118 0c19.080745 0 31.801242 12.720497 31.801242 31.801242C683.726708 636.024845 671.006211 648.745342 651.925466 648.745342z" p-id="5866" fill="#409eff"></path><path d="M512 464.298137c-6.360248 0-19.080745 0-25.440994-6.360248L352.993789 324.372671c-12.720497-12.720497-12.720497-31.801242 0-44.521739 12.720497-12.720497 31.801242-12.720497 44.521739 0l133.565217 133.565217c12.720497 12.720497 12.720497 31.801242 0 44.521739C524.720497 464.298137 518.360248 464.298137 512 464.298137z" p-id="5867" fill="#409eff"></path><path d="M512 464.298137c-6.360248 0-19.080745 0-25.440994-6.360248-12.720497-12.720497-12.720497-31.801242 0-44.521739l133.565217-133.565217c12.720497-12.720497 31.801242-12.720497 44.521739 0 12.720497 12.720497 12.720497 31.801242 0 44.521739L531.080745 457.937888C524.720497 464.298137 518.360248 464.298137 512 464.298137z" p-id="5868" fill="#409eff"></path><path d="M512 1017.639752c-279.850932 0-508.819876-228.968944-508.819876-508.819876s228.968944-508.819876 508.819876-508.819876 508.819876 228.968944 508.819876 508.819876c0 25.440994 0 50.881988-6.360248 82.68323 0 19.080745-19.080745 31.801242-38.161491 25.440994-19.080745 0-31.801242-19.080745-25.440994-38.161491 6.360248-25.440994 6.360248-44.521739 6.360248-69.962733 0-248.049689-197.167702-445.217391-445.217391-445.217391S66.782609 267.130435 66.782609 515.180124s197.167702 445.217391 445.217391 445.217391c25.440994 0 57.242236 0 82.68323-6.360248 19.080745-6.360248 31.801242 6.360248 38.161491 25.440994 6.360248 19.080745-6.360248 31.801242-25.440994 38.161491C575.602484 1017.639752 543.801242 1017.639752 512 1017.639752z" p-id="5869" fill="#409eff"></path><path d="M989.018634 864.993789l-318.012422 0c-19.080745 0-31.801242-12.720497-31.801242-31.801242s12.720497-31.801242 31.801242-31.801242l318.012422 0c19.080745 0 31.801242 12.720497 31.801242 31.801242S1001.73913 864.993789 989.018634 864.993789z" p-id="5870" fill="#409eff"></path><path d="M830.012422 1024c-19.080745 0-31.801242-12.720497-31.801242-31.801242l0-318.012422c0-19.080745 12.720497-31.801242 31.801242-31.801242s31.801242 12.720497 31.801242 31.801242l0 318.012422C861.813665 1004.919255 842.732919 1024 830.012422 1024z" p-id="5871" fill="#409eff"></path></svg>
0 2 \ No newline at end of file
... ...
src/icons/svg/user.svg 0 → 100644
  View file @5fcc135
  1 +<svg width="130" height="130" xmlns="http://www.w3.org/2000/svg"><path d="M63.444 64.996c20.633 0 37.359-14.308 37.359-31.953 0-17.649-16.726-31.952-37.359-31.952-20.631 0-37.36 14.303-37.358 31.952 0 17.645 16.727 31.953 37.359 31.953zM80.57 75.65H49.434c-26.652 0-48.26 18.477-48.26 41.27v2.664c0 9.316 21.608 9.325 48.26 9.325H80.57c26.649 0 48.256-.344 48.256-9.325v-2.663c0-22.794-21.605-41.271-48.256-41.271z" stroke="#979797"/></svg>
0 2 \ No newline at end of file
... ...
src/icons/svg/yzm.svg 0 → 100644
  View file @5fcc135
  1 +<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1562056308501" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3090" xmlns:xlink="http://www.w3.org/1999/xlink" width="32" height="32"><defs><style type="text/css"></style></defs><path d="M830.989613 809.959136l-45.985334 0 0 68.978001c-2.156106 16.526395-22.992667 22.99369-22.992667 22.99369L187.190845 901.930827c-15.08865-1.436722-22.992667-22.99369-22.992667-22.99369L164.198178 143.166677c-2.155083-16.526395 22.992667-22.992667 22.992667-22.992667l574.820768 0c18.681478 0.719384 22.992667 22.992667 22.992667 22.992667l0 298.907741 45.985334 0L830.989613 97.181343c-5.02955-20.836561-22.99369-22.992667-22.99369-22.992667L141.205511 74.188676c-17.963117 1.437745-22.992667 22.992667-22.992667 22.992667l0 827.742151c1.436722 16.526395 22.992667 22.992667 22.992667 22.992667l666.791435 0c23.712051-5.747911 22.99369-22.992667 22.99369-22.992667L830.990636 809.959136zM716.025255 442.074418l0-68.978001L233.176179 373.096417l0 68.978001L716.025255 442.074418zM853.98228 488.059751 647.047254 694.993754l-91.970668-114.963335c-78.836533-26.282596-45.985334 45.985334-45.985334 45.985334l91.970668 114.965381c42.696428 49.275263 91.971691 0 91.971691 0l206.936049-206.936049C916.392702 461.777155 853.98228 488.059751 853.98228 488.059751z" p-id="3091" fill="#889aa4"></path></svg>
0 2 \ No newline at end of file
... ...
src/icons/svgo.yml 0 → 100644
  View file @5fcc135
  1 +# replace default config
  2 +
  3 +# multipass: true
  4 +# full: true
  5 +
  6 +plugins:
  7 +
  8 + # - name
  9 + #
  10 + # or:
  11 + # - name: false
  12 + # - name: true
  13 + #
  14 + # or:
  15 + # - name:
  16 + # param1: 1
  17 + # param2: 2
  18 +
  19 +- removeAttrs:
  20 + attrs:
  21 + - 'fill'
  22 + - 'fill-rule'
... ...
src/main.js
  View file @5fcc135
... ... @@ -3,12 +3,14 @@
3 3 import Vue from 'vue'
4 4 import App from './App'
5 5 import router from './router'
6   -
  6 +import ElementUI from 'element-ui'
  7 +import '@/icons' // icon
7 8 require ('./style/reset.css')
8 9  
9 10  
10 11 Vue.config.productionTip = false
11   -
  12 +// set ElementUI lang to EN
  13 +Vue.use(ElementUI)
12 14 /* eslint-disable no-new */
13 15 new Vue({
14 16 el: '#app',
... ...
src/style/reset.css
  View file @5fcc135
... ... @@ -2,7 +2,7 @@
2 2 v4.0 | 20180602
3 3 License: none (public domain)
4 4 */
5   -
  5 +@import url("//unpkg.com/element-ui@2.10.1/lib/theme-chalk/index.css");
6 6 html, body, div, span, applet, object, iframe,
7 7 h1, h2, h3, h4, h5, h6, p, blockquote, pre,
8 8 a, abbr, acronym, address, big, cite, code,
... ... @@ -179,4 +179,80 @@ table {
179 179  
180 180 .anchorBL{display:none;} /*去掉百度地图logo*/
181 181  
  182 +.cursor{cursor: pointer;}
  183 +input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{
  184 + -webkit-appearance:textfield;
  185 +}
  186 +input[type="number"]{
  187 + -moz-appearance:textfield;
  188 +}
  189 +/* 个别样式 */
  190 +
  191 +/*.icon_home{
  192 + display: inline-block;
  193 + width:20px;
  194 + height:20px;
  195 + background:url(../assets/service/icon_home.png) no-repeat center 2px;
  196 + background-size: cover;
  197 +}
  198 +.icon_create{
  199 + display: inline-block;
  200 + width:19px;
  201 + height:19px;
  202 + background:url(../assets/service/icon_home.png) no-repeat center center;
  203 + background-size: cover;
  204 +}
  205 +.icon_myact{
  206 + display: inline-block;
  207 + width:19px;
  208 + height:19px;
  209 + background:url(../assets/service/icon_myact.png) no-repeat center center;
  210 + background-size: cover;
  211 +}
  212 +.icon_analyze{
  213 + display: inline-block;
  214 + width:19px;
  215 + height:19px;
  216 + background:url(../assets/service/icon_analyze.png) no-repeat center center;
  217 + background-size: cover;
  218 +}
  219 +.icon_user{
  220 + display: inline-block;
  221 + width:19px;
  222 + height:19px;
  223 + background:url(../assets/service/icon_user.png) no-repeat;
  224 + background-size: cover;
  225 +}*/
  226 +.app-wrapper {
  227 + position: relative;
  228 + height: 100%;
  229 + width: 100%;
  230 +}
  231 +/*侧边栏sta*/
  232 +#app .sidebar-container {
  233 + -webkit-transition: width 0.28s;
  234 + transition: width 0.28s;
  235 + width: 210px !important;
  236 + background-color: #304156;
  237 + height: 100%;
  238 + position: relative;
  239 + font-size: 0px;
  240 + /* top: 80px; */
  241 + /* left: 0; */
  242 + float: left;
  243 + /* bottom: 64px; */
  244 + z-index: 1001;
  245 + overflow: hidden;
  246 +}
182 247  
  248 +/*右侧内容部分*/
  249 +#app .main-container{
  250 + min-height: 100%;
  251 + -webkit-transition: margin-left .28s;
  252 + transition: margin-left .28s;
  253 + margin-left: 210px;
  254 + position: relative;
  255 +}
  256 +.el-menu{
  257 + border-right: none;
  258 +}
... ...
src/utils/DateUtils.js 0 → 100755
  View file @5fcc135
  1 +/**
  2 + * 时间处理工具
  3 + *
  4 + * @type
  5 + * @author miaofc
  6 + */
  7 +export default {
  8 +
  9 + /**
  10 + * 日期对象转换为毫秒数
  11 + */
  12 +
  13 + date2Long: function (date) {
  14 + return date.getTime();
  15 + },
  16 + /**
  17 + * 毫秒转换为日期对象
  18 + * @param dateVal number 日期的毫秒数
  19 + */
  20 + long2Date: function (dateVal) {
  21 + return new Date(dateVal);
  22 + },
  23 +
  24 + /**
  25 + * 将制定格式的时间字符串转换成long
  26 + * <li>0-yyyyMMdd</li>
  27 + * <li>1-yyyy-MM-dd</li>
  28 + * <li>2-HHmmss</li>
  29 + * <li>3-HH:mm:ss</li>
  30 + * <li>4-HHmmssSSS</li>
  31 + * <li>5-HH:mm:ss.SSS</li>
  32 + * <li>6-yyyyMMddHHmmss</li>
  33 + * <li>7-yyyy-MM-dd HH:mm:ss</li>
  34 + * <li>8-yyyyMMddHHmmssSSS</li>
  35 + * <li>9-yyyy-MM-dd HH:mm:ss.SSS</li>
  36 + * <li>10-yyyy/MM/dd HH:mm</li>
  37 + * <li>11-yyyy/MM/dd HH:mm:ss</li>
  38 + * </ul>
  39 + */
  40 + string2Long: function (str, format) {
  41 + if (str == null || str == "") {
  42 + return "";
  43 + }
  44 + return this.date2Long(this.string2Date(str, format));
  45 + },
  46 +
  47 +
  48 + /**
  49 + * 毫秒转换为日期对象
  50 + *
  51 + * @param dateVal
  52 + *
  53 +
  54 + */
  55 + long2String: function (dateVal, formatType) {
  56 + if (dateVal == undefined || dateVal == null) {
  57 + return '-'
  58 + }
  59 + return this.date2String(new Date(dateVal), formatType);
  60 + },
  61 +
  62 +
  63 + /**
  64 + * 将时间转化为相应字符串
  65 + *
  66 + * @param {}
  67 + * date 待格式化的Date对象
  68 + * @param {}
  69 + * formatType 指定格式:
  70 + * <ul>
  71 + * <li>0-yyyyMMdd</li>
  72 + * <li>1-yyyy-MM-dd</li>
  73 + * <li>2-HHmmss</li>
  74 + * <li>3-HH:mm:ss</li>
  75 + * <li>4-HHmmssSSS</li>
  76 + * <li>5-HH:mm:ss.SSS</li>
  77 + * <li>6-yyyyMMddHHmmss</li>
  78 + * <li>7-yyyy-MM-dd HH:mm:ss</li>
  79 + * <li>8-yyyyMMddHHmmssSSS</li>
  80 + * <li>9-yyyy-MM-dd HH:mm:ss.SSS</li>
  81 + * <li>10-yyyy/MM/dd HH:mm</li>
  82 + * </ul>
  83 + * @return string 格式化后的字符串
  84 + */
  85 + date2String: function (date, formatType) {
  86 + if (undefined == date || null == date) {
  87 + return '-';
  88 + }
  89 + // 格式化字符串数组
  90 + var patterns = ["yyyyMMdd", "yyyy-MM-dd", "HHmmss", "HH:mm:ss", "HHmmssSSS", "HH:mm:ss.SSS", "yyyyMMddHHmmss", "yyyy-MM-dd HH:mm:ss", "yyyyMMddHHmmssSSS", "yyyy-MM-dd HH:mm:ss.SSS", "yyyy/MM/dd HH:mm", "yyyy/MM/dd HH:mm:ss", "yyyy/MM/dd", "yyyy-MM", "HH:mm"];
  91 + return this.formatDate(date, patterns[formatType]);
  92 + },
  93 +
  94 + /**
  95 + * 将字符串转化为相应时间
  96 + *
  97 + * @param {}
  98 + * dateStr 时间字符串
  99 + * @param {}
  100 + * formatType 指定格式:
  101 + * <ul>
  102 + * <li>0-yyyyMMdd</li>
  103 + * <li>1-yyyy-MM-dd</li>
  104 + * <li>2-HHmmss</li>
  105 + * <li>3-HH:mm:ss</li>
  106 + * <li>4-HHmmssSSS</li>
  107 + * <li>5-HH:mm:ss.SSS</li>
  108 + * <li>6-yyyyMMddHHmmss</li>
  109 + * <li>7-yyyy-MM-dd HH:mm:ss</li>
  110 + * <li>8-yyyyMMddHHmmssSSS</li>
  111 + * <li>9-yyyy-MM-dd HH:mm:ss.SSS</li>
  112 + * <li>10-yyyy/MM/dd HH:mm</li>
  113 + * <li>11-yyyy/MM/dd HH:mm:ss</li>
  114 +
  115 + * </ul>
  116 + * @return 解析后的Date对象
  117 + */
  118 + string2Date:function (date,formatType) {
  119 + let dateTime;
  120 + switch (formatType) {
  121 + case 0 :
  122 + dateTime= moment(date).format("YYYYMMDD");
  123 + break;
  124 + case 1 :
  125 + dateTime= moment(date).format("YYYY-MM-DD");
  126 + break;
  127 + case 2 :
  128 + dateTime= moment(date).format("HHmmss");
  129 + break;
  130 + case 3 :
  131 + dateTime= moment(date).format("HH:mm:ss");
  132 + break;
  133 + case 4 :
  134 + dateTime= moment(date).format("HHmmssSSS");
  135 + break;
  136 + case 5 :
  137 + dateTime= moment(date).format("HH:mm:ss.SSS");
  138 + break;
  139 + case 6 :
  140 + dateTime= moment(date).format("YYYY-MM-DDHHmmss");
  141 + break;
  142 + case 7 :
  143 + dateTime= moment(date).format("YYYY-MM-DD HH:mm:ss");
  144 +
  145 + break;
  146 + case 8 :
  147 + dateTime= moment(date).format("yyyyMMddHHmmssSSS");
  148 + break;
  149 + case 9 :
  150 + dateTime= moment(date).format("yyyy-MM-dd HH:mm:ss.SSS");
  151 + break;
  152 + case 10 ://yyyy/MM/dd HH:mm
  153 + dateTime= moment(date).format("yyyy/MM/dd HH:mm");
  154 + break;
  155 + case 11 ://yyyy/MM/dd HH:mm:ss
  156 + dateTime= moment(date).format("yyyy/MM/dd HH:mm:ss");
  157 + break;
  158 + }
  159 + return dateTime;
  160 + },
  161 + /**
  162 + * 格式化时间
  163 + *
  164 + * @param {}
  165 + * date 待格式化的Date对象
  166 + * @param {}
  167 + * pattern 格式化模式，可能包含下列字母
  168 + * <ul>
  169 + * <li> G 公元前/后 "G":"BC"/"AD" </li>
  170 + * <li> y 年份 "yyyy":"1996";"yy":"96" </li>
  171 + * <li> M 月份 "MMMM":July;"MMM":Jul;"MM":07 </li>
  172 + * <li> d 在某月中的日期 "dd":"10" </li>
  173 + * <li> a Am/pm "a":"AM"/"PM" </li>
  174 + * <li> H 在某天中的小时(0-23) "HH":"13" </li>
  175 + * <li> K 在上午或下午中的小时(0-11) "KK":"03" </li>
  176 + * <li> m 分钟 "mm":"10" </li>
  177 + * <li> s 秒钟 "ss":"09" </li>
  178 + * <li> S 毫秒 "SSS":"978" </li>
  179 + * </ul>
  180 + * @return 格式化后的字符串
  181 + */
  182 + formatDate: function (date, pattern) {
  183 + var dateStr = new String(pattern);
  184 + // 格式化公元信息
  185 + dateStr = dateStr.replace("G", date.getFullYear() >= 0 ? "AD" : "BC");
  186 + // 格式化年份信息
  187 + var year = new String(date.getFullYear());
  188 + dateStr = dateStr.replace("yyyy", year);
  189 + dateStr = dateStr.replace("yy", year.substring(year.length - 2, year.length));
  190 + // 格式化月份信息
  191 + var month = date.getMonth();
  192 + var monthFullNames = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
  193 + var monthShortNames = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
  194 + dateStr = dateStr.replace("MMMM", monthFullNames[month]);
  195 + dateStr = dateStr.replace("MMM", monthShortNames[month]);
  196 + dateStr = dateStr.replace("MM", month < 9 ? "0" + (month + 1) : month + 1);
  197 + // 格式化月份中的日期
  198 + var day = date.getDate();
  199 + dateStr = dateStr.replace("dd", day < 10 ? "0" + day : day);
  200 + // 格式化上下午
  201 + dateStr = dateStr.replace("a", date.getHours() < 12 ? "AM" : "PM");
  202 + // 格式化小时
  203 + var hour = date.getHours();
  204 + dateStr = dateStr.replace("HH", hour < 10 ? "0" + hour : hour);
  205 + var khour = hour > 11 ? hour - 12 : hour;
  206 + dateStr = dateStr.replace("KK", khour < 10 ? "0" + khour : khour);
  207 + // 格式化分钟
  208 + var minute = date.getMinutes();
  209 + dateStr = dateStr.replace("mm", minute < 10 ? "0" + minute : minute);
  210 + // 格式化秒钟
  211 + var second = date.getSeconds();
  212 + dateStr = dateStr.replace("ss", second < 10 ? "0" + second : second);
  213 + // 格式化毫秒
  214 + var millisecond = date.getMilliseconds();
  215 + dateStr = dateStr.replace("SSS", millisecond < 10 ? "00" + millisecond : (millisecond < 100 ? "0" + millisecond : millisecond));
  216 + return dateStr;
  217 + },
  218 +
  219 + /**
  220 + * 取得date在域field上偏移amount后的值
  221 + *
  222 + * @param {}
  223 + * date 原始时间
  224 + * @param {}
  225 + * field 偏移域，可能的取值:
  226 + * <ul>
  227 + * <li>"year"/"y":年</li>
  228 + * <li>"month"/"M":月</li>
  229 + * <li>"day"/"d":日</li>
  230 + * <li>"hour"/"h":时</li>
  231 + * <li>"minute"/"m":分</li>
  232 + * <li>"second"/"s":秒</li>
  233 + * <li>"millisecond"/"ms"/"S":毫秒</li>
  234 + * </ul>
  235 + * @param {}
  236 + * amount 偏移量
  237 + * @return 偏移后的时间
  238 + */
  239 + dateOffset: function (date, field, amount) {
  240 + var mount = 0;
  241 + switch (field) {
  242 + // 以年为单位位移
  243 + case "year", "y":
  244 + mount = 31536000 * 1000;
  245 + // newDate.setFullYear(date.getFullYear()+amount);
  246 + break;
  247 + // 以月份为单位位移
  248 + case "month", "M":
  249 + mount = 30 * 24 * 60 * 60 * 1000;
  250 + // newDate.setMonth(date.getMonth()+amount);
  251 + break;
  252 + // 以天为单位位移
  253 + case "day", "d":
  254 + mount = 24 * 60 * 60 * 1000;
  255 + // newDate.setDate(date.getDate()+amount);
  256 + break;
  257 + // 以小时为单位位移
  258 + case "hour", "h":
  259 + mount = 60 * 60 * 1000;
  260 + // newDate.setHours(date.getHours()+amount);
  261 + break;
  262 + // 以分钟为单位位移
  263 + case "minute", "m":
  264 + mount = 60 * 1000;
  265 + // newDate.setMinutes(date.getMinutes()+amount);
  266 + break;
  267 + // 以秒为单位位移
  268 + case "second", "s":
  269 + mount = 1000;
  270 + // newDate.setSeconds(date.getSeconds+amount);
  271 + break;
  272 + // 以毫秒为单位位移
  273 + case "millisecond", "ms", "S":
  274 + mount = 1;
  275 + // newDate.setMilliseconds(date.getMilliseconds+amount);
  276 + break;
  277 + }
  278 + var newDate = new Date(date.getTime() + Number(mount) * Number(amount));
  279 + return newDate;
  280 + },
  281 +
  282 + /**
  283 + * 求两个日期间相差的毫秒数
  284 + *
  285 + * @param {}
  286 + * date1 时间1
  287 + * @param {}
  288 + * date2 时间2
  289 + * @return 两个时间相差的毫秒数
  290 + */
  291 + getDiffMillis: function (date1, date2) {
  292 + return date1.getTime() - date2.getTime();
  293 + },
  294 +
  295 + /**
  296 + * 求两个日期间相差的秒数
  297 + *
  298 + * @param {}
  299 + * date1 时间1
  300 + * @param {}
  301 + * date2 时间2
  302 + * @return 两个时间相差的秒数
  303 + */
  304 + getDiffSeconds: function (date1, date2) {
  305 + return Math.floor(this.getDiffMillis(date1, date2) / 1000);
  306 + },
  307 +
  308 + /**
  309 + * 求两个日期间相差的分钟数目
  310 + *
  311 + * @param {}
  312 + * date1 时间1
  313 + * @param {}
  314 + * date2 时间2
  315 + * @return 两个时间相差的分钟数
  316 + */
  317 + getDiffMinutes: function (date1, date2) {
  318 + return Math.floor(this.getDiffSeconds(date1, date2) / 60);
  319 + },
  320 +
  321 + /**
  322 + * 求两个日期间相差的小时数目
  323 + *
  324 + * @param {}
  325 + * date1 时间1
  326 + * @param {}
  327 + * date2 时间2
  328 + * @return 两个时间相差的小时数
  329 + */
  330 + getDiffHours: function (date1, date2) {
  331 + return Math.floor(this.getDiffMinutes(date1, date2) / 60);
  332 + },
  333 +
  334 + /**
  335 + * 求两个日期间相差的天数
  336 + *
  337 + * @param {}
  338 + * date1 时间1
  339 + * @param {}
  340 + * date2 时间2
  341 + * @return 两个时间相差的天数
  342 + */
  343 + getDiffDays: function (date1, date2) {
  344 + return Math.floor(this.getDiffHours(date1, date2) / 24);
  345 + },
  346 +
  347 + /**
  348 + * 求两个日期间相差的月数目。认为每个月均为30天。
  349 + *
  350 + * @param {}
  351 + * date1 时间1
  352 + * @param {}
  353 + * date2 时间2
  354 + * @return 两个时间相差的月树
  355 + */
  356 + getDiffMonths: function (date1, date2) {
  357 + return Math.floor(this.getDiffDays(date1, date2) / 30);
  358 + },
  359 +
  360 + /**
  361 + * 求两个日期间相差的自然月数目
  362 + *
  363 + * @param {}
  364 + * date1 时间1
  365 + * @param {}
  366 + * date2 时间2
  367 + * @return 两个时间相差的自然月数
  368 + */
  369 + getDiffNaturalMonth: function (date1, date2) {
  370 + var month1 = date1.getMonth();
  371 + var month2 = date2.getMonth();
  372 + return this.getDiffYears(date1, date2) * 12 - (month2 - month1);
  373 + },
  374 +
  375 + /**
  376 + * 求两个日期间相差的年数目
  377 + *
  378 + * @param {}
  379 + * date1 时间1
  380 + * @param {}
  381 + * date2 时间2
  382 + * @return 两个时间相差的年数
  383 + */
  384 + getDiffYears: function (date1, date2) {
  385 + return date1.getFullYear() - date2.getFullYear();
  386 + },
  387 +
  388 + /**
  389 + * 求日期为其所在月份的第几天
  390 + *
  391 + * @param {}
  392 + * day 目标日
  393 + * @return 目标日是第几天。天数从1开始
  394 + */
  395 + getOrinalOfDayInYear: function (day) {
  396 + // 得到一年中的第一天
  397 + var firstDay = new Date(day.getFullYear, 0, 1);
  398 + // 计算与第一天的差值
  399 + return this.getDiffDays(day, firstDay) + 1;
  400 + },
  401 +
  402 + /**
  403 + * 求日期为其所在月份的第几天
  404 + *
  405 + * @param {}
  406 + * day 目标日
  407 + * @return 目标日是第几天。天数从1开始
  408 + */
  409 + getOrinalOfDayInMonth: function (day) {
  410 + // 得到一个月中的第一天
  411 + var firstDay = new Date(day.getFullYear, day.getMonth(), 1);
  412 + // 计算与第一天的差值
  413 + return this.getDiffDays(day, firstDay) + 1;
  414 + },
  415 +
  416 + /**
  417 + * 求日期为其所在周的第几天
  418 + *
  419 + * @param {}
  420 + * day 目标日
  421 + * @return 目标日是第几天。天数从1开始
  422 + */
  423 + getOrinalOfDayInWeek: function (day) {
  424 + return day.getDay() + 1;
  425 + },
  426 +
  427 + /**
  428 + * 求某年共有多少天
  429 + *
  430 + * @param {}
  431 + * year 年份
  432 + * @return 该年份共有多少天
  433 + */
  434 + getNumberOfDaysInYear: function (year) {
  435 + // 若该年份为闰年，返回366
  436 + if ((year % 100 != 0 && year % 4 == 0) || (year % 400 == 0)) {
  437 + return 366;
  438 + }
  439 + // 普通年份返回365
  440 + return 365;
  441 + },
  442 +
  443 + /**
  444 + * 求某月共有多少天
  445 + *
  446 + * @param {}
  447 + * year 年份
  448 + * @param {}
  449 + * month 月份
  450 + * @return 该月内共有多少天
  451 + */
  452 + getNumberOfDaysInMonth: function (year, month) {
  453 + // 得到该月份的第一天
  454 + var date1 = new Date(year, month - 1, 1);
  455 + // 得到后一个月份的第一天
  456 + var date2 = "";
  457 + if (month != 11) {
  458 + date2 = new Date(year, month, 1);
  459 + } else {
  460 + date2 = new Date(year - 1, 0, 1);
  461 + }
  462 + return this.getDiffDays(date1, date2);
  463 + },
  464 +
  465 + /**
  466 + * 得到当前年份一共有多少天
  467 + *
  468 + * @return 当前年份共有多少天
  469 + */
  470 + getNumberOfDaysInCurrentYear: function () {
  471 + var date = new Date();
  472 + return this.getNumberOfDaysInYear(date.getYear());
  473 + },
  474 +
  475 + /**
  476 + * 得到当前月份一共有多少天
  477 + *
  478 + * @return 当前月份共有多少天
  479 + */
  480 + getNumberOfDaysInCurrentMonth: function () {
  481 + var date = new Date();
  482 + return this.getNumberOfDaysInMonth(date.getYear(), date.getMonth() + 1);
  483 + },
  484 +
  485 +// 金钱格式处理
  486 + moneyFormatter: function (value) {
  487 + if (value == '0' || value == undefined || value == null || value === '') {
  488 + return '0.00';
  489 + } else {
  490 + return (value / 100).toFixed(2);
  491 + }
  492 + }
  493 +
  494 +};
... ...
src/utils/auth.js 0 → 100644
  View file @5fcc135
  1 +import Cookies from 'js-cookie'
  2 +
  3 +const TokenKey = 'vue_admin_template_token'
  4 +
  5 +export function getToken() {
  6 + return Cookies.get(TokenKey)
  7 +}
  8 +
  9 +export function setToken(token) {
  10 + return Cookies.set(TokenKey, token)
  11 +}
  12 +
  13 +export function removeToken() {
  14 + return Cookies.remove(TokenKey)
  15 +}
... ...
src/utils/get-page-title.js 0 → 100644
  View file @5fcc135
  1 +import defaultSettings from '@/settings'
  2 +
  3 +const title = defaultSettings.title || '黄石停车系统'
  4 +
  5 +export default function getPageTitle(pageTitle) {
  6 + if (pageTitle) {
  7 + return `${pageTitle}`
  8 + }
  9 + return `${title}`
  10 +}
... ...
src/utils/index.js 0 → 100644
  View file @5fcc135
  1 +/**
  2 + * Created by PanJiaChen on 16/11/18.
  3 + */
  4 +
  5 +/**
  6 + * Parse the time to string
  7 + * @param {(Object|string|number)} time
  8 + * @param {string} cFormat
  9 + * @returns {string}
  10 + */
  11 +export function parseTime(time, cFormat) {
  12 + if (arguments.length === 0) {
  13 + return null
  14 + }
  15 + const format = cFormat || '{y}-{m}-{d} {h}:{i}:{s}'
  16 + let date
  17 + if (typeof time === 'object') {
  18 + date = time
  19 + } else {
  20 + if ((typeof time === 'string') && (/^[0-9]+$/.test(time))) {
  21 + time = parseInt(time)
  22 + }
  23 + if ((typeof time === 'number') && (time.toString().length === 10)) {
  24 + time = time * 1000
  25 + }
  26 + date = new Date(time)
  27 + }
  28 + const formatObj = {
  29 + y: date.getFullYear(),
  30 + m: date.getMonth() + 1,
  31 + d: date.getDate(),
  32 + h: date.getHours(),
  33 + i: date.getMinutes(),
  34 + s: date.getSeconds(),
  35 + a: date.getDay()
  36 + }
  37 + const time_str = format.replace(/{(y|m|d|h|i|s|a)+}/g, (result, key) => {
  38 + let value = formatObj[key]
  39 + // Note: getDay() returns 0 on Sunday
  40 + if (key === 'a') { return ['日', '一', '二', '三', '四', '五', '六'][value ] }
  41 + if (result.length > 0 && value < 10) {
  42 + value = '0' + value
  43 + }
  44 + return value || 0
  45 + })
  46 + return time_str
  47 +}
  48 +
  49 +/**
  50 + * @param {number} time
  51 + * @param {string} option
  52 + * @returns {string}
  53 + */
  54 +export function formatTime(time, option) {
  55 + if (('' + time).length === 10) {
  56 + time = parseInt(time) * 1000
  57 + } else {
  58 + time = +time
  59 + }
  60 + const d = new Date(time)
  61 + const now = Date.now()
  62 +
  63 + const diff = (now - d) / 1000
  64 +
  65 + if (diff < 30) {
  66 + return '刚刚'
  67 + } else if (diff < 3600) {
  68 + // less 1 hour
  69 + return Math.ceil(diff / 60) + '分钟前'
  70 + } else if (diff < 3600 * 24) {
  71 + return Math.ceil(diff / 3600) + '小时前'
  72 + } else if (diff < 3600 * 24 * 2) {
  73 + return '1天前'
  74 + }
  75 + if (option) {
  76 + return parseTime(time, option)
  77 + } else {
  78 + return (
  79 + d.getMonth() +
  80 + 1 +
  81 + '月' +
  82 + d.getDate() +
  83 + '日' +
  84 + d.getHours() +
  85 + '时' +
  86 + d.getMinutes() +
  87 + '分'
  88 + )
  89 + }
  90 +}
  91 +
  92 +/**
  93 + * @param {string} url
  94 + * @returns {Object}
  95 + */
  96 +export function param2Obj(url) {
  97 + const search = url.split('?')[1]
  98 + if (!search) {
  99 + return {}
  100 + }
  101 + return JSON.parse(
  102 + '{"' +
  103 + decodeURIComponent(search)
  104 + .replace(/"/g, '\\"')
  105 + .replace(/&/g, '","')
  106 + .replace(/=/g, '":"')
  107 + .replace(/\+/g, ' ') +
  108 + '"}'
  109 + )
  110 +}
... ...
src/utils/request.js 0 → 100644
  View file @5fcc135
  1 +import axios from 'axios'
  2 +import { MessageBox, Message } from 'element-ui'
  3 +import store from '@/store'
  4 +import { getToken } from '@/utils/auth'
  5 +
  6 +// create an axios instance
  7 +const service = axios.create({
  8 + baseURL: process.env.VUE_APP_BASE_API, // url = base url + request url
  9 + // withCredentials: true, // send cookies when cross-domain requests
  10 + timeout: 50000 // request timeout
  11 +})
  12 +
  13 +// request interceptor
  14 +service.interceptors.request.use(
  15 + config => {
  16 + // do something before request is sent
  17 +
  18 + if (store.getters.token) {
  19 + // let each request carry token
  20 + // ['X-Token'] is a custom headers key
  21 + // please modify it according to the actual situation
  22 + config.headers['X-Auth-Token'] = getToken()
  23 + }
  24 + return config
  25 + },
  26 + error => {
  27 + // do something with request error
  28 + console.log(error) // for debug
  29 + return Promise.reject(error)
  30 + }
  31 +)
  32 +
  33 +// response interceptor
  34 +service.interceptors.response.use(
  35 + /**
  36 + * If you want to get http information such as headers or status
  37 + * Please return response => response
  38 + */
  39 +
  40 + /**
  41 + * Determine the request status by custom code
  42 + * Here is just an example
  43 + * You can also judge the status by HTTP Status Code
  44 + */
  45 + response => {
  46 + const res = response.data
  47 + // if the custom code is not 20000, it is judged as an error.
  48 + if (res.code !='8888') {
  49 + Message({
  50 + message: res.message || 'Error',
  51 + type: 'error',
  52 + duration: 5 * 1000
  53 + })
  54 +
  55 + return Promise.reject(new Error(res.message || 'Error'))
  56 + } else {
  57 + return res
  58 + }
  59 + },
  60 + error => {
  61 + console.log('err' + error) // for debug
  62 + Message({
  63 + message: error.message,
  64 + type: 'error',
  65 + duration: 5 * 1000
  66 + })
  67 + return Promise.reject(error)
  68 + }
  69 +)
  70 +
  71 +export default service
... ...
src/utils/scroll-to.js 0 → 100644
  View file @5fcc135
  1 +Math.easeInOutQuad = function(t, b, c, d) {
  2 + t /= d / 2
  3 + if (t < 1) {
  4 + return c / 2 * t * t + b
  5 + }
  6 + t--
  7 + return -c / 2 * (t * (t - 2) - 1) + b
  8 +}
  9 +
  10 +// requestAnimationFrame for Smart Animating http://goo.gl/sx5sts
  11 +var requestAnimFrame = (function() {
  12 + return window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || function(callback) { window.setTimeout(callback, 1000 / 60) }
  13 +})()
  14 +
  15 +/**
  16 + * Because it's so fucking difficult to detect the scrolling element, just move them all
  17 + * @param {number} amount
  18 + */
  19 +function move(amount) {
  20 + document.documentElement.scrollTop = amount
  21 + document.body.parentNode.scrollTop = amount
  22 + document.body.scrollTop = amount
  23 +}
  24 +
  25 +function position() {
  26 + return document.documentElement.scrollTop || document.body.parentNode.scrollTop || document.body.scrollTop
  27 +}
  28 +
  29 +/**
  30 + * @param {number} to
  31 + * @param {number} duration
  32 + * @param {Function} callback
  33 + */
  34 +export function scrollTo(to, duration, callback) {
  35 + const start = position()
  36 + const change = to - start
  37 + const increment = 20
  38 + let currentTime = 0
  39 + duration = (typeof (duration) === 'undefined') ? 500 : duration
  40 + var animateScroll = function() {
  41 + // increment the time
  42 + currentTime += increment
  43 + // find the value with the quadratic in-out easing function
  44 + var val = Math.easeInOutQuad(currentTime, start, change, duration)
  45 + // move the document.body
  46 + move(val)
  47 + // do the animation unless its over
  48 + if (currentTime < duration) {
  49 + requestAnimFrame(animateScroll)
  50 + } else {
  51 + if (callback && typeof (callback) === 'function') {
  52 + // the animation is done so lets callback
  53 + callback()
  54 + }
  55 + }
  56 + }
  57 + animateScroll()
  58 +}
... ...
src/utils/utils.js 0 → 100644
  View file @5fcc135
  1 +import DateUtils from './DateUtils.js';
  2 +
  3 +/**
  4 + * 将制定格式的时间字符串转换成long
  5 + * <li>0-yyyyMMdd</li>
  6 + * <li>1-yyyy-MM-dd</li>
  7 + * <li>2-HHmmss</li>
  8 + * <li>3-HH:mm:ss</li>
  9 + * <li>4-HHmmssSSS</li>
  10 + * <li>5-HH:mm:ss.SSS</li>
  11 + * <li>6-yyyyMMddHHmmss</li>
  12 + * <li>7-yyyy-MM-dd HH:mm:ss</li>
  13 + * <li>8-yyyyMMddHHmmssSSS</li>
  14 + * <li>9-yyyy-MM-dd HH:mm:ss.SSS</li>
  15 + * <li>10-yyyy/MM/dd HH:mm</li>
  16 + * <li>11-yyyy/MM/dd HH:mm:ss</li>
  17 + */
  18 +// 日期格式处理 精确到时分秒 如：2018-10-24 08:41:33
  19 +export function timeFormatter(value, row, index) {
  20 + if (value == null || value == undefined || value == '') {
  21 + return "-";
  22 + } else {
  23 + return DateUtils.long2String(value, 7);
  24 + }
  25 +}
  26 +
  27 +// 日期格式处理 精确到年月日 如：2018-10-24
  28 +export function timeOneFormatter(value, row, index) {
  29 + if (value == null || value == undefined || value == '') {
  30 + return "-";
  31 + } else {
  32 + return DateUtils.long2String(value, 1);
  33 + }
  34 +}
  35 +
  36 +// 时间处理，获取日期的当天开始时间：'2019-06-01 00:00:00'
  37 +export function getBeginOfTheDay(value) {
  38 + if (value == null || value == undefined || value == '') {
  39 + return new Date(new Date(new Date().toLocaleDateString()).getTime());
  40 + } else {
  41 + return new Date(new Date(value.toLocaleDateString()).getTime());
  42 + }
  43 +}
  44 +
  45 +// 时间处理，获取日期的当天开始时间：'2019-06-01 23:59:59
  46 +export function getEndOfTheDay(value) {
  47 + if (value == null || value == undefined || value == '') {
  48 + return new Date(new Date(new Date().toLocaleDateString()).getTime()+24*60*60*1000-1);
  49 + } else {
  50 + return new Date(new Date(value.toLocaleDateString()).getTime()+24*60*60*1000-1);
  51 + }
  52 +}
  53 +
  54 +// 日期格式处理 精确到年月 如：2018-10
  55 +export function yearMonthFormatter(value, row, index) {
  56 + if (value == null || value == undefined || value == '') {
  57 + return "-";
  58 + } else {
  59 + var str = DateUtils.long2String(value, 1);
  60 + return str.substr(0, 7);
  61 + }
  62 +}
  63 +
  64 +// 金钱格式处理
  65 +export function moneyFormatter(value) {
  66 + if (value == '0' || value == undefined || value == null || value === '') {
  67 + return '0.00';
  68 + } else {
  69 + return (value / 100).toFixed(2);
  70 + }
  71 +}
  72 +
  73 +
  74 +
  75 +
  76 +
  77 +
  78 +
  79 +
  80 +
  81 +
... ...
src/utils/validate.js 0 → 100644
  View file @5fcc135
  1 +/**
  2 + * Created by PanJiaChen on 16/11/18.
  3 + */
  4 +
  5 +/**
  6 + * @param {string} path
  7 + * @returns {Boolean}
  8 + */
  9 +export function isExternal(path) {
  10 + return /^(https?:|mailto:|tel:)/.test(path)
  11 +}
  12 +
  13 +/**
  14 + * @param {string} str
  15 + * @returns {Boolean}
  16 + */
  17 +export function validUsername(str) {
  18 + const valid_map = ['admin', 'editor']
  19 + return valid_map.indexOf(str.trim()) >= 0
  20 +}
... ...
src/views/account/index.vue 0 → 100644
  View file @5fcc135
  1 +<template>
  2 + <div class="">
  3 + <!--卡片-->
  4 + <el-row :gutter="16" class="">
  5 + <el-col :span="12">
  6 + <el-card class="box-card">
  7 + <el-row :gutter="24">
  8 + <el-col :span="8" style="text-align: center">
  9 + <svg-icon icon-class="recharge" class="svg-icon" style="width: 48px;height: 48px" />
  10 + </el-col>
  11 + <el-col :span="12" :offset="4">
  12 + <el-row :gutter="16"><el-col :span="24">充值账户(元)</el-col></el-row>
  13 + <el-row :gutter="16" class="common-color font-size24" style="margin-top: 4px"><el-col :span="24">{{rechargeBalance|fen2Yuan}}</el-col></el-row>
  14 + </el-col>
  15 + </el-row>
  16 + </el-card>
  17 + </el-col>
  18 + <el-col :span="12">
  19 + <el-card class="box-card">
  20 + <el-row :gutter="24">
  21 + <el-col :span="8" style="text-align: center">
  22 + <svg-icon icon-class="give" style="width: 48px;height: 48px" />
  23 + </el-col>
  24 + <el-col :span="12" :offset="4">
  25 + <el-row :gutter="16"><el-col :span="24">赠送账户(元)</el-col></el-row>
  26 + <el-row :gutter="16" class="common-color font-size24" style="margin-top: 4px"><el-col :span="24">{{presentBalance|fen2Yuan}}</el-col></el-row>
  27 + </el-col>
  28 + </el-row>
  29 + </el-card>
  30 + </el-col>
  31 + </el-row>
  32 + <!--账户明细 sta-->
  33 + <el-card shadow="always" class="card-second-top margin-top-24">
  34 + <el-tabs :tab-position="tabPosition" >
  35 + <el-tab-pane label="充值记录">
  36 + <el-table
  37 + :data="rechargeTableData"
  38 + style="width: 100%;"
  39 + :show-overflow-tooltip="true">
  40 + <el-table-column
  41 + prop="acctType"
  42 + label="账户类型"
  43 + :show-overflow-tooltip="true">
  44 + <template slot-scope="scope">
  45 + <span v-if="scope.row.acctType == 1">账户余额</span>
  46 + <span v-if="scope.row.acctType == 7">充值赠送</span>
  47 + </template>
  48 + </el-table-column>
  49 + <el-table-column
  50 + prop="rechargeFee"
  51 + label="充值金额"
  52 + :show-overflow-tooltip="true">
  53 + <template slot-scope="scope">
  54 + <span>{{(scope.row.rechargeFee) |fen2Yuan}} </span>
  55 + </template>
  56 + </el-table-column>
  57 + <el-table-column
  58 + prop="rechargeBalance"
  59 + label="充值后余额">
  60 + <template slot-scope="scope">
  61 + <span>{{(scope.row.rechargeBalance) |fen2Yuan}} </span>
  62 + </template>
  63 + </el-table-column>
  64 + <el-table-column
  65 + prop="rechargeTime"
  66 + label="充值时间"
  67 + :show-overflow-tooltip="true">
  68 + <template slot-scope="scope">
  69 + <span>{{(scope.row.rechargeTime) |string2Date(7)}} </span>
  70 + </template>
  71 + </el-table-column>
  72 + </el-table>
  73 + <el-pagination
  74 + :page-size="5"
  75 + :pager-count="11"
  76 + layout="prev, pager, next"
  77 + :total="total"
  78 + @size-change="handleSizeChange"
  79 + @current-change="handleSizeChange"
  80 + @prev-click="handleSizeChange"
  81 + @next-click="handleSizeChange">
  82 + </el-pagination>
  83 + </el-tab-pane>
  84 + <el-tab-pane label="支出记录">
  85 + <el-table
  86 + :data="payOutTableData"
  87 + style="width: 100%;"
  88 + :show-overflow-tooltip="true">
  89 + <el-table-column
  90 + prop="acctType"
  91 + label="账户类型"
  92 + :show-overflow-tooltip="true">
  93 + <template slot-scope="scope">
  94 + <span v-if="scope.row.acctType == 1">账户余额</span>
  95 + <span v-if="scope.row.acctType == 7">充值赠送</span>
  96 + </template>
  97 + </el-table-column>
  98 + <el-table-column
  99 + prop="tradeFee"
  100 + label="交易金额"
  101 + :show-overflow-tooltip="true">
  102 + <template slot-scope="scope">
  103 + <span>{{(scope.row.tradeFee) |fen2Yuan}} </span>
  104 + </template>
  105 + </el-table-column>
  106 + <el-table-column
  107 + prop="tradeBalance"
  108 + label="交易后余额">
  109 + <template slot-scope="scope">
  110 + <span>{{(scope.row.tradeBalance) |fen2Yuan}} </span>
  111 + </template>
  112 + </el-table-column>
  113 + <el-table-column
  114 + prop="tradeDetialType"
  115 + label="交易类型">
  116 + <template slot-scope="scope">
  117 + <span v-if="scope.row.tradeDetialType == 101">停车支付</span>
  118 + <span v-if="scope.row.tradeDetialType == 102">停车预付</span>
  119 + <span v-if="scope.row.tradeDetialType == 103">停车补缴</span>
  120 + <span v-if="scope.row.tradeDetialType == 104">共享车位</span>
  121 + <span v-if="scope.row.tradeDetialType == 201">余额充值</span>
  122 + <span v-if="scope.row.tradeDetialType == 202">押金充值</span>
  123 + <span v-if="scope.row.tradeDetialType == 301">会员卡购买</span>
  124 + <span v-if="scope.row.tradeDetialType == 302">会员卡续费</span>
  125 + </template>
  126 + </el-table-column>
  127 + <el-table-column
  128 + prop="tradeTime"
  129 + label="交易时间"
  130 + :show-overflow-tooltip="true">
  131 + <template slot-scope="scope">
  132 + <span>{{(scope.row.tradeTime) |string2Date(7)}} </span>
  133 + </template>
  134 + </el-table-column>
  135 + </el-table>
  136 + <el-pagination
  137 + :page-size="5"
  138 + :pager-count="21"
  139 + layout="prev, pager, next"
  140 + :total="total2"
  141 + @size-change="handleSizeChange2"
  142 + @current-change="handleSizeChange2"
  143 + @prev-click="handleSizeChange2"
  144 + @next-click="handleSizeChange2">
  145 + </el-pagination>
  146 + </el-tab-pane>
  147 + </el-tabs>
  148 +
  149 + </el-card>
  150 + </div>
  151 +</template>
  152 +
  153 +<script>
  154 +// import { getList } from '@/api/table'
  155 +import pagination from '@/components/Pagination/index.vue';
  156 +import LoadingBar from 'nprogress' // progress bar
  157 +import 'nprogress/nprogress.css' // progress bar style
  158 +import {getAcctPersonGroupByAcctType,queryCustRechargeFeeStaticMsg,queryAcctPayOutForPage} from '@/api/account';
  159 +import {fen2Yuan,string2Date} from '@/filters/index';
  160 +export default {
  161 + components:{
  162 + 'i-pagination': pagination
  163 + },
  164 + filters: {
  165 +
  166 + },
  167 + data() {
  168 + return {
  169 + rechargeBalance:0,
  170 + presentBalance:0,
  171 + list: null,
  172 + tabPosition:'top',
  173 + listLoading: true,
  174 + btnLoading:false,
  175 + loading:false,
  176 + rechargeTableData: [
  177 + ],
  178 + payOutTableData: [
  179 + ],
  180 + /** 分页*/
  181 + total: 0,
  182 + currentPage: 1,
  183 + pageSize: 5,
  184 + total2: 0,
  185 + currentPage2: 1,
  186 + pageSize2: 5,
  187 + }
  188 + },
  189 + mounted: function() {
  190 + this.getAcctPersonGroupByAcctType();
  191 + this.queryCustRechargeFeeStaticMsg();
  192 + this.queryAcctPayOutForPage();
  193 + },
  194 +
  195 + methods: {
  196 + /**
  197 + * 获取查询参数
  198 + */
  199 + getQueryParams: function() {
  200 + let userInfo = this.$store.state.user.userInfo;
  201 + let beginTime = new Date();
  202 + let endTime = new Date();
  203 + beginTime.setFullYear(2017);
  204 +
  205 + let req = {
  206 + beginTime:beginTime,
  207 + endTime:endTime,
  208 + sysCode:'10003',
  209 + custId:userInfo.custId,
  210 + // custId:'501519113641649119232',//账户支出
  211 + //custId:'501522943145292840960',//账户充值
  212 +
  213 + }
  214 + return req;
  215 + },
  216 + /**
  217 + * 查询车主账户信息
  218 + */
  219 + getAcctPersonGroupByAcctType: function() {
  220 + let req = this.getQueryParams();
  221 + getAcctPersonGroupByAcctType(req).then(response =>{
  222 + if(response.code=='8888'){
  223 + let data = response.data;
  224 + let rechargeBalance = 0;
  225 + let presentBalance = 0;
  226 + data.forEach(item=>{
  227 + if(item.acctType == 1){
  228 + rechargeBalance += item.acctBalance;
  229 + }
  230 + if(item.acctType == 7){
  231 + presentBalance += item.acctBalance;
  232 + }
  233 + });
  234 + this.rechargeBalance = rechargeBalance;
  235 + this.presentBalance = presentBalance;
  236 + }else{
  237 + console.log(response);
  238 + }
  239 +
  240 + });
  241 + },
  242 + /**
  243 + * 查询车主充值记录
  244 + */
  245 + queryCustRechargeFeeStaticMsg: function() {
  246 + let req = this.getQueryParams();
  247 + req.baseRequest={
  248 + pageNum:this.currentPage,
  249 + pageSize:this.pageSize,
  250 + },
  251 + queryCustRechargeFeeStaticMsg(req).then(response =>{
  252 + if(response.code=='8888'){
  253 + this.rechargeTableData = response.data.rows;
  254 + this.total = response.data.total;
  255 + }else{
  256 + console.log(response);
  257 + }
  258 +
  259 + });
  260 + },
  261 +
  262 + /**
  263 + * 查询车主支出记录
  264 + */
  265 + queryAcctPayOutForPage: function() {
  266 + let req = this.getQueryParams();
  267 +
  268 + req.baseRequest={
  269 + pageNum:this.currentPage2,
  270 + pageSize:this.pageSize2,
  271 + },
  272 + queryAcctPayOutForPage (req).then(response =>{
  273 + if(response.code=='8888'){
  274 + this.payOutTableData = response.data.rows;
  275 + this.total2 = response.data.total;
  276 + }else{
  277 + console.log(response);
  278 + }
  279 +
  280 + });
  281 + },
  282 + // 获取子组件页码方法
  283 + handleSizeChange: function(page) {
  284 + console.log(page)
  285 + this.currentPage = page;
  286 + /** 调用表格数据.*/
  287 + this.queryCustRechargeFeeStaticMsg();
  288 +
  289 + },
  290 + // 获取子组件页码方法
  291 + handleSizeChange2: function(page) {
  292 + console.log(page)
  293 + this.currentPage2 = page;
  294 + /** 调用表格数据.*/
  295 + this.queryAcctPayOutForPage();
  296 +
  297 + },
  298 +
  299 + },
  300 +
  301 +
  302 +
  303 +}
  304 +</script>
  305 +<style lang="scss" scoped >
  306 + .serch-wrap{
  307 + background-color: #FFF;
  308 + padding: 15px;
  309 + }
  310 + .el-card__header{
  311 + padding:10px 20px!important;;
  312 + }
  313 +</style>
... ...
src/views/cardticket/index.vue 0 → 100644
  View file @5fcc135
  1 +
  2 +<template>
  3 + <div class="app-container" style="padding: 0px">
  4 + <!--卡券 sta-->
  5 + <el-row :gutter="16" class="">
  6 + <el-col :span="6" v-for="(ticket,id) in ticketList" :key="id" class="margin-bottom16">
  7 + <el-card class="box-card">
  8 + <div class="ticket-title boxshadow-4 eff-bgcolor " >
  9 + <div class=" float-left eff-icon"></div>
  10 + <div class="ticket-name hs-hidden-nowrap hs-cursor-pointer float-left" >{{ticket.orgName}}-{{ticket.cardName}}</div>
  11 + <div class="ticket-oper float-right">有效</div>
  12 + </div>
  13 + <div class="ticket-content">
  14 + <div class="ticket-main clearfix" >
  15 + <div class=" hs-hidden-nowrap hs-cursor-pointer float-left ticket-effmoney" >{{ticket.fullCutValue | fen2Yuan}}</div>
  16 +
  17 + <div class="ticket-notes float-left">元 优惠券</div>
  18 + </div>
  19 + <div class="ticket-time">有效时间:{{ticket.endTime | string2Date(1)}}</div>
  20 + </div>
  21 + </el-card>
  22 + </el-col>
  23 + </el-row>
  24 + </div>
  25 +</template>
  26 +
  27 +<script>
  28 + import {getCouponPerson} from '@/api/cardticket.js';
  29 +export default {
  30 + data() {
  31 + return {
  32 + ticketList:[
  33 + /*{
  34 + id:'123',
  35 + ptype:'1',
  36 + plname:'静雅地上停车场',
  37 + pname:'有效',
  38 + pmoney:'50',
  39 + ptime:'2019/8/30',
  40 + }*/
  41 + ]
  42 + }
  43 + },
  44 + methods: {
  45 + /**查询车主个人卡券*/
  46 + getCouponPerson:function () {
  47 + getCouponPerson().then(response =>{
  48 + if(response.code='8888'){
  49 + this.ticketList=response.data;
  50 + }
  51 + });
  52 + }
  53 + },
  54 + mounted:function () {
  55 + this.getCouponPerson();
  56 + }
  57 +}
  58 +</script>
  59 +
  60 +<style lang="scss" scoped>
  61 + .el-card__body{
  62 + padding: 0;
  63 + }
  64 + .ticket-title{
  65 + height: 46px;
  66 + line-height: 46px;
  67 + width: 100%;
  68 + }
  69 + .ticket-content{
  70 + height: 98px;
  71 + width: 100%;
  72 + }
  73 + .eff-bgcolor{
  74 + background-color: rgb(64, 158, 255);
  75 + }
  76 + .off-bgcolor{
  77 + background-color: #909399;
  78 + }
  79 + .eff-icon{
  80 + margin:8px 8px 8px 16px;
  81 + height: 30px;
  82 + width: 30px;
  83 + background-image: url("../../assets/cardticket/card_red.png");
  84 + background-size: 100% 100%;
  85 + background-repeat: no-repeat;
  86 + }
  87 + .off-icon{
  88 + margin:8px 8px 8px 16px;
  89 + height: 30px;
  90 + width: 30px;
  91 + background-image: url("../../assets/cardticket/card_gray.png");
  92 + background-size: 100% 100%;
  93 + background-repeat: no-repeat;
  94 + }
  95 + .ticket-name{
  96 + width:120px;
  97 + height:46px;
  98 + font-size:14px;
  99 + font-weight:500;
  100 + color:rgba(255,255,255,1);
  101 + line-height:46px;
  102 + }
  103 + .ticket-oper{
  104 + font-size:12px;
  105 + font-weight:500;
  106 + color:rgba(255,255,255,1);
  107 + width:42px;
  108 + height:20px;
  109 + line-height: 20px;
  110 + text-align: center;
  111 + border-radius:2px;
  112 + margin-top: 10px;
  113 + margin-right: 16px;
  114 + border:1px solid rgba(255,255,255,1);
  115 + }
  116 + .ticket-main{
  117 + width:100%;
  118 + height:62px;
  119 + .ticket-effmoney{
  120 + font-size:44px;
  121 + font-weight:600;
  122 + color:rgb(64, 158, 255);
  123 + height:62px;
  124 + line-height:62px;
  125 + margin-left: 16px;
  126 + max-width: 120px;
  127 + }
  128 + .ticket-offmoney{
  129 + font-size:44px;
  130 + font-weight:600;
  131 + color:rgba(92,92,92,1);
  132 + height:62px;
  133 + line-height:62px;
  134 + margin-left: 16px;
  135 + max-width: 120px;
  136 + }
  137 + .ticket-notes{
  138 + height: 20px;
  139 + line-height: 20px;
  140 + font-size:14px;
  141 + font-weight:500;
  142 + color:rgba(64,64,64,1);
  143 + width: 70px;
  144 + margin-left: 10px;
  145 + margin-top: 30px;
  146 + }
  147 + }
  148 + .ticket-time{
  149 + width:143px;
  150 + height:20px;
  151 + font-size:14px;
  152 + font-weight:500;
  153 + color:rgba(64,64,64,1);
  154 + line-height:20px;
  155 + margin-left: 16px;
  156 + }
  157 +
  158 +</style>
  159 +
... ...
src/views/dashboard/dashboard.vue 0 → 100644
  View file @5fcc135
  1 +<template>
  2 + <div>
  3 + <div class="panel-group el-row" style="margin-left: -20px; margin-right: -20px;">
  4 + <div class="card-panel-col el-col el-col-24 el-col-xs-24 el-col-sm-24 el-col-lg-8"
  5 + style="padding-left: 20px; padding-right: 20px;">
  6 + <div class="card-panel">
  7 + <div class="card-panel-icon-wrapper icon-order">
  8 + </div>
  9 + <div class="card-panel-description">
  10 + <div class="card-panel-text">
  11 + 本月订单： {{cardData.monthOrderNum}}
  12 + </div>
  13 + <div class="card-panel-text">
  14 + 订单总量： {{cardData.totalOrderNum}}
  15 + </div>
  16 + </div>
  17 + </div>
  18 + </div>
  19 + <div class="card-panel-col el-col el-col-24 el-col-xs-24 el-col-sm-24 el-col-lg-8"
  20 + style="padding-left: 20px; padding-right: 20px;">
  21 + <div class="card-panel">
  22 + <div class="card-panel-icon-wrapper icon-card">
  23 + </div>
  24 + <div class="card-panel-description">
  25 + <div class="card-panel-text">
  26 + 可用卡券： {{cardData.validCouponNum}}
  27 + </div>
  28 + <div class="card-panel-text">
  29 + 卡券总量： {{cardData.totalCouponNum}}
  30 + </div>
  31 + </div>
  32 + </div>
  33 + </div>
  34 + <div class="card-panel-col el-col el-col-24 el-col-xs-24 el-col-sm-24 el-col-lg-8"
  35 + style="padding-left: 20px; padding-right: 20px;">
  36 + <div class="card-panel">
  37 + <div class="card-panel-icon-wrapper icon-integral">
  38 + </div>
  39 + <div class="card-panel-description">
  40 + <div class="card-panel-text">
  41 + 可用积分： {{cardData.validScore}}
  42 + </div>
  43 + <div class="card-panel-text">
  44 + 全部积分： {{cardData.totalScore}}
  45 + </div>
  46 + </div>
  47 + </div>
  48 + </div>
  49 + </div>
  50 +
  51 + <div class="table-wrap">
  52 + <p class="table-title">消费统计</p>
  53 + <el-table
  54 + :data="moneyData"
  55 + style="width: 100%;">
  56 + <el-table-column
  57 + prop="name"
  58 + label="月份">
  59 + </el-table-column>
  60 + <el-table-column
  61 + prop="january"
  62 + label="1月">
  63 + </el-table-column>
  64 + <el-table-column
  65 + prop="february"
  66 + label="2月">
  67 + </el-table-column>
  68 + <el-table-column
  69 + prop="march"
  70 + label="3月">
  71 + </el-table-column>
  72 + <el-table-column
  73 + prop="april"
  74 + label="4月">
  75 + </el-table-column>
  76 + <el-table-column
  77 + prop="april"
  78 + label="5月">
  79 + </el-table-column>
  80 + <el-table-column
  81 + prop="june"
  82 + label="6月">
  83 + </el-table-column>
  84 + <el-table-column
  85 + prop="july"
  86 + label="7月">
  87 + </el-table-column>
  88 + <el-table-column
  89 + prop="august"
  90 + label="8月">
  91 + </el-table-column>
  92 + <el-table-column
  93 + prop="september"
  94 + label="9月">
  95 + </el-table-column>
  96 + <el-table-column
  97 + prop="october"
  98 + label="10月">
  99 + </el-table-column>
  100 + <el-table-column
  101 + prop="november"
  102 + label="11月">
  103 + </el-table-column>
  104 + <el-table-column
  105 + prop="december"
  106 + label="12月">
  107 + </el-table-column>
  108 + </el-table>
  109 + </div>
  110 +
  111 + <div class="table-wrap">
  112 + <p class="table-title">最新订单(近三个月)</p>
  113 + <el-table
  114 + :data="orderData"
  115 + style="width: 100%;"
  116 + :show-overflow-tooltip="true">
  117 + <el-table-column
  118 + prop="plName"
  119 + label="停车场"
  120 + :show-overflow-tooltip="true">
  121 + </el-table-column>
  122 + <el-table-column
  123 + prop="carNumber"
  124 + label="车牌"
  125 + :show-overflow-tooltip="true">
  126 + </el-table-column>
  127 + <el-table-column
  128 + prop="orderTotalFee"
  129 + label="应收费用">
  130 + <template slot-scope="scope">
  131 + <span>{{(scope.row.orderTotalFee) |fen2Yuan}} </span>
  132 + </template>
  133 + </el-table-column>
  134 + <el-table-column
  135 + prop="orderActFee"
  136 + label="实收费用">
  137 + <template slot-scope="scope">
  138 + <span>{{(scope.row.orderActFee) |fen2Yuan}} </span>
  139 + </template>
  140 + </el-table-column>
  141 + <el-table-column
  142 + prop="parkInTime"
  143 + label="入场时间"
  144 + :show-overflow-tooltip="true">
  145 + <template slot-scope="scope">
  146 + <span>{{(scope.row.parkInTime) |string2Date(7)}} </span>
  147 + </template>
  148 + </el-table-column>
  149 + <el-table-column
  150 + prop="parkOutTime"
  151 + label="出场时间"
  152 + :show-overflow-tooltip="true">
  153 + <template slot-scope="scope">
  154 + <span>{{(scope.row.parkOutTime) |string2Date(7)}} </span>
  155 + </template>
  156 + </el-table-column>
  157 + <el-table-column
  158 + prop="parkingDuration"
  159 + label="停车时长"
  160 + :show-overflow-tooltip="true">
  161 + <template slot-scope="scope">
  162 + <span>{{(scope.row) |parkingDurationFormatter(scope.row.parkingDuration)}} </span>
  163 + </template>
  164 + </el-table-column>
  165 + <el-table-column
  166 + prop="berthNo"
  167 + label="泊位编号">
  168 + </el-table-column>
  169 + <el-table-column
  170 + prop="orderState"
  171 + label="订单状态">
  172 + <template slot-scope="scope">
  173 + <span>{{(scope.row) |inOutStateFormatter}} </span>
  174 + </template>
  175 + </el-table-column>
  176 + </el-table>
  177 + <el-pagination
  178 + :page-size="5"
  179 + :pager-count="11"
  180 + layout="prev, pager, next"
  181 + :total="total"
  182 + @size-change="handleSizeChange"
  183 + @current-change="handleSizeChange"
  184 + @prev-click="handleSizeChange"
  185 + @next-click="handleSizeChange"
  186 + >
  187 + </el-pagination>
  188 + </div>
  189 + </div>
  190 +</template>
  191 +
  192 +<script>
  193 + import { mapGetters } from 'vuex'
  194 + import {getCustIndexBaseInfo,queryOwnerPayOutByMonth,queryOwnerParkRecord} from '@/api/index';
  195 + import {fen2Yuan,string2Date,inOutStateFormatter,parkingDurationFormatter} from '@/filters/index';
  196 + export default {
  197 + name: 'Dashboard',
  198 + computed: {
  199 + ...mapGetters([
  200 + 'name'
  201 + ])
  202 + },
  203 + data() {
  204 + return {
  205 + cardData: {
  206 + totalOrderNum: 0,
  207 + monthOrderNum: 0,
  208 + totalCouponNum: 0,
  209 + validCouponNum: 0,
  210 + totalScore: 0,
  211 + validScore: 0,
  212 + },
  213 + total: 0,
  214 + currentPage: 1,
  215 + pageSize: 4,
  216 + moneyData: [{
  217 + name: '消费金额',
  218 + january: '0',
  219 + february: '0',
  220 + march: '0',
  221 + april: '0',
  222 + may: '0',
  223 + june: '0',
  224 + july: '0',
  225 + august: '0',
  226 + september: '0',
  227 + october: '0',
  228 + november: '0',
  229 + december: '0'
  230 + }],
  231 + orderData: [],
  232 + }
  233 + },
  234 +
  235 + mounted: function() {
  236 + this.getCustIndexBaseInfo();
  237 + this.queryOwnerPayOutByMonth();
  238 + this.queryOwnerParkRecord();
  239 + },
  240 +
  241 + methods: {
  242 + /**
  243 + * 获取查询参数
  244 + */
  245 + getQueryParams: function() {
  246 + let userInfo = this.$store.state.user.userInfo;
  247 + let beginTime = new Date();
  248 + let endTime = new Date();
  249 + beginTime.setMonth(0);
  250 + beginTime.setDate(1);
  251 + endTime.setMonth(11);
  252 + endTime.setDate(31);
  253 +
  254 + let req = {
  255 + custId:userInfo.custId,
  256 + //custId:'501519113641649119232',
  257 + beginTime:beginTime,
  258 + endTime:endTime,
  259 + }
  260 + return req;
  261 + },
  262 + /**
  263 + * 查询首页卡片信息
  264 + */
  265 + getCustIndexBaseInfo: function() {
  266 + let req = this.getQueryParams();
  267 + getCustIndexBaseInfo(req).then(response =>{
  268 + if(response.code=='8888'){
  269 + let data = response.data;
  270 + this.cardData.totalOrderNum = data.totalOrderNum == null ? 0: data.totalOrderNum;
  271 + this.cardData.monthOrderNum = data.monthOrderNum == null ? 0: data.monthOrderNum;
  272 + this.cardData.totalCouponNum = data.totalCouponNum == null ? 0: data.totalCouponNum;
  273 + this.cardData.validCouponNum = data.validCouponNum == null ? 0: data.validCouponNum;
  274 + this.cardData.totalScore = data.totalScore == null ? 0: data.totalScore;
  275 + this.cardData.validScore = data.validScore == null ? 0: data.validScore;
  276 + }else{
  277 + console.log(response);
  278 + }
  279 +
  280 + });
  281 + },
  282 + /**
  283 + * 查询首页月支出信息
  284 + */
  285 + queryOwnerPayOutByMonth: function() {
  286 + let req = this.getQueryParams();
  287 +
  288 + queryOwnerPayOutByMonth(req).then(response =>{
  289 + if(response.code=='8888'){
  290 + let data = response.data;
  291 + this.moneyData[0].january = fen2Yuan(data[0].fee);
  292 + this.moneyData[0]. february = fen2Yuan(data[1].fee);
  293 + this.moneyData[0]. march = fen2Yuan(data[2].fee);
  294 + this.moneyData[0]. april = fen2Yuan(data[3].fee);
  295 + this.moneyData[0]. may = fen2Yuan(data[4].fee);
  296 + this.moneyData[0]. june = fen2Yuan(data[5].fee);
  297 + this.moneyData[0]. july = fen2Yuan(data[6].fee);
  298 + this.moneyData[0]. august = fen2Yuan(data[7].fee);
  299 + this.moneyData[0]. september = fen2Yuan(data[8].fee);
  300 + this.moneyData[0]. october = fen2Yuan(data[9].fee);
  301 + this.moneyData[0]. november =fen2Yuan( data[10].fee);
  302 + this.moneyData[0]. december = fen2Yuan(data[11].fee);
  303 +
  304 + }else{
  305 + console.log(response);
  306 + }
  307 +
  308 + });
  309 + },
  310 +
  311 + /**
  312 + * 查询首页订单信息
  313 + */
  314 + queryOwnerParkRecord: function() {
  315 + let req = this.getQueryParams();
  316 + //查询最近三个月的
  317 + let beginTime = new Date();
  318 + let endTime = new Date();
  319 + beginTime.setMonth(beginTime.getMonth() - 3);
  320 + req.beginTime = beginTime;
  321 + req.endTime = endTime;
  322 + req.baseRequest={
  323 + pageNum:this.currentPage,
  324 + pageSize:this.pageSize,
  325 + },
  326 + queryOwnerParkRecord (req).then(response =>{
  327 + if(response.code=='8888'){
  328 + this.orderData = response.data.dataList;
  329 + this.total = response.data.pageTotals;
  330 + }else{
  331 + console.log(response);
  332 + }
  333 +
  334 + });
  335 + },
  336 + // 获取子组件页码方法
  337 + handleSizeChange: function(page) {
  338 + console.log(page)
  339 + this.currentPage = page;
  340 + /** 调用表格数据.*/
  341 + this.queryOwnerParkRecord();
  342 +
  343 + },
  344 +
  345 +
  346 + },
  347 +
  348 + }
  349 +</script>
  350 +
  351 +<style lang="scss" scoped>
  352 + .panel-group .card-panel {
  353 + height: 108px;
  354 + font-size: 12px;
  355 + position: relative;
  356 + overflow: hidden;
  357 + color: #666;
  358 + background: #fff;
  359 + -webkit-box-shadow: 4px 4px 40px rgba(0, 0, 0, .05);
  360 + box-shadow: 4px 4px 40px rgba(0, 0, 0, .05);
  361 + border-color: rgba(0, 0, 0, .05);
  362 + }
  363 +
  364 + .card-panel-icon-wrapper {
  365 + float: left;
  366 + margin: 26px 0 0 15px;
  367 + padding: 16px;
  368 + -webkit-transition: all .38s ease-out;
  369 + transition: all .38s ease-out;
  370 + border-radius: 6px;
  371 + background: #f0f;
  372 + width: 60px;
  373 + height: 60px;
  374 +
  375 + }
  376 +
  377 + .card-panel-description {
  378 + float: right;
  379 + font-weight: 700;
  380 + margin: 26px;
  381 + margin-left: 0;
  382 + }
  383 +
  384 + .card-panel-text {
  385 + line-height: 18px;
  386 + color: rgba(0, 0, 0, .45);
  387 + font-size: 16px;
  388 + margin-bottom: 20px;
  389 + }
  390 +
  391 + .card-panel-num {
  392 + font-size: 20px;
  393 + }
  394 +
  395 + .icon-order{
  396 + background: url("../../assets/dashboard_images/order.png") no-repeat;
  397 + }
  398 + .icon-card{
  399 + background: url("../../assets/dashboard_images/card.png") no-repeat;
  400 + }
  401 + .icon-integral{
  402 + background: url("../../assets/dashboard_images/integral.png") no-repeat;
  403 + }
  404 +
  405 +</style>
... ...
src/views/information/index.vue 0 → 100644
  View file @5fcc135
  1 +<template>
  2 + <div class="">
  3 + <!--卡片-->
  4 + <el-row :gutter="16" class="">
  5 + <el-col :span="8">
  6 + <el-card class="box-card" style="height: 364px">
  7 + <el-form status-icon :rules="rules" ref="fileUploadForm">
  8 + <el-upload
  9 + class="avatar-uploader text-center"
  10 + action="#"
  11 + :show-file-list="false"
  12 + :on-success="handleAvatarSuccess"
  13 + :on-remove="handleRemove"
  14 + :before-upload="beforeAvatarUpload">
  15 + <img v-if="imageUrl" :src="imageUrl" class="avatar">
  16 + <i v-else class="el-icon-plus avatar-uploader-icon"></i>
  17 + </el-upload>
  18 + </el-form>
  19 + <!--<el-button class="text-center" size="small" type="primary">点击上传</el-button>-->
  20 + <!--<div slot="tip" class="el-upload__tip"></div>-->
  21 + <div class="common-color text-center" style="line-height: 60px;font-size: 24px">{{userPhone}}</div>
  22 +
  23 + <div class="font-size12 text-center" style="line-height: 30px">支持JPG格式且小于5MB</div>
  24 + <div class="font-size12 text-center" style="height: 146px"></div>
  25 + </el-card>
  26 + </el-col>
  27 + <el-col :span="16">
  28 + <el-card class="box-card">
  29 + <!-- <div slot="header" class="clearfix" style="line-height: 32px;">
  30 + <span>个人资料</span>
  31 + </div>-->
  32 + <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="80px">
  33 + <el-form-item label="姓名" class="margin-bottom30" prop="username">
  34 + <el-input v-model="ruleForm.username" style="width: 300px"></el-input>
  35 + </el-form-item>
  36 + <el-form-item label="性别" class="margin-bottom30" prop="sex">
  37 + <el-select v-model="ruleForm.sex" style="width: 300px">
  38 + <el-option label="男" value="1"/>
  39 + <el-option label="女" value="2"/>
  40 + <el-option label="未知" value="3"/>
  41 + </el-select>
  42 + </el-form-item>
  43 + <el-form-item label="生日" class="margin-bottom30" prop="birthday">
  44 + <el-date-picker
  45 + v-model="ruleForm.birthday"
  46 + type="date"
  47 + placeholder="选择日期" style="width: 300px">
  48 + </el-date-picker>
  49 + </el-form-item>
  50 + <el-form-item label="位置" class="margin-bottom30" prop="address">
  51 + <el-input type="text" v-model="ruleForm.address" style="width: 300px"></el-input>
  52 + </el-form-item>
  53 +
  54 + <el-form-item>
  55 + <el-button type="primary" @click="submitForm('ruleForm')">提交</el-button>
  56 + </el-form-item>
  57 + </el-form>
  58 + </el-card>
  59 + </el-col>
  60 + </el-row>
  61 + </div>
  62 +</template>
  63 +
  64 +<script>
  65 + import {uploadUserPic,updatePersonByCustId} from '@/api/user.js';
  66 +
  67 + export default {
  68 + data() {
  69 + return {
  70 + imageUrl: '',
  71 + ruleForm: {
  72 + username: '',
  73 + num: '',
  74 + sex: '',
  75 + birthday: '',
  76 + address: '',
  77 + custId: '',
  78 + },
  79 + userPhone:'',
  80 + rules: {
  81 + username: [
  82 + {required: true, message: '请输入用户名', trigger: 'blur'},
  83 + {min: 1, max: 10, message: '长度在 3 到 10 个字符', trigger: 'blur'}
  84 + ],
  85 + birthday: [
  86 + {required: true, message: '请输入日期', trigger: 'blur'}
  87 + ],
  88 + address: [
  89 + {required: true, message: '请输入地址信息', trigger: 'blur'},
  90 + {min: 1, max: 30, message: '长度在 1 到 30 个字符', trigger: 'blur'}
  91 + ],
  92 + }
  93 + };
  94 + },
  95 + methods: {
  96 + handleRemove(res, file) {
  97 + console.log(res, file);
  98 + },
  99 + handleAvatarSuccess(res, file) {
  100 + this.imageUrl = URL.createObjectURL(file.raw);
  101 + debugger
  102 + },
  103 + beforeAvatarUpload(file) {
  104 + let that = this;
  105 + const isJPG = file.type === 'image/jpeg';
  106 + const isLt5M = file.size / 1024 / 1024 < 5;
  107 +
  108 + if (!isJPG) {
  109 + this.$message.error('上传头像图片只能是 JPG 格式!');
  110 + }
  111 + if (!isLt5M) {
  112 + this.$message.error('上传头像图片大小不能超过 5MB!');
  113 + }
  114 + let userInfo = this.$store.state.user.userInfo;
  115 + let fd = new FormData();
  116 + fd.append('custId', userInfo.custId)
  117 + fd.append('file', file)
  118 + uploadUserPic(fd).then(response => {
  119 + if(response.code ='8888'){
  120 + that.imageUrl=response.data;
  121 + }
  122 +
  123 +
  124 + });
  125 +
  126 +
  127 + return isJPG && isLt5M;
  128 + },
  129 + submitForm: function (formName) {
  130 + let username = this.ruleForm.username;
  131 + let sex = this.ruleForm.sex;
  132 + let birthday = this.ruleForm.birthday
  133 + let address = this.ruleForm.address;
  134 + let custId = this.ruleForm.custId;
  135 +
  136 + this.$refs[formName].validate((valid) => {
  137 + if (valid) {
  138 + let req ={
  139 + custName:username,
  140 + sex:sex,
  141 + birthDate:birthday,
  142 + address:address,
  143 + custId:custId
  144 + };
  145 + updatePersonByCustId(req).then(response =>{
  146 + if(response.code ='8888'){
  147 + debugger
  148 + let userInfo = this.$store.state.user.userInfo;
  149 + userInfo.custName=username;
  150 + userInfo.sex=sex;
  151 + userInfo.birthDate=birthday;
  152 + userInfo.address=address;
  153 + this.$message({
  154 + type: 'success',
  155 + message: '更新用户信息成功！'
  156 + });
  157 + }
  158 + });
  159 + }
  160 + });
  161 + },
  162 + resetForm(formName) {
  163 + this.$refs[formName].resetFields();
  164 + },
  165 + queryUserInfo: function () {
  166 + let userInfo = this.$store.state.user.userInfo;
  167 + this.userPhone=userInfo.userPhone;
  168 + this.ruleForm = {
  169 + username: userInfo.custName,
  170 + //num: '',
  171 + sex: userInfo.sex + "",
  172 + birthday: userInfo.birthDate,
  173 + address: userInfo.address,
  174 + custId: userInfo.custId
  175 + }
  176 + }
  177 + },
  178 + mounted: function () {
  179 + this.queryUserInfo();
  180 + }
  181 + }
  182 +</script>
  183 +<style lang="scss">
  184 +
  185 + .avatar-uploader .el-upload {
  186 + border: 1px dashed #d9d9d9;
  187 + border-radius: 50%;
  188 + cursor: pointer;
  189 + position: relative;
  190 + overflow: hidden;
  191 + }
  192 +
  193 + .avatar-uploader .el-upload:hover {
  194 + border-color: #409EFF;
  195 + }
  196 +
  197 + .avatar-uploader-icon {
  198 + font-size: 28px;
  199 + color: #8c939d;
  200 + width: 178px;
  201 + height: 178px;
  202 + line-height: 178px;
  203 + text-align: center;
  204 + }
  205 +
  206 + .avatar {
  207 + width: 178px;
  208 + height: 178px;
  209 + display: block;
  210 + }
  211 +
  212 + .margin-bottom30 {
  213 + margin-bottom: 30px;
  214 + }
  215 +</style>
  216 +
... ...
src/views/login/index.vue 0 → 100644
  View file @5fcc135
  1 +<template>
  2 + <div class="login-container">
  3 + <el-form ref="loginForm" :model="loginForm" :rules="loginRules" class="login-form" auto-complete="on"
  4 + label-position="left">
  5 +
  6 + <div class="title-container">
  7 + <h3 class="title">登录</h3>
  8 + </div>
  9 +
  10 + <el-form-item prop="phone">
  11 + <span class="svg-container">
  12 + <svg-icon icon-class="phone" style="width:18px;height: 18px"/>
  13 + </span>
  14 + <el-input
  15 + ref="phone"
  16 + v-model="loginForm.phone"
  17 + placeholder="手机号"
  18 + name="phone"
  19 + type="text"
  20 + tabindex="1"
  21 + onkeyup = "value=value.replace(/[^\d]/g,'')"
  22 + auto-complete="on"
  23 + />
  24 + </el-form-item>
  25 +
  26 + <el-form-item prop="password">
  27 + <span class="svg-container">
  28 + <svg-icon icon-class="yzm" style="width:18px;height: 18px"/>
  29 + </span>
  30 + <el-input
  31 + ref="password"
  32 + v-model="loginForm.password"
  33 + type="text"
  34 + placeholder="验证码"
  35 + name="password"
  36 + tabindex="2"
  37 + style="width: 140px;"
  38 + auto-complete="on"
  39 + onkeyup = "value=value.replace(/[^\d]/g,'')"
  40 + @keyup.enter.native="handleLogin"
  41 + />
  42 + <el-button type="primary" @click="getVerifyCode" :disabled="disabled" style="float:right;margin-top:6px;margin-right:10px;">{{btnTitle}}</el-button>
  43 + </el-form-item>
  44 +
  45 + <el-button :loading="loading" type="primary" style="width:100%;margin-bottom:30px;"
  46 + @click.native.prevent="handleLogin">登录
  47 + </el-button>
  48 + </el-form>
  49 + </div>
  50 +</template>
  51 +
  52 +<script>
  53 +import {validUsername} from '@/utils/validate'
  54 +import {sendValidatorCode} from '@/api/user.js'
  55 +
  56 +export default {
  57 + name: 'Login',
  58 + data() {
  59 + //判断输入的手机号是否合法
  60 + const validateUsername = (rule, value, callback) => {
  61 + console.log(value)
  62 + if (!value) {
  63 + callback(new Error('请输入手机号'))
  64 + } else if(!/^1[345678]\d{9}$/.test(value)) {
  65 + callback(new Error('请输入正确手机号'))
  66 + }else
  67 + {
  68 + callback()
  69 + }
  70 + }
  71 + const validatePassword = (rule, value, callback) => {
  72 + if (!value) {
  73 + callback(new Error('请输入验证码'))
  74 + } else {
  75 + callback()
  76 + }
  77 + }
  78 + return {
  79 + loginForm: {
  80 + phone: '',
  81 + password: ''
  82 + },
  83 + loginRules: {
  84 + phone: [{ required: true, trigger: 'blur', validator: validateUsername }],
  85 + password: [{ required: true, trigger: 'blur', validator: validatePassword }]
  86 + },
  87 + loading: false,
  88 + disabled: false,
  89 + btnTitle: '发送验证码',
  90 + redirect: undefined
  91 + }
  92 + },
  93 + watch: {
  94 + $route: {
  95 + handler: function (route) {
  96 + this.redirect = route.query && route.query.redirect
  97 + },
  98 + immediate: true
  99 + }
  100 + },
  101 + methods: {
  102 + getVerifyCode(){
  103 + let phone = this.loginForm.phone;
  104 + if (!this.loginForm.phone) {
  105 + new Error('请输入手机号!');
  106 + } else if(!/^1[345678]\d{9}$/.test(this.loginForm.phone)) {
  107 + new Error('请输入正确手机号!');
  108 + }
  109 + //获取验证码
  110 + else {
  111 + sendValidatorCode(phone).then(response =>{
  112 + let data = response.data;
  113 + if(data.code=='8888'){
  114 + this.$message({
  115 + type: 'success',
  116 + message: '验证码发送成功！'
  117 + });
  118 + }
  119 + });
  120 + //this.validateBtn();
  121 +
  122 + }
  123 + },
  124 + validateBtn(){
  125 + //倒计时
  126 + let time = 60;
  127 + let timer = setInterval(() => {
  128 + if(time == 0) {
  129 + clearInterval(timer);
  130 + this.disabled = false;
  131 + this.btnTitle = "获取验证码";
  132 + } else {
  133 + this.btnTitle =time + '秒后重试';
  134 + this.disabled = true;
  135 + time--
  136 + }
  137 + },1000)
  138 + },
  139 + handleLogin() {
  140 + this.$refs.loginForm.validate(valid => {
  141 + if (valid) {
  142 + this.loading = true
  143 + this.$store.dispatch('user/login', this.loginForm).then(() => {
  144 + this.$router.push({ path: this.redirect || '/' })
  145 + this.loading = false
  146 + }).catch(() => {
  147 + this.loading = false
  148 + })
  149 + } else {
  150 + console.log('error submit!!')
  151 + return false
  152 + }
  153 + })
  154 + }
  155 + }
  156 +}
  157 +</script>
  158 +
  159 +<style lang="scss">
  160 + /* 修复input 背景不协调 和光标变色 */
  161 + /* Detail see https://github.com/PanJiaChen/vue-element-admin/pull/927 */
  162 +
  163 + $bg: #283443;
  164 + $light_gray: #fff;
  165 + $cursor: #fff;
  166 +
  167 + @supports (-webkit-mask: none) and (not (cater-color: $cursor)) {
  168 + .login-container .el-input input {
  169 + color: $cursor;
  170 + }
  171 + }
  172 +
  173 + /* reset element-ui css */
  174 + .login-container {
  175 + .el-input {
  176 + display: inline-block;
  177 + height: 47px;
  178 + width: 85%;
  179 + float: left;
  180 +
  181 + input {
  182 + background: transparent;
  183 + border: 0px;
  184 + -webkit-appearance: none;
  185 + border-radius: 0px;
  186 + padding: 12px 5px 12px 15px;
  187 + color: $light_gray;
  188 + height: 47px;
  189 + caret-color: $cursor;
  190 +
  191 + &:-webkit-autofill {
  192 + box-shadow: 0 0 0px 1000px $bg inset !important;
  193 + -webkit-text-fill-color: $cursor !important;
  194 + }
  195 + }
  196 + }
  197 +
  198 + .el-form-item {
  199 + border: 1px solid rgba(255, 255, 255, 0.1);
  200 + background: rgba(0, 0, 0, 0.1);
  201 + border-radius: 5px;
  202 + color: #454545;
  203 + }
  204 + }
  205 +</style>
  206 +
  207 +<style lang="scss" scoped>
  208 + $bg: #2d3a4b;
  209 + $dark_gray: #889aa4;
  210 + $light_gray: #eee;
  211 +
  212 + .login-container {
  213 + /*min-height: 100%;*/
  214 + width: 100%;
  215 + background: url("../../assets/login_images/login-bg.jpg") no-repeat;
  216 + background-size: 100% 100%;
  217 + overflow: hidden;
  218 +
  219 + .login-form {
  220 + position: absolute;
  221 + width: 400px;
  222 + max-width: 100%;
  223 + /*padding: 160px 35px 0;*/
  224 + /*margin: 0 auto;*/
  225 + top: 50%;
  226 + left: 50%;
  227 + transform: translate(-50%, -50%);
  228 + overflow: hidden;
  229 + background: rgba(26, 29, 41, .6);
  230 + }
  231 +
  232 + .tips {
  233 + font-size: 14px;
  234 + color: #fff;
  235 + margin-bottom: 10px;
  236 +
  237 + span {
  238 + &:first-of-type {
  239 + margin-right: 16px;
  240 + }
  241 + }
  242 + }
  243 +
  244 + .svg-container {
  245 + padding: 6px 5px 6px 15px;
  246 + color: $dark_gray;
  247 + vertical-align: middle;
  248 + width: 30px;
  249 + display: inline-block;
  250 + float: left;
  251 + }
  252 +
  253 + .title-container {
  254 + position: relative;
  255 +
  256 + .title {
  257 + font-size: 26px;
  258 + color: $light_gray;
  259 + margin: 15px auto 40px auto;
  260 + text-align: center;
  261 + font-weight: bold;
  262 + }
  263 + }
  264 +
  265 + .show-pwd {
  266 + position: absolute;
  267 + right: 10px;
  268 + top: 7px;
  269 + font-size: 16px;
  270 + color: $dark_gray;
  271 + cursor: pointer;
  272 + user-select: none;
  273 + }
  274 + }
  275 +
  276 + .login-container .el-form-item {
  277 + margin-bottom: 25px;
  278 + background-color: #333;
  279 + color: #FFF;
  280 + border-radius: 0;
  281 + }
  282 +
  283 + .el-button {
  284 + border-radius: 0;
  285 + }
  286 +</style>
... ...
src/views/mycar/index.vue 0 → 100644
  View file @5fcc135
  1 +<template>
  2 + <div>
  3 +
  4 + <div class="search-wrap">
  5 + <el-row :gutter="20">
  6 + <el-form ref="form" :model="form" label-width="60px" label-position="left">
  7 + <el-col :xs="8" :sm="6" :md="7" :lg="7" :xl="1">
  8 + <el-form-item label="账户ID">
  9 + <el-input v-model="form.custId" maxlength="20" :disabled="true"/>
  10 + </el-form-item>
  11 + </el-col>
  12 + <el-col :xs="8" :sm="6" :md="7" :lg="7" :xl="1" :offset="8">
  13 + <el-form-item label="手机号">
  14 + <el-input v-model="form.phone" maxlength="20" :disabled="true"/>
  15 + </el-form-item>
  16 + </el-col>
  17 + </el-form>
  18 + </el-row>
  19 + </div>
  20 + <el-row :gutter="20" style="margin-top: 8px">
  21 + <el-col :span="12">
  22 + <el-card class="box-card" style="height: 300px">
  23 + <div slot="header" class="clearfix">
  24 + <span>车牌绑定</span>
  25 + </div>
  26 + <el-form ref="bondform" :model="bondform" label-width="60px" label-position="left" :rules="rules">
  27 + <el-row :gutter="20">
  28 + <el-col :span="12">
  29 + <el-form-item label="车牌号" prop="carNum">
  30 + <el-input type="text" v-model="bondform.carNum"/>
  31 + </el-form-item>
  32 + </el-col>
  33 + <el-col :span="12">
  34 + <el-button type="primary" :loading="bondformBtnVisible" @click="bondCarNum('bondform')">绑定车牌</el-button>
  35 + </el-col>
  36 + </el-row>
  37 +
  38 + </el-form>
  39 +
  40 + </el-card>
  41 + </el-col>
  42 + <el-col :span="12">
  43 + <el-card class="box-card" style="height: 300px">
  44 + <div slot="header" class="clearfix">
  45 + <span>解绑车牌</span>
  46 + </div>
  47 + <el-form ref="form" :model="form" label-width="60px" label-position="left">
  48 + <el-row :gutter="20" v-for="item in alredyBoundCar" style="margin-top: 4px">
  49 + <el-col :span="12">
  50 + <el-form-item label="已绑车牌">
  51 + <el-input :value="item.carNumber"/>
  52 + </el-form-item>
  53 + </el-col>
  54 + <el-col :span="12">
  55 + <el-button type="primary" @click="alredyBoundCarBtn(item.carNumber)">解绑车牌</el-button>
  56 + </el-col>
  57 + </el-row>
  58 +
  59 + </el-form>
  60 +
  61 + </el-card>
  62 + </el-col>
  63 + </el-row>
  64 +
  65 +
  66 + </div>
  67 +</template>
  68 +
  69 +<script>
  70 + import {getPersonCarNumPC,boundCarNum,unboundCarNum} from '@/api/mycar.js';
  71 + export default {
  72 + data() {
  73 + var carNumValidator = (rule, value, callback) => {
  74 + if (value === '') {
  75 + callback(new Error('请输入车牌号'));
  76 + }
  77 +
  78 + if (!/^[京津沪渝冀豫云辽黑湘皖鲁新苏浙赣鄂桂甘晋蒙陕吉闽贵粤青藏川宁琼使领A-Z]{1}[A-Z]{1}[A-Z0-9]{4}[A-Z0-9挂学警港澳]{1}$/.test(this.bondform.carNum)||this.bondform.carNum.length<7) {
  79 + callback(new Error('请输入正确的车牌号'));
  80 + }
  81 + callback();
  82 +
  83 + };
  84 + return {
  85 + form: {
  86 + custId: '',
  87 + phone: '',
  88 + },
  89 + /**绑定车牌.*/
  90 + bondform: {
  91 + carNum: ''
  92 + },
  93 +
  94 + /**已绑定车牌.*/
  95 + alredyBoundCar:[],
  96 + bondformBtnVisible: false,
  97 + dialogFormVisible: false,
  98 + problemform: {
  99 + carnum: '',
  100 + },
  101 + rules:{
  102 + carNum:[{ validator: carNumValidator, trigger: 'blur' }]
  103 + }
  104 + }
  105 +
  106 +
  107 + },
  108 + methods: {
  109 + /**绑定车牌*/
  110 + bondCarNum:function(formName){
  111 + let that = this;
  112 + let custId = this.form.custId;
  113 + let carNum = this.bondform.carNum;
  114 + this.$refs[formName].validate((valid) => {
  115 + if (valid) {
  116 + let req ={
  117 + custId:custId,
  118 + carNumber:carNum,
  119 + sysCode:'1001',
  120 + carBindingStatus:1, //绑定
  121 + };
  122 + boundCarNum(req).then(response =>{
  123 + if(response.code='8888'){
  124 + that.bondform.carNum='';
  125 + this.$message({
  126 + type: 'success',
  127 + message: '车牌绑定成功！'
  128 + });
  129 +
  130 + }
  131 + });
  132 + } else {
  133 + console.log('error submit!!');
  134 + return false;
  135 + }
  136 + });
  137 + },
  138 + /**获取车牌.*/
  139 + getPersonCarNumPC:function () {
  140 + let that =this;
  141 + getPersonCarNumPC().then(response =>{
  142 +
  143 + if(response.code ='8888'){
  144 + that.alredyBoundCar=response.data;
  145 + }
  146 + });
  147 + },
  148 + /**解绑车牌.*/
  149 + alredyBoundCarBtn:function (carNum) {
  150 + if("" == carNum || null ==carNum || undefined == carNum){
  151 + this.$message({
  152 + type: 'error',
  153 + message: '解绑的车牌不能为空'
  154 + });
  155 + }
  156 + let that =this;
  157 + let custId = this.form.custId;
  158 + let req ={
  159 + custId:custId,
  160 + carNumber:carNum,
  161 + sysCode:'1001',
  162 + carBindingStatus:2, //解绑
  163 + };
  164 + unboundCarNum(req).then(response =>{
  165 + if(response.code ='8888'){
  166 + this.$message({
  167 + type: 'success',
  168 + message: '车牌解绑成功！'
  169 + });
  170 + this.getPersonCarNumPC();
  171 + }else{
  172 + this.$message({
  173 + type: 'error',
  174 + message: '车牌解绑失败！'
  175 + });
  176 + }
  177 + });
  178 + }
  179 + },
  180 + mounted:function(){
  181 + let userInfo = this.$store.state.user.userInfo;
  182 + this.form={
  183 + custId: userInfo.custId,
  184 + phone: userInfo.userPhone
  185 + };
  186 + this.getPersonCarNumPC();
  187 + }
  188 + }
  189 +</script>
  190 +
  191 +<style lang="scss">
  192 + .search-wrap {
  193 + background-color: #FFF;
  194 + padding: 15px;
  195 + }
  196 +
  197 + .card-second-top {
  198 + margin-top: 15px;
  199 + }
  200 +
  201 + .el-card__header {
  202 + padding: 10px 20px;
  203 + }
  204 +
  205 + .el-radio {
  206 + margin-right: 80px;
  207 + }
  208 +
  209 + .el-radio.is-bordered + .el-radio.is-bordered {
  210 + margin-left: 0px;
  211 + margin-top: 15px;
  212 + }
  213 +</style>
  214 +
... ...
src/views/myevaluate/index.vue 0 → 100644
  View file @5fcc135
  1 +<template>
  2 + <div>
  3 + <div class="serch-wrap">
  4 + <el-row :gutter="20">
  5 + <el-form ref="form" :model="form" label-width="60px" label-position="left">
  6 + <el-col :xs="8" :sm="6" :md="7" :lg="7" :xl="1">
  7 + <el-form-item label="问题类型">
  8 + <el-select v-model="form.feedbackId" placeholder="请选择问题类型">
  9 + <el-option v-for="item in problemTpyeSelectData" :label="item.name" :value="item.code"/>
  10 +
  11 + </el-select>
  12 + </el-form-item>
  13 + </el-col>
  14 + <el-col :xs="16" :sm="6" :md="3" :lg="3" :xl="1" :offset="12">
  15 + <el-button type="primary" @click="queryBtn">查询</el-button>
  16 + </el-col>
  17 + </el-form>
  18 + </el-row>
  19 + </div>
  20 +
  21 + <el-card shadow="always" class="card-second-top">
  22 + <div slot="header" class="clearfix" style="line-height: 32px;">
  23 + <span>详细记录</span>
  24 + <el-button type="primary" size="small" style="float: right" @click="dialogOpen">评价</el-button>
  25 + </div>
  26 + <el-table
  27 + :data="orderData"
  28 + style="width: 100%;"
  29 + :show-overflow-tooltip="true">
  30 + <el-table-column
  31 + prop="feedbackCode"
  32 + label="问题类型"
  33 + :formatter="formatProblemType"
  34 + :show-overflow-tooltip="true">
  35 + </el-table-column>
  36 + <el-table-column
  37 + prop="suggestDesc"
  38 + label="问题内容"
  39 + :show-overflow-tooltip="true">
  40 + </el-table-column>
  41 + <el-table-column
  42 + prop="createDate"
  43 + label="提交时间"
  44 + :formatter="formatCreateDate"
  45 + :show-overflow-tooltip="true">
  46 + </el-table-column>
  47 + <el-table-column
  48 + prop="userPhone"
  49 + :formatter="formatserPhone"
  50 + label="用户手机号">
  51 + </el-table-column>
  52 + </el-table>
  53 + <el-pagination
  54 + :page-size="pageSize"
  55 + :pager-count="currentPage"
  56 + layout="prev, pager, next"
  57 + @current-change="handleCurrentChange"
  58 + :total="total">
  59 + </el-pagination>
  60 + </el-card>
  61 +
  62 + <el-dialog title="提交问题" :visible.sync="dialogFormVisible">
  63 + <el-form :model="problemform" :rules="rules" ref="problemform">
  64 + <el-form-item label="">
  65 + <el-radio-group v-model="problemform.resource" size="">
  66 + <el-radio border v-for="item in problemTpyeSelectData" :label="item.code">{{item.name}}</el-radio>
  67 + </el-radio-group>
  68 + </el-form-item>
  69 + <el-form-item label="问题内容" style="margin-top: 16px" prop="desc">
  70 + <el-input type="textarea" v-model="problemform.desc" style="width:400px"></el-input>
  71 + </el-form-item>
  72 + </el-form>
  73 + <div slot="footer" class="dialog-footer">
  74 + <el-button @click="dialogFormVisible = false">取 消</el-button>
  75 + <el-button type="primary" @click="executeDialog('problemform')">提交</el-button>
  76 + </div>
  77 + </el-dialog>
  78 + </div>
  79 +</template>
  80 +
  81 +<script>
  82 + import {queryFeedbackAndSuggestForPage,getFeedbackType,saveFeedbackAndSuggest} from '@/api/mysuggest.js';
  83 + import {timeFormatter} from '@/utils/utils.js'
  84 + export default {
  85 + data() {
  86 + return {
  87 + form: {
  88 + feedbackId:''
  89 + },
  90 + problemTpyeSelectData:[],
  91 + problemform: {
  92 + resource: '1',
  93 + desc:''
  94 + },
  95 + dialogFormVisible: false,
  96 + total: 10,
  97 + currentPage: 1,
  98 + pageSize: 5,
  99 + orderData: [],
  100 + rules:{
  101 + desc:[
  102 + {required: true, message: '请输入问题内容', trigger: 'blur'},
  103 + {min: 1, max: 10, message: '长度在 3 到 128 个字符', trigger: 'blur'}
  104 + ]
  105 + }
  106 + }
  107 + },
  108 + methods: {
  109 + queryBtn() {
  110 + let that =this;
  111 + let userInfo = this.$store.state.user.userInfo;
  112 + let req ={
  113 + baseRequest:{
  114 + pageNum:that.currentPage,
  115 + pageSize:that.pageSize
  116 + },
  117 + feedbackCode:this.form.feedbackId,
  118 + custId:userInfo.custId,
  119 + sysCode:'1000'
  120 + };
  121 + queryFeedbackAndSuggestForPage(req).then(response =>{
  122 + if(response.code='8888'){
  123 + that.orderData=response.data.rows;
  124 + that.total=response.data.total;
  125 + }
  126 + });
  127 + },
  128 + /**格式化问题类型.*/
  129 + formatProblemType:function(row, column, cellValue, index){
  130 + let value="";
  131 + if(cellValue == null || cellValue == '' ){
  132 + return value;
  133 + }else{
  134 + this.problemTpyeSelectData.forEach(item =>{
  135 + if(cellValue ==item.code){
  136 + value =item.name;
  137 + }
  138 + });
  139 + }
  140 + return value;
  141 + },
  142 + /**格式化时间*/
  143 + formatCreateDate:function (row, column, cellValue, index) {
  144 + return timeFormatter(cellValue,7)
  145 + },
  146 + /**问题类型查询*/
  147 + getFeedbackType:function(){
  148 + getFeedbackType().then(response =>{
  149 + if(response.code='8888'){
  150 + this.problemTpyeSelectData = response.data;
  151 + }
  152 + });
  153 + },
  154 + /**格式化手机号*/
  155 + formatserPhone:function (row, column, cellValue, index) {
  156 + if(cellValue == null || cellValue == undefined || cellValue == ''){
  157 + return "-"
  158 + }else{
  159 + return cellValue.substr(0, 3)+"****"+cellValue.substr(7, 4)
  160 + }
  161 + },
  162 + /**页面改变.*/
  163 + handleCurrentChange:function (value) {
  164 + this.currentPage=value;
  165 + this.queryBtn();
  166 + },
  167 +
  168 + dialogOpen:function(){
  169 + let problemform= {
  170 + resource: '1',
  171 + desc:''
  172 + };
  173 + this.dialogFormVisible=true;
  174 + },
  175 + /**提交.*/
  176 + executeDialog:function(formName){
  177 + let that =this;
  178 + let userInfo = this.$store.state.user.userInfo;
  179 + let feedbackCode=that.problemform.resource;
  180 + let suggestDesc =that.problemform.desc;
  181 +
  182 + this.$refs[formName].validate((valid) => {
  183 + if (valid) {
  184 + let req ={
  185 + custId:userInfo.custId,
  186 + userPhone:userInfo.userPhone,
  187 + feedbackCode:feedbackCode,
  188 + suggestDesc:suggestDesc,
  189 + sysCode:'1001'
  190 + }
  191 + saveFeedbackAndSuggest(req).then(response =>{
  192 + if(response.code='8888'){
  193 + this.dialogFormVisible=false;
  194 + this.$message({
  195 + type: 'success',
  196 + message: '问题提交成功！'
  197 + });
  198 + that.queryBtn();
  199 + }else{
  200 + this.$message({
  201 + type: 'error',
  202 + message: '问题提交失败！'
  203 + });
  204 + }
  205 + });
  206 + }
  207 + });
  208 + }
  209 + },
  210 + mounted:function () {
  211 + this.queryBtn();
  212 + this.getFeedbackType();
  213 + }
  214 + }
  215 +</script>
  216 +
  217 +<style lang="scss">
  218 + .serch-wrap{
  219 + background-color: #FFF;
  220 + padding: 15px;
  221 + }
  222 + .card-second-top{
  223 + margin-top: 15px;
  224 + }
  225 + .el-card__header{
  226 + padding: 10px 20px;
  227 + }
  228 + .el-radio{
  229 + margin-right: 80px;
  230 + }
  231 + .el-radio.is-bordered+.el-radio.is-bordered{
  232 + margin-left: 0px;
  233 + margin-top: 15px;
  234 + }
  235 +</style>
  236 +
... ...
src/views/order/index.vue 0 → 100644
  View file @5fcc135
  1 +<template>
  2 + <div>
  3 + <div class="serch-wrap">
  4 + <el-row :gutter="20">
  5 + <el-form ref="form" :model="form" label-width="60px" label-position="left">
  6 + <!--<el-col :xs="8" :sm="6" :md="7" :lg="7" :xl="1">-->
  7 +
  8 + <!--<el-form-item label="停车场">-->
  9 + <!--<el-select v-model="form.plNos" placeholder="请选择停车场">-->
  10 + <!--<el-option label="停车场BA" value="shanghai"/>-->
  11 + <!--<el-option label="停车场" value="beijing"/>-->
  12 + <!--</el-select>-->
  13 + <!--</el-form-item>-->
  14 +
  15 + <!--</el-col>-->
  16 + <el-col :xs="8" :sm="6" :md="7" :lg="7" :xl="1">
  17 + <el-form-item label="车牌">
  18 + <el-input v-model="form.carNum" maxlength="10" />
  19 + </el-form-item>
  20 + </el-col>
  21 + <!--<el-col :xs="8" :sm="6" :md="7" :lg="7" :xl="1">-->
  22 + <!--<el-form-item label="类型">-->
  23 + <!--<el-select v-model="form.region" placeholder="请选择类型">-->
  24 + <!--<el-option label="室内停车场" value="shanghai"/>-->
  25 + <!--<el-option label="路侧停车场" value="beijing"/>-->
  26 + <!--</el-select>-->
  27 + <!--</el-form-item>-->
  28 + <!--</el-col>-->
  29 + <el-col :xs="8" :sm="6" :md="3" :lg="3" :xl="1" >
  30 + <el-button type="primary" @click="onSubmit">查询</el-button>
  31 + </el-col>
  32 + </el-form>
  33 + </el-row>
  34 + </div>
  35 +
  36 + <div class="table-wrap">
  37 + <p class="table-title">订单详情</p>
  38 + <el-table
  39 + :data="orderData"
  40 + style="width: 100%;"
  41 + :show-overflow-tooltip="true">
  42 + <el-table-column
  43 + prop="plName"
  44 + label="停车场"
  45 + :show-overflow-tooltip="true">
  46 + </el-table-column>
  47 + <el-table-column
  48 + prop="carNumber"
  49 + label="车牌"
  50 + :show-overflow-tooltip="true">
  51 + </el-table-column>
  52 + <el-table-column
  53 + prop="orderTotalFee"
  54 + label="应收费用">
  55 + <template slot-scope="scope">
  56 + <span>{{(scope.row.orderTotalFee) |fen2Yuan}} </span>
  57 + </template>
  58 + </el-table-column>
  59 + <el-table-column
  60 + prop="orderActFee"
  61 + label="实收费用">
  62 + <template slot-scope="scope">
  63 + <span>{{(scope.row.orderActFee) |fen2Yuan}} </span>
  64 + </template>
  65 + </el-table-column>
  66 + <el-table-column
  67 + prop="parkInTime"
  68 + label="入场时间"
  69 + :show-overflow-tooltip="true">
  70 + <template slot-scope="scope">
  71 + <span>{{(scope.row.parkInTime) |string2Date(7)}} </span>
  72 + </template>
  73 + </el-table-column>
  74 + <el-table-column
  75 + prop="parkOutTime"
  76 + label="出场时间"
  77 + :show-overflow-tooltip="true">
  78 + <template slot-scope="scope">
  79 + <span>{{(scope.row.parkOutTime) |string2Date(7)}} </span>
  80 + </template>
  81 + </el-table-column>
  82 + <el-table-column
  83 + prop="parkingDuration"
  84 + label="停车时长"
  85 + :show-overflow-tooltip="true">
  86 + <template slot-scope="scope">
  87 + <span>{{(scope.row) |parkingDurationFormatter(scope.row.parkingDuration)}} </span>
  88 + </template>
  89 + </el-table-column>
  90 + <el-table-column
  91 + prop="berthNo"
  92 + label="泊位编号">
  93 + </el-table-column>
  94 + <el-table-column
  95 + prop="orderState"
  96 + label="订单状态">
  97 + <template slot-scope="scope">
  98 + <span>{{(scope.row) |inOutStateFormatter}} </span>
  99 + </template>
  100 + </el-table-column>
  101 + </el-table>
  102 + <el-pagination
  103 + :page-size="10"
  104 + :pager-count="11"
  105 + layout="prev, pager, next"
  106 + :total="total"
  107 + @size-change="handleSizeChange"
  108 + @current-change="handleSizeChange"
  109 + @prev-click="handleSizeChange"
  110 + @next-click="handleSizeChange"
  111 + >
  112 + </el-pagination>
  113 + </div>
  114 + </div>
  115 +</template>
  116 +
  117 +<script>
  118 + import {queryOwnerParkRecord} from '@/api/index';
  119 + import {fen2Yuan,string2Date,inOutStateFormatter,parkingDurationFormatter} from '@/filters/index';
  120 +export default {
  121 + data() {
  122 + return {
  123 + form: {
  124 + plNos: null,
  125 + carNum: null,
  126 +
  127 + },
  128 + total: 0,
  129 + currentPage: 1,
  130 + pageSize: 6,
  131 + orderData: [
  132 + ]
  133 + }
  134 + },
  135 + mounted: function() {
  136 +
  137 + this.queryOwnerParkRecord();
  138 + },
  139 + methods: {
  140 + /**
  141 + * 获取查询参数
  142 + */
  143 + getQueryParams: function() {
  144 + let userInfo = this.$store.state.user.userInfo;
  145 + let plNos = [];
  146 + if(this.form.plNos != null && this.form.plNos != ''){
  147 + plNos.push(this.form.plNos);
  148 + }
  149 + let req = {
  150 + custId:userInfo.custId,
  151 + // custId:'501519113641649119232',
  152 + plNos:plNos,
  153 + carNum:this.form.carNum,
  154 + }
  155 + return req;
  156 + },
  157 + /**
  158 + * 查询订单信息
  159 + */
  160 + queryOwnerParkRecord: function() {
  161 + let req = this.getQueryParams();
  162 +
  163 + req.baseRequest={
  164 + pageNum:this.currentPage,
  165 + pageSize:this.pageSize,
  166 + },
  167 + queryOwnerParkRecord (req).then(response =>{
  168 + if(response.code=='8888'){
  169 + this.orderData = response.data.dataList;
  170 + this.total = response.data.pageTotals;
  171 + }else{
  172 + console.log(response);
  173 + }
  174 +
  175 + });
  176 + },
  177 + // 获取子组件页码方法
  178 + handleSizeChange: function(page) {
  179 + console.log(page)
  180 + this.currentPage = page;
  181 + /** 调用表格数据.*/
  182 + this.queryOwnerParkRecord();
  183 +
  184 + },
  185 +
  186 + onSubmit() {
  187 + this.queryOwnerParkRecord();
  188 + },
  189 + onCancel() {
  190 + this.$message({
  191 + message: 'cancel!',
  192 + type: 'warning'
  193 + })
  194 + }
  195 + }
  196 +}
  197 +</script>
  198 +
  199 +<style scoped>
  200 + .serch-wrap{
  201 + background-color: #FFF;
  202 + padding: 15px;
  203 + }
  204 +
  205 +</style>
  206 +
... ...
src/views/payback/index.vue 0 → 100644
  View file @5fcc135
  1 +<template>
  2 + <div>
  3 + <div class="serch-wrap">
  4 + <el-row :gutter="20">
  5 + <el-form ref="form" :model="form" label-width="60px" label-position="left">
  6 + <el-col :xs="8" :sm="6" :md="7" :lg="7" :xl="1">
  7 +
  8 + <el-form-item label="公司">
  9 + <el-select v-model="form.orgId" placeholder="请选择公司">
  10 + <el-option v-for="item in orgs" :label="item.orgName" :value="item.orgId"/>
  11 +
  12 + </el-select>
  13 + </el-form-item>
  14 +
  15 + </el-col>
  16 + <el-col :xs="8" :sm="6" :md="7" :lg="7" :xl="1">
  17 + <el-form-item label="车牌">
  18 + <el-input v-model="form.name" maxlength="10" />
  19 + </el-form-item>
  20 + </el-col>
  21 + <el-col :xs="8" :sm="6" :md="3" :lg="3" :xl="1">
  22 + <el-button type="primary" @click="onSubmit">查询</el-button>
  23 + </el-col>
  24 + </el-form>
  25 + </el-row>
  26 + </div>
  27 +
  28 + <div class="table-wrap">
  29 + <el-row :gutter="20">
  30 + <el-col :xs="8" :sm="6" :md="3" :lg="22" :xl="1">
  31 + <p class="table-title">订单详情</p>
  32 + </el-col>
  33 + <el-col :xs="8" :sm="3" :md="3" :lg="2" :xl="1">
  34 + <el-button style="margin-top: 8px" size="small" type="primary" @click="toBackSubmit">补缴</el-button>
  35 + </el-col>
  36 + </el-row>
  37 + <el-table
  38 + :data="orderData"
  39 + style="width: 100%;"
  40 + :show-overflow-tooltip="true"
  41 + @selection-change="handleSelectionChange">
  42 + <el-table-column
  43 + type="selection">
  44 + </el-table-column>
  45 + <el-table-column
  46 + prop="plName"
  47 + label="停车场"
  48 + :show-overflow-tooltip="true">
  49 + </el-table-column>
  50 + <el-table-column
  51 + prop="carNumber"
  52 + label="车牌"
  53 + :show-overflow-tooltip="true">
  54 + </el-table-column>
  55 + <el-table-column
  56 + prop="arrearageFee"
  57 + label="欠费金额">
  58 + <template slot-scope="scope">
  59 + <span>{{(scope.row.arrearageFee) |fen2Yuan}} </span>
  60 + </template>
  61 + </el-table-column>
  62 + <el-table-column
  63 + prop="parkInTime"
  64 + label="入场时间"
  65 + :show-overflow-tooltip="true">
  66 + <template slot-scope="scope">
  67 + <span>{{(scope.row.parkInTime) |string2Date(7)}} </span>
  68 + </template>
  69 + </el-table-column>
  70 + <el-table-column
  71 + prop="parkOutTime"
  72 + label="出场时间"
  73 + :show-overflow-tooltip="true">
  74 + <template slot-scope="scope">
  75 + <span>{{(scope.row.parkOutTime) |string2Date(7)}} </span>
  76 + </template>
  77 + </el-table-column>
  78 + <el-table-column
  79 + prop="parkingDuration"
  80 + label="停车时长"
  81 + :show-overflow-tooltip="true">
  82 + <template slot-scope="scope">
  83 + <span>{{(scope.row) |parkingDurationFormatter(scope.row.parkingDuration)}} </span>
  84 + </template>
  85 + </el-table-column>
  86 + <el-table-column
  87 + prop="berthNo"
  88 + label="泊位编号">
  89 + </el-table-column>
  90 + <el-table-column
  91 + prop="orderState"
  92 + label="订单状态">
  93 + <template slot-scope="scope">
  94 + <span>{{(scope.row) |inOutStateFormatter}} </span>
  95 + </template>
  96 + </el-table-column>
  97 + </el-table>
  98 + <el-pagination
  99 + :page-size="10"
  100 + :pager-count="11"
  101 + layout="prev, pager, next"
  102 + :total="total"
  103 + @size-change="handleSizeChange"
  104 + @current-change="handleSizeChange"
  105 + @prev-click="handleSizeChange"
  106 + @next-click="handleSizeChange"
  107 + >
  108 + </el-pagination>
  109 + </div>
  110 + <!--补缴对话框-->
  111 + <el-dialog
  112 + title="补缴"
  113 + :visible.sync="dialogVisible"
  114 + width="30%"
  115 + :close-on-click-modal="false">
  116 + <!--<div>-->
  117 + <!--<img style="display: block;width: 100%" :src="url" >-->
  118 +
  119 + <!--</div>-->
  120 + <div>
  121 + <div id="qrcode"></div>
  122 + </div>
  123 + <span slot="footer" class="dialog-footer">
  124 + <el-button type="primary" @click="onBack">确 定</el-button>
  125 + </span>
  126 + </el-dialog>
  127 +
  128 + </div>
  129 +</template>
  130 +
  131 +<script>
  132 + import {pageQueryArrearRecordByCondition,selectAllAppOrg,personOrderBackWxPay } from '@/api/index';
  133 + import {fen2Yuan,string2Date,inOutStateFormatter,parkingDurationFormatter} from '@/filters/index';
  134 + import QRCode from 'qrcodejs2' // 引入qrcode
  135 + export default {
  136 + data() {
  137 + return {
  138 + form: {
  139 + orgId:null,
  140 + plNos: null,
  141 + carNum: null,
  142 +
  143 + },
  144 + orgs:[],
  145 + total: 0,
  146 + currentPage: 1,
  147 + pageSize: 6,
  148 + orderData: [
  149 + ],
  150 + multipleSelection:[],
  151 + dialogVisible:false,
  152 + url:'http://img.renniting.cn/group1/M00/35/07/rBABHF0fHpOAGw2BAAF_F0CXpIA340.png',
  153 + }
  154 + },
  155 + mounted: function() {
  156 + this.selectAllAppOrg();
  157 +
  158 + },
  159 + methods: {
  160 + qrcode :function(url) {
  161 + let qrcode = new QRCode('qrcode', {
  162 + width: 100,
  163 + height: 100, // 高度
  164 + text: url,// 二维码内容
  165 + // render: 'canvas' // 设置渲染方式（有两种方式 table和canvas，默认是canvas）
  166 + // background: '#f0f'
  167 + // foreground: '#ff0'
  168 + })
  169 + console.log(qrcode)
  170 + },
  171 + clearCode:function(){
  172 +
  173 + var qrcodes=document.getElementById('qrcode');
  174 + if(qrcodes != null && qrcodes.innerHTML != '' && qrcodes.innerHTML!= null){
  175 + qrcodes.innerHTML = '';
  176 + }
  177 +
  178 + },
  179 + /**
  180 + *获取所有组织下拉框
  181 + */
  182 + selectAllAppOrg:function(){
  183 + let req = {};
  184 + selectAllAppOrg (req).then(response =>{
  185 + if(response.code=='8888'){
  186 + this.orgs = response.data;
  187 + this.form.orgId = response.data[0].orgId;
  188 + this.pageQueryArrearRecordByCondition();
  189 + }else{
  190 + console.log(response);
  191 + }
  192 +
  193 + });
  194 + },
  195 + /**
  196 + * 获取查询参数
  197 + */
  198 + getQueryParams: function() {
  199 + if(this.form.orgId == undefined || this.form.orgId == null){
  200 + console.log("orgId为空");
  201 + return;
  202 + }
  203 + let userInfo = this.$store.state.user.userInfo;
  204 + let plNos = [];
  205 + if(this.form.plNos != null && this.form.plNos != ''){
  206 + plNos.push(this.form.plNos);
  207 + }
  208 + let req = {
  209 + //custId:userInfo.custId,
  210 + custId:'501519113641649119232',
  211 + orderStates:[52],
  212 + plNos:plNos,
  213 + orgId:this.form.orgId,
  214 + carNum:this.form.carNum,
  215 + }
  216 + return req;
  217 + },
  218 + /**
  219 + * 查询订单信息
  220 + */
  221 + pageQueryArrearRecordByCondition: function() {
  222 + let req = this.getQueryParams();
  223 +
  224 + req.baseRequest={
  225 + pageNum:this.currentPage,
  226 + pageSize:this.pageSize,
  227 + },
  228 + pageQueryArrearRecordByCondition (req).then(response =>{
  229 + if(response.code=='8888'){
  230 + this.orderData = response.data.dataList;
  231 + this.total = response.data.pageTotals;
  232 + }else{
  233 + console.log(response);
  234 + }
  235 +
  236 + });
  237 + },
  238 + // 获取子组件页码方法
  239 + handleSizeChange: function(page) {
  240 + console.log(page)
  241 + this.currentPage = page;
  242 + /** 调用表格数据.*/
  243 + this.pageQueryArrearRecordByCondition();
  244 +
  245 + },
  246 + //多选
  247 + handleSelectionChange:function(val) {
  248 + this.multipleSelection = val;
  249 +
  250 + },
  251 + toBackSubmit:function(){
  252 + this.clearCode();
  253 + let selects = this.multipleSelection;
  254 + if(selects == null || selects.length < 1){
  255 + this.$message({
  256 + message: '请至少选择一行数据!',
  257 + type: 'warning'
  258 + });
  259 + return;
  260 + }
  261 + let orders = [];
  262 + let orgIds = [];
  263 + selects.forEach(item=>{
  264 + orders.push({orderId:item.orderId,parkId:item.plNo,orderNotPayFee:item.arrearageFee,sourceType:1});
  265 + orgIds.push(item.orgId);
  266 + });
  267 + if(orders == null || orders.length < 1){
  268 + this.$message({
  269 + message: '请至少选择一行数据!',
  270 + type: 'warning'
  271 + });
  272 + return;
  273 + }
  274 +
  275 + let req ={
  276 + sysCode:'10003',
  277 + payType:2,
  278 + paySrcType:103,
  279 + terminalSource:9,
  280 + carNumber:'京A11111',
  281 + recordArreaInfos:JSON.stringify(orders)
  282 + };
  283 + // req = JSON.stringify(req);
  284 + //调用后台接口获取二维码信息
  285 + personOrderBackWxPay(req).then(response =>{
  286 + if(response.code=='8888'){
  287 + let data = response.data;
  288 + data = JSON.parse(data);
  289 + let url = data.data.code_url;
  290 + console.log(url);
  291 + //this.url = url;
  292 + this.qrcode(url);
  293 + }else{
  294 + console.log(response);
  295 +
  296 + }
  297 +
  298 + });
  299 + this.dialogVisible = true;
  300 + },
  301 +
  302 + onSubmit:function() {
  303 + this.pageQueryArrearRecordByCondition();
  304 + },
  305 + onBack:function() {
  306 + this.dialogVisible = false;
  307 + this.pageQueryArrearRecordByCondition();
  308 + this.clearCode();
  309 + },
  310 + onCancel:function() {
  311 + this.$message({
  312 + message: 'cancel!',
  313 + type: 'warning'
  314 + })
  315 + }
  316 + }
  317 + }
  318 +</script>
  319 +
  320 +<style scoped>
  321 + .serch-wrap{
  322 + background-color: #FFF;
  323 + padding: 15px;
  324 + }
  325 +
  326 +</style>
  327 +
... ...
src/views/service.vue
  View file @5fcc135
1 1 <template>
2   - <div class="wrap">
3   - <div class="fl left">
4   - <span>车辆管理</span>
5   - </div>
6   - <ul class="fl right">
7   - <li>
8   - <span>我的钱包</span>
9   - </li>
10   - <li>
11   - <span>账户余额</span>
12   - </li>
13   - <li>
14   - <span>我的卡券</span>
15   - </li>
16   - <li>
17   - <span>停车订单</span>
18   - </li>
19   - <li>
20   - <span>欠费订单</span>
21   - </li>
22   - <li>
23   - <span>个人中心</span>
24   - </li>
25   - </ul>
  2 + <div >
  3 + <el-container style="min-height: 550px">
  4 + <!--<el-aside width="210px" style="background-color: rgb(84, 92, 100);">-->
  5 + <el-aside width="210px" style="background-color: rgb(84, 92, 100);">
  6 + <!--左侧菜单组件-->
  7 +
  8 + <el-menu
  9 + :default-active="isId"
  10 + class="el-menu-vertical-demo"
  11 + background-color="#545c64"
  12 + text-color="#fff"
  13 + active-text-color="#ffd04b"
  14 + @open="handleOpen"
  15 + @close="handleClose"
  16 + @select="handleSelect"
  17 + :default-openeds="openeds" unique-opened router>
  18 +
  19 + <NavMenu :navMenus="totalList"></NavMenu>
  20 + </el-menu>
  21 +
  22 + </el-aside>
  23 +
  24 +
  25 + <el-container>
  26 + <el-main class="app-container">
  27 + <router-view></router-view>
  28 + </el-main>
  29 + </el-container>
  30 + </el-container>
26 31 </div>
27 32 </template>
28 33  
29 34 <script>
30   -export default {
31   - name: 'service'
32   -}
33   -</script>
  35 + import config from '../components/config'
  36 + import NavMenu from '../components/NavMenu';
34 37  
35   -<style scoped lang="scss">
36   - .wrap {
37   - /*width: 1150px;*/
38   - margin: 46px auto 0;
39   - font-size: 20px;
40   - }
41   -
42   - .left {
43   - width: 212px;
44   - height: 443px;
45   - padding-top: 267px;
46   - background: rgba(255, 86, 86, 1) url("../assets/service/car.png") center 170px no-repeat;
47   - cursor: pointer;
48   - }
49   - .right{
50   - width: 710px;
51   - li{
52   - width:212px;
53   - height:212px;
54   - float: left;
55   - margin-left: 24px;
56   - margin-bottom: 19px;
57   - padding-top: 130px;
58   - background-position: center 60px;
59   - background-repeat: no-repeat;
60   - cursor: pointer;
61   - &:nth-of-type(1){
62   - background-color: #FFB537;
63   - background-image: url("../assets/service/money.png");
64   - }
65   - &:nth-of-type(2){
66   - background-color: #34C27B;
67   - background-image: url("../assets/service/balance.png");
68   - }
69   - &:nth-of-type(3){
70   - background-color: #FC7C9B;
71   - background-image: url("../assets/service/card.png");
72   - }
73   - &:nth-of-type(4){
74   - background-color: #44BAF3;
75   - background-image: url("../assets/service/manage.png");
  38 + export default {
  39 + name: 'service',
  40 + data(){
  41 + return {
  42 + tagsList: [],
  43 + collapse: false,
  44 + totalList:[],
  45 + isId:"first",
  46 + openeds:["first"],
76 47 }
77   - &:nth-of-type(5){
78   - background-color: #FD8D8D;
79   - background-image: url("../assets/service/order.png");
  48 + },
  49 + components:{
  50 + NavMenu
  51 + },
  52 + beforeRouteEnter (to, from, next) {
  53 + console.log("我从==哪里来",to)
  54 + var self = this
  55 +
  56 + next(vm=>{
  57 + console.log(to)
  58 + vm.isId = to.path.replace('/','');
  59 +
  60 + })
  61 +
  62 +
  63 + },
  64 + methods: {
  65 + handleSelect(key,keyPath){
  66 + console.log("=======",key,keyPath);
  67 + },
  68 + handleOpen(){
  69 +
  70 +
  71 + },
  72 + handleClose(){
  73 +
80 74 }
81   - &:nth-of-type(6){
82   - background-color: #89D8FD;
83   - background-image: url("../assets/service/person.png");
  75 + },
  76 + watch:{
  77 +
  78 + $route(to,from){
  79 +
  80 + this.isId = to.path.replace('/','');
84 81 }
85   - }
  82 + },
  83 + created(){
  84 + this.totalList = config.childs
  85 + },
86 86 }
  87 +</script>
  88 +<style scoped>
  89 +
87 90  
88 91 </style>
... ...
src/views/settings/index.vue 0 → 100644
  View file @5fcc135
  1 +<template>
  2 + <div>
  3 + <div class="search-wrap">
  4 + <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="80px">
  5 + <el-form-item label="手机号" class="margin-bottom30" prop="tell">
  6 + <el-input v-model="ruleForm.tell" style="width: 300px"></el-input>
  7 + </el-form-item>
  8 + <el-form-item label="账户" class="margin-bottom30" prop="username">
  9 + <el-input v-model="ruleForm.username" style="width: 300px"></el-input>
  10 + </el-form-item>
  11 + <el-form-item label="邮箱" class="margin-bottom30" prop="email">
  12 + <el-input v-model="ruleForm.email" style="width: 300px"></el-input>
  13 + </el-form-item>
  14 + <el-form-item label="密码" class="margin-bottom30" prop="pwd">
  15 + <el-input type="password" v-model="ruleForm.pwd" autocomplete="off" style="width: 300px"></el-input>
  16 + </el-form-item>
  17 + <el-form-item label="车牌号" class="margin-bottom30" prop="carnum">
  18 + <el-input v-model="ruleForm.carnum" style="width: 300px"></el-input>
  19 + </el-form-item>
  20 + <el-form-item label="用户级别" class="margin-bottom30" prop="level">
  21 + <el-input v-model="ruleForm.level" style="width: 300px" disabled></el-input>
  22 + </el-form-item>
  23 + <el-form-item label="注册时间" class="margin-bottom30" prop="starttime">
  24 + <el-input v-model="ruleForm.starttime" style="width: 300px" disabled></el-input>
  25 + </el-form-item>
  26 + <el-form-item>
  27 + <el-button type="primary" @click="submitForm('ruleForm')">提交</el-button>
  28 + <el-button @click="resetForm('ruleForm')">取消</el-button>
  29 + </el-form-item>
  30 + </el-form>
  31 + </div>
  32 + </div>
  33 +</template>
  34 +<script>
  35 + export default {
  36 + data() {
  37 + return {
  38 + ruleForm: {
  39 + tell: '15143323434',
  40 + username: '万八',
  41 + email: '15143323434@163.com',
  42 + pwd: '232342',
  43 + carnum: '京A32345',
  44 + starttime: '2019-08-17',
  45 + level: '普通'
  46 + },
  47 + rules: {
  48 + tell: [
  49 + { required: true, message: '请输入活动名称', trigger: 'blur' },
  50 + { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }
  51 + ],
  52 + username: [
  53 + { required: true, message: '请输入活动名称', trigger: 'blur' },
  54 + { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }
  55 + ],
  56 + email: [
  57 + { required: true, message: '请输入邮箱地址', trigger: 'blur' },
  58 + { type: 'email', message: '请输入正确的邮箱地址', trigger: ['blur', 'change'] }
  59 + ],
  60 + pwd: [
  61 + { required: true, message: '请输入活动名称', trigger: 'blur' },
  62 + { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }
  63 + ],
  64 + carnum: [
  65 + { required: true, message: '请输入活动名称', trigger: 'blur' },
  66 + { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }
  67 + ],
  68 +
  69 + }
  70 + }
  71 + },
  72 + methods: {
  73 + onSubmit() {
  74 + console.log('submit!');
  75 + },
  76 + submitForm(formName) {
  77 + this.$refs[formName].validate((valid) => {
  78 + if (valid) {
  79 + alert('submit!');
  80 + } else {
  81 + console.log('error submit!!');
  82 + return false;
  83 + }
  84 + });
  85 + },
  86 + resetForm(formName) {
  87 + this.$refs[formName].resetFields();
  88 + }
  89 + }
  90 + }
  91 +</script>
  92 +
  93 +<style lang="scss">
  94 + .search-wrap{
  95 + background-color: #FFF;
  96 + padding: 15px;
  97 + }
  98 + .card-second-top{
  99 + margin-top: 15px;
  100 + }
  101 + .el-card__header{
  102 + padding: 10px 20px;
  103 + }
  104 + .el-radio{
  105 + margin-right: 80px;
  106 + }
  107 + .el-radio.is-bordered+.el-radio.is-bordered{
  108 + margin-left: 0px;
  109 + margin-top: 15px;
  110 + }
  111 + .margin-bottom30{
  112 + margin-bottom: 30px;
  113 + }
  114 +</style>
... ...