BJ_web_developers / HSpark

Commit 840795adeb249ec5e71009cc71e472b85af82cdc

Authored by Andy
2 parents 2ab4a1be 16d971dd

Merge branch 'branch_dev' of http://gitlab.renniting.cn/web_developers/HSpark into branch_dev 

# Conflicts:
#	.env.development
Inline Side-by-side
Showing 25 changed files with 2360 additions and 728 deletions
.env.production
  View file @840795a
@@ -3,5 +3,5 @@ ENV = 'production' @@ -3,5 +3,5 @@ ENV = 'production'
3 3
4 # base api 4 # base api
5 #VUE_APP_BASE_API = '/prod-api' 5 #VUE_APP_BASE_API = '/prod-api'
6 -VUE_APP_BASE_API = '/prov-api' 6 +VUE_APP_BASE_API = 'http://test.renniting.cn/bcp/'
7 7
package.json
  View file @840795a
@@ -21,6 +21,7 @@ @@ -21,6 +21,7 @@
21 "normalize.css": "7.0.0", 21 "normalize.css": "7.0.0",
22 "nprogress": "^0.2.0", 22 "nprogress": "^0.2.0",
23 "path-to-regexp": "2.4.0", 23 "path-to-regexp": "2.4.0",
  24 + "qrcodejs2": "^0.0.2",
24 "vue": "2.6.10", 25 "vue": "2.6.10",
25 "vue-router": "3.0.6", 26 "vue-router": "3.0.6",
26 "vuex": "3.1.0" 27 "vuex": "3.1.0"
src/api/account.js 0 → 100644
  View file @840795a
  1 +import request from '@/utils/request'
  2 +
  3 +/**
  4 + * 获取车主账户
  5 + * @param param
  6 + */
  7 +export function getAcctPersonGroupByAcctType(param) {
  8 + return request({
  9 + url: '/personPc/acct/getAcctPersonGroupByAcctType',
  10 + method: 'post',
  11 + data:param
  12 + })
  13 +}
  14 +/**
  15 + * 分页查询车主支出详情
  16 + * @param param
  17 + */
  18 +export function queryAcctPayOutForPage(param) {
  19 + return request({
  20 + url: '/personPc/acct/queryAcctPayOutForPage',
  21 + method: 'post',
  22 + data:param
  23 + })
  24 +}
  25 +/**
  26 + * 分页查询车主收费端充值的收入详情"
  27 + * @param param
  28 + */
  29 +export function queryCustRechargeFeeStaticMsg(param) {
  30 + return request({
  31 + url: '/personPc/acct/queryCustRechargeFeeStaticMsg',
  32 + method: 'post',
  33 + data:param
  34 + })
  35 +}
src/api/cardticket.js 0 → 100644
  View file @840795a
  1 +import request from '@/utils/request'
  2 +
  3 +/**
  4 + * 车主查询自己的卡券信息
  5 + */
  6 +export function getCouponPerson() {
  7 + return request({
  8 + url: '/personCouponPc/getCouponPerson',
  9 + method: 'post'
  10 + })
  11 +}
src/api/index.js 0 → 100644
  View file @840795a
  1 +import request from '@/utils/request'
  2 +
  3 +/**
  4 + * 获取车主首页卡片信息
  5 + * @param param
  6 + */
  7 +export function getCustIndexBaseInfo(param) {
  8 + return request({
  9 + url: '/personPc/index/getCustIndexBaseInfo',
  10 + method: 'post',
  11 + data:param
  12 + })
  13 +}
  14 +/**
  15 + * 获取车主月支出
  16 + * @param param
  17 + */
  18 +export function queryOwnerPayOutByMonth(param) {
  19 + return request({
  20 + url: '/personPc/index/queryOwnerPayOutByMonth',
  21 + method: 'post',
  22 + data:param
  23 + })
  24 +}
  25 +/**
  26 + * 获取车主停车记录
  27 + * @param param
  28 + */
  29 +export function queryOwnerParkRecord(param) {
  30 + return request({
  31 + url: '/personPc/index/queryOwnerParkRecord',
  32 + method: 'post',
  33 + data:param
  34 + })
  35 +}
  36 +/**
  37 + * 分页查询车主欠费记录
  38 + * @param param
  39 + */
  40 +export function pageQueryArrearRecordByCondition(param) {
  41 + return request({
  42 + url: '/personPc/index/pageQueryArrearRecordByCondition',
  43 + method: 'post',
  44 + data:param
  45 + })
  46 +}
  47 +/**
  48 + * 补缴获取二维码
  49 + * @param param
  50 + */
  51 +export function personOrderBackWxPay(param) {
  52 + return request({
  53 + url: '/personPc/wxPay/personOrderBackWxPay',
  54 + method: 'post',
  55 + data:param
  56 + })
  57 +}
  58 +/**
  59 + * 获取所有组织下拉框
  60 + * @param param
  61 + */
  62 +export function selectAllAppOrg(param) {
  63 + return request({
  64 + url: '/personPc/index/selectAllAppOrg',
  65 + method: 'post',
  66 + data:param
  67 + })
  68 +}
src/api/mycar.js 0 → 100644
  View file @840795a
  1 +import request from '@/utils/request'
  2 +
  3 +/**
  4 + * 车主查询自己的车牌信息
  5 + */
  6 +export function getPersonCarNumPC() {
  7 + return request({
  8 + url: '/personCarNumPc/getPersonCarNumPC',
  9 + method: 'post'
  10 + })
  11 +}
  12 +
  13 +/**
  14 + * 绑定车牌
  15 + * @param params
  16 + */
  17 +export function boundCarNum(params) {
  18 + return request({
  19 + url: '/personCarNumPc/boundCarNum',
  20 + method: 'post',
  21 + params
  22 + })
  23 +}
  24 +
  25 +/**
  26 + * 解绑车牌
  27 + * @param params
  28 + */
  29 +export function unboundCarNum() {
  30 + return request({
  31 + url: '/personCarNumPc/unboundCarNum',
  32 + method: 'post'
  33 + })
  34 +}
  35 +
  36 +
src/api/mysuggest.js 0 → 100644
  View file @840795a
  1 +import request from '@/utils/request'
  2 +
  3 +
  4 +/**
  5 + * 分页查询-投诉建议
  6 + * @param params
  7 + */
  8 +export function queryFeedbackAndSuggestForPage(params){
  9 + return request({
  10 + url: '/personPc/suggest/queryFeedbackAndSuggestForPage',
  11 + method: 'post',
  12 + data:params
  13 + })
  14 +}
  15 +
  16 +
  17 +/**
  18 + * 问题类型
  19 + * @param params
  20 + */
  21 +export function getFeedbackType(params){
  22 + return request({
  23 + url: '/personPc/suggest/getFeedbackType',
  24 + method: 'post',
  25 + data:params
  26 + })
  27 +}
  28 +
  29 +
  30 +/**
  31 + * 问题类型
  32 + * @param params
  33 + */
  34 +export function saveFeedbackAndSuggest(params){
  35 + return request({
  36 + url: '/personPc/suggest/saveFeedbackAndSuggest',
  37 + method: 'post',
  38 + data:params
  39 + })
  40 +}
  41 +
  42 +
  43 +
  44 +
  45 +
  46 +
src/api/user.js
  View file @840795a
@@ -9,7 +9,6 @@ export function login(data) { @@ -9,7 +9,6 @@ export function login(data) {
9 } 9 }
10 10
11 export function getInfo(token) { 11 export function getInfo(token) {
12 - debugger  
13 return request({ 12 return request({
14 url: '/personPc/getUserInfo', 13 url: '/personPc/getUserInfo',
15 method: 'post', 14 method: 'post',
@@ -35,3 +34,25 @@ export function logout() { @@ -35,3 +34,25 @@ export function logout() {
35 method: 'post' 34 method: 'post'
36 }) 35 })
37 } 36 }
  37 +
  38 +export function uploadUserPic(file){
  39 + debugger
  40 + return request({
  41 + url: '/personPc/uploadUserPic',
  42 + method: 'post',
  43 + data:file
  44 + })
  45 +}
  46 +
  47 +/**
  48 + * 更新个人客户信息
  49 + * @param params
  50 + */
  51 +export function updatePersonByCustId(params){
  52 + return request({
  53 + url: '/personPc/updatePersonBycustId',
  54 + method: 'post',
  55 + data:params
  56 + })
  57 +}
  58 +
src/filters/index.js 0 → 100644
  View file @840795a
  1 +// import parseTime, formatTime and set to filter
  2 +export { parseTime, formatTime } from '@/utils'
  3 +let moment = require("moment");
  4 +/**
  5 + * Show plural label if time is plural number
  6 + * @param {number} time
  7 + * @param {string} label
  8 + * @return {string}
  9 + */
  10 +function pluralize(time, label) {
  11 + if (time === 1) {
  12 + return time + label
  13 + }
  14 + return time + label + 's'
  15 +}
  16 +
  17 +/**
  18 + * @param {number} time
  19 + */
  20 +export function timeAgo(time) {
  21 + const between = Date.now() / 1000 - Number(time)
  22 + if (between < 3600) {
  23 + return pluralize(~~(between / 60), ' minute')
  24 + } else if (between < 86400) {
  25 + return pluralize(~~(between / 3600), ' hour')
  26 + } else {
  27 + return pluralize(~~(between / 86400), ' day')
  28 + }
  29 +}
  30 +
  31 +/**
  32 + * Number formatting
  33 + * like 10000 => 10k
  34 + * @param {number} num
  35 + * @param {number} digits
  36 + */
  37 +export function numberFormatter(num, digits) {
  38 + const si = [
  39 + { value: 1E18, symbol: 'E' },
  40 + { value: 1E15, symbol: 'P' },
  41 + { value: 1E12, symbol: 'T' },
  42 + { value: 1E9, symbol: 'G' },
  43 + { value: 1E6, symbol: 'M' },
  44 + { value: 1E3, symbol: 'k' }
  45 + ]
  46 + for (let i = 0; i < si.length; i++) {
  47 + if (num >= si[i].value) {
  48 + return (num / si[i].value + 0.1).toFixed(digits).replace(/\.0+$|(\.[0-9]*[1-9])0+$/, '$1') + si[i].symbol
  49 + }
  50 + }
  51 + return num.toString()
  52 +}
  53 +
  54 +/**
  55 + * 10000 => "10,000"
  56 + * @param {number} num
  57 + */
  58 +export function toThousandFilter(num) {
  59 + return (+num || 0).toString().replace(/^-?\d+/g, m => m.replace(/(?=(?!\b)(\d{3})+$)/g, ','))
  60 +}
  61 +
  62 +/**
  63 + * 分转元
  64 + * @param {number} num
  65 + */
  66 +export function fen2Yuan(num) {
  67 + if(num == undefined || num == null){
  68 + return 0;
  69 + }
  70 + num = num / 100;
  71 + return (+num || 0).toString().replace(/^-?\d+/g, m => m.replace(/(?=(?!\b)(\d{3})+$)/g, ','))
  72 +}
  73 +
  74 +/**
  75 + * Upper case first char
  76 + * @param {String} string
  77 + */
  78 +export function uppercaseFirst(string) {
  79 + return string.charAt(0).toUpperCase() + string.slice(1)
  80 +}
  81 +
  82 +/**
  83 + * 将制定格式的时间字符串转换成long
  84 + * <li>0-yyyyMMdd</li>
  85 + * <li>1-yyyy-MM-dd</li>
  86 + * <li>2-HHmmss</li>
  87 + * <li>3-HH:mm:ss</li>
  88 + * <li>4-HHmmssSSS</li>
  89 + * <li>5-HH:mm:ss.SSS</li>
  90 + * <li>6-yyyyMMddHHmmss</li>
  91 + * <li>7-yyyy-MM-dd HH:mm:ss</li>
  92 + * <li>8-yyyyMMddHHmmssSSS</li>
  93 + * <li>9-yyyy-MM-dd HH:mm:ss.SSS</li>
  94 + * <li>10-yyyy/MM/dd HH:mm</li>
  95 + * <li>11-yyyy/MM/dd HH:mm:ss</li>
  96 + * </ul>
  97 + */
  98 +export function string2Long(str, format) {
  99 + if (str == null || str == "") {
  100 + return "";
  101 + }
  102 + return date2Long(string2Date(str, format));
  103 +}
  104 +
  105 +export function date2Long (date) {
  106 + return date.getTime();
  107 +}
  108 +
  109 +/**
  110 + * 将字符串转化为相应时间
  111 + *
  112 + * @param {}
  113 + * dateStr 时间字符串
  114 + * @param {}
  115 + * formatType 指定格式:
  116 + * <ul>
  117 + * <li>0-yyyyMMdd</li>
  118 + * <li>1-yyyy-MM-dd</li>
  119 + * <li>2-HHmmss</li>
  120 + * <li>3-HH:mm:ss</li>
  121 + * <li>4-HHmmssSSS</li>
  122 + * <li>5-HH:mm:ss.SSS</li>
  123 + * <li>6-yyyyMMddHHmmss</li>
  124 + * <li>7-yyyy-MM-dd HH:mm:ss</li>
  125 + * <li>8-yyyyMMddHHmmssSSS</li>
  126 + * <li>9-yyyy-MM-dd HH:mm:ss.SSS</li>
  127 + * <li>10-yyyy/MM/dd HH:mm</li>
  128 + * <li>11-yyyy/MM/dd HH:mm:ss</li>
  129 +
  130 + * </ul>
  131 + * @return 解析后的Date对象
  132 + */
  133 +export function string2Date(date,formatType) {
  134 + if(date == null || date == undefined){
  135 + return "";
  136 + }
  137 + let dateTime;
  138 + switch (formatType) {
  139 + case 0 :
  140 + dateTime= moment(date).format("YYYYMMDD");
  141 + break;
  142 + case 1 :
  143 + dateTime= moment(date).format("YYYY-MM-DD");
  144 + break;
  145 + case 2 :
  146 + dateTime= moment(date).format("HHmmss");
  147 + break;
  148 + case 3 :
  149 + dateTime= moment(date).format("HH:mm:ss");
  150 + break;
  151 + case 4 :
  152 + dateTime= moment(date).format("HHmmssSSS");
  153 + break;
  154 + case 5 :
  155 + dateTime= moment(date).format("HH:mm:ss.SSS");
  156 + break;
  157 + case 6 :
  158 + dateTime= moment(date).format("YYYY-MM-DDHHmmss");
  159 + break;
  160 + case 7 :
  161 + dateTime= moment(date).format("YYYY-MM-DD HH:mm:ss");
  162 +
  163 + break;
  164 + case 8 :
  165 + dateTime= moment(date).format("yyyyMMddHHmmssSSS");
  166 + break;
  167 + case 9 :
  168 + dateTime= moment(date).format("yyyy-MM-dd HH:mm:ss.SSS");
  169 + break;
  170 + case 10 ://yyyy/MM/dd HH:mm
  171 + dateTime= moment(date).format("yyyy/MM/dd HH:mm");
  172 + break;
  173 + case 11 ://yyyy/MM/dd HH:mm:ss
  174 + dateTime= moment(date).format("yyyy/MM/dd HH:mm:ss");
  175 + break;
  176 + }
  177 + return dateTime;
  178 +}
  179 +
  180 +/**类型转换*/
  181 +export function busTypeFomatter(value){
  182 + //业务类型: 1:收入 2:退款 3:支出
  183 + if(value == 1){
  184 + return '交易';
  185 + }else if(value == 2){
  186 + return '退款';
  187 + }else if(value == 3){
  188 + return '支出';
  189 + }else{
  190 + return '未知';
  191 + }
  192 +};
  193 +export function payTypeFomatter(value){
  194 + //业务类型: 1:收入 2:退款 3:支出
  195 + if(value == 1){
  196 + return '支付宝';
  197 + }else if(value == 2){
  198 + return '微信';
  199 + }else if(value == 3){
  200 + return '银联';
  201 + }else if(value == 4){
  202 + return '服务号';
  203 + }else{
  204 + return '未知';
  205 + }
  206 +};
  207 +export function payOrderTypeFomatter(row,value){
  208 + //101:停车付款单,102：停车预付单，103:停车补缴单，104:共享车位；201：余额充值单,202：押金充值；301：会员卡购买单，302：会员卡续费
  209 + if(value == 101){
  210 + return '交易-临停支付';
  211 + }else if(value == 102){
  212 + return '交易-停车预付';
  213 + }else if(value == 103){
  214 + return '交易-停车补缴';
  215 + }else if(value == 104){
  216 + return '交易-共享车位预定';
  217 + }else if(value == 201){
  218 + if(row.terminalSource!='' ||row.terminalSource!=null ||row.terminalSource!=undefined||row.terminalSource!='null'){
  219 + if(row.terminalSource == 1){
  220 + return '交易-余额充值';
  221 + } else if(row.terminalSource == 2){
  222 + return '交易-收费员充值';
  223 + }else {
  224 + return '交易-余额充值';
  225 + }
  226 + }
  227 + else{
  228 + return '交易-余额充值';
  229 + }
  230 +
  231 + }else if(value == 202){
  232 + return '交易-押金充值';
  233 + }else if(value == 301){
  234 + return '交易-会员卡购买';
  235 + }else if(value == 302){
  236 + return '交易-会员卡续费';
  237 + }else{
  238 + return '未知';
  239 + }
  240 +};
  241 +
  242 +/**
  243 + * 订单状态
  244 + * @param row
  245 + * @param value
  246 + * @returns {string}
  247 + */
  248 +export function inOutStateFormatter(row, value) {
  249 +
  250 + let orderState = row.orderState;
  251 + //停车状态 10:在场 ,20:离场，30:预订
  252 + let parkState = row.parkState;
  253 + if (null == parkState) {
  254 + if (null != row.parkOutTime) {
  255 + parkState = 20;
  256 + } else {
  257 + parkState = 10;
  258 + }
  259 + }
  260 +
  261 + if (parkState == 10) {
  262 + return "在场";
  263 + }
  264 +
  265 + if (parkState == 20) {
  266 +
  267 + if (orderState == 52) {
  268 + return "欠费";
  269 + }else if (orderState == 53) {
  270 + return "欠费已补缴";
  271 + } else {
  272 + return "离场";
  273 + }
  274 + }
  275 +};
  276 +
  277 +/**
  278 + * 停车时长
  279 + * @param row
  280 + * @param value
  281 + * @returns {*}
  282 + */
  283 +export function parkingDurationFormatter (row, value) {
  284 + //
  285 + let parkState = row.parkState;
  286 + if (null == parkState) {
  287 + if (null != row.parkOutTime) {
  288 + parkState = 20;
  289 + } else {
  290 + parkState = 10;
  291 + }
  292 + }
  293 +
  294 + let inTime = row.parkInTime;
  295 + if (parkState == 10) {
  296 + let thisTime = new Date().getTime();
  297 + let parkDuration = (thisTime - inTime) / 1000;
  298 + return formatSeconds(parkDuration);
  299 + }
  300 +
  301 +
  302 + if (value == null) {
  303 + return "";
  304 + } else {
  305 + return formatSeconds(value);
  306 + }
  307 +};
  308 +function formatSeconds(value) {
  309 + let theTime = parseInt(value);// 秒
  310 + let theTime1 = 0;// 分
  311 + let theTime2 = 0;// 小时
  312 + let theTime3 = 0;//天
  313 + if (theTime < 60) {
  314 + return theTime + '秒';
  315 + }
  316 + if (theTime > 60) {
  317 + theTime1 = parseInt(theTime / 60);
  318 + theTime = parseInt(theTime % 60);
  319 +
  320 +
  321 + }
  322 +
  323 + if (theTime1 > 60) {
  324 + theTime2 = parseInt(theTime1 / 60);
  325 + theTime1 = parseInt(theTime1 % 60);
  326 + }
  327 +
  328 + if (theTime2 > 24) {
  329 + theTime3 = parseInt(theTime2 / 24);
  330 + theTime2 = parseInt(theTime2 % 24);
  331 + }
  332 +
  333 + let result = '';
  334 + if (theTime1 == 0 && theTime2 == 0 && theTime3 == 0) {
  335 + result = parseInt(theTime) + "秒"
  336 + }
  337 +
  338 + if (theTime1 > 0) {
  339 + result = "" + parseInt(theTime1) + "分钟" + result;
  340 + }
  341 + if (theTime2 > 0) {
  342 + result = "" + parseInt(theTime2) + "小时" + result;
  343 + }
  344 +
  345 + if (theTime3 > 0) {
  346 + result = "" + parseInt(theTime3) + "天" + result;
  347 + }
  348 + return result;
  349 +};
src/main.js
  View file @840795a
@@ -11,6 +11,7 @@ import &#39;@/styles/index.scss&#39; // global css @@ -11,6 +11,7 @@ import &#39;@/styles/index.scss&#39; // global css
11 import App from './App' 11 import App from './App'
12 import store from './store' 12 import store from './store'
13 import router from './router' 13 import router from './router'
  14 +import * as filters from './filters' // global filters
14 15
15 import '@/icons' // icon 16 import '@/icons' // icon
16 import '@/permission' // permission control 17 import '@/permission' // permission control
@@ -28,6 +29,10 @@ import &#39;@/permission&#39; // permission control @@ -28,6 +29,10 @@ import &#39;@/permission&#39; // permission control
28 // mockXHR() 29 // mockXHR()
29 // } 30 // }
30 31
  32 +// register global utility filters
  33 +Object.keys(filters).forEach(key => {
  34 + Vue.filter(key, filters[key])
  35 +})
31 // set ElementUI lang to EN 36 // set ElementUI lang to EN
32 Vue.use(ElementUI, { locale }) 37 Vue.use(ElementUI, { locale })
33 38
src/router/index.js
  View file @840795a
@@ -123,11 +123,6 @@ export const constantRoutes = [ @@ -123,11 +123,6 @@ export const constantRoutes = [
123 meta: { title: '个人资料' } 123 meta: { title: '个人资料' }
124 }, 124 },
125 { 125 {
126 - path: 'settings',  
127 - component: () => import('@/views/settings/index'),  
128 - meta: { title: '账户设置' },  
129 - },  
130 - {  
131 path: 'myevaluate', 126 path: 'myevaluate',
132 component: () => import('@/views/myevaluate/index'), 127 component: () => import('@/views/myevaluate/index'),
133 meta: { title: '我的评价' } 128 meta: { title: '我的评价' }
src/store/modules/user.js
  View file @840795a
@@ -32,7 +32,6 @@ const actions = { @@ -32,7 +32,6 @@ const actions = {
32 return new Promise((resolve, reject) => { 32 return new Promise((resolve, reject) => {
33 login({ userPhone: phone.trim(), validatorCode: password }).then(response => { 33 login({ userPhone: phone.trim(), validatorCode: password }).then(response => {
34 const { data } = response 34 const { data } = response
35 - debugger;  
36 commit('SET_TOKEN', data.token) 35 commit('SET_TOKEN', data.token)
37 setToken(data.token) 36 setToken(data.token)
38 resolve() 37 resolve()
@@ -45,14 +44,11 @@ const actions = { @@ -45,14 +44,11 @@ const actions = {
45 // get user info 44 // get user info
46 getInfo({ commit, state }) { 45 getInfo({ commit, state }) {
47 return new Promise((resolve, reject) => { 46 return new Promise((resolve, reject) => {
48 - debugger  
49 getInfo(state.token).then(response => { 47 getInfo(state.token).then(response => {
50 const { data } = response 48 const { data } = response
51 -  
52 if (!data) { 49 if (!data) {
53 reject('Verification failed, please Login again.') 50 reject('Verification failed, please Login again.')
54 } 51 }
55 -  
56 const { custName, headPicUrl } = data 52 const { custName, headPicUrl } = data
57 53
58 commit('SET_NAME', custName) 54 commit('SET_NAME', custName)
src/utils/DateUtils.js 0 → 100755
  View file @840795a
  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/request.js
  View file @840795a
@@ -58,7 +58,6 @@ service.interceptors.response.use( @@ -58,7 +58,6 @@ service.interceptors.response.use(
58 } 58 }
59 }, 59 },
60 error => { 60 error => {
61 - debugger  
62 console.log('err' + error) // for debug 61 console.log('err' + error) // for debug
63 Message({ 62 Message({
64 message: error.message, 63 message: error.message,
src/utils/utils.js 0 → 100644
  View file @840795a
  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/views/account/index.vue
  View file @840795a
@@ -10,7 +10,7 @@ @@ -10,7 +10,7 @@
10 </el-col> 10 </el-col>
11 <el-col :span="12" :offset="4"> 11 <el-col :span="12" :offset="4">
12 <el-row :gutter="16"><el-col :span="24">充值账户(元)</el-col></el-row> 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">240.0</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> 14 </el-col>
15 </el-row> 15 </el-row>
16 </el-card> 16 </el-card>
@@ -23,7 +23,7 @@ @@ -23,7 +23,7 @@
23 </el-col> 23 </el-col>
24 <el-col :span="12" :offset="4"> 24 <el-col :span="12" :offset="4">
25 <el-row :gutter="16"><el-col :span="24">赠送账户(元)</el-col></el-row> 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">140.0</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> 27 </el-col>
28 </el-row> 28 </el-row>
29 </el-card> 29 </el-card>
@@ -34,70 +34,114 @@ @@ -34,70 +34,114 @@
34 <el-tabs :tab-position="tabPosition" > 34 <el-tabs :tab-position="tabPosition" >
35 <el-tab-pane label="充值记录"> 35 <el-tab-pane label="充值记录">
36 <el-table 36 <el-table
37 - :data="paytableData" 37 + :data="rechargeTableData"
38 style="width: 100%;" 38 style="width: 100%;"
39 :show-overflow-tooltip="true"> 39 :show-overflow-tooltip="true">
40 <el-table-column 40 <el-table-column
41 - prop="parkName" 41 + prop="acctType"
42 label="账户类型" 42 label="账户类型"
43 :show-overflow-tooltip="true"> 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>
44 </el-table-column> 48 </el-table-column>
45 <el-table-column 49 <el-table-column
46 - prop="license" 50 + prop="rechargeFee"
47 label="充值金额" 51 label="充值金额"
48 :show-overflow-tooltip="true"> 52 :show-overflow-tooltip="true">
  53 + <template slot-scope="scope">
  54 + <span>{{(scope.row.rechargeFee) |fen2Yuan}} </span>
  55 + </template>
49 </el-table-column> 56 </el-table-column>
50 <el-table-column 57 <el-table-column
51 - prop="money" 58 + prop="rechargeBalance"
52 label="充值后余额"> 59 label="充值后余额">
  60 + <template slot-scope="scope">
  61 + <span>{{(scope.row.rechargeBalance) |fen2Yuan}} </span>
  62 + </template>
53 </el-table-column> 63 </el-table-column>
54 <el-table-column 64 <el-table-column
55 - prop="inTime" 65 + prop="rechargeTime"
56 label="充值时间" 66 label="充值时间"
57 :show-overflow-tooltip="true"> 67 :show-overflow-tooltip="true">
  68 + <template slot-scope="scope">
  69 + <span>{{(scope.row.rechargeTime) |string2Date(7)}} </span>
  70 + </template>
58 </el-table-column> 71 </el-table-column>
59 </el-table> 72 </el-table>
60 <el-pagination 73 <el-pagination
61 :page-size="10" 74 :page-size="10"
62 :pager-count="11" 75 :pager-count="11"
63 layout="prev, pager, next" 76 layout="prev, pager, next"
64 - :total="total"> 77 + :total="total"
  78 + @size-change="handleSizeChange"
  79 + @current-change="handleSizeChange"
  80 + @prev-click="handleSizeChange"
  81 + @next-click="handleSizeChange">
65 </el-pagination> 82 </el-pagination>
66 </el-tab-pane> 83 </el-tab-pane>
67 <el-tab-pane label="支出记录"> 84 <el-tab-pane label="支出记录">
68 <el-table 85 <el-table
69 - :data="outtableData" 86 + :data="payOutTableData"
70 style="width: 100%;" 87 style="width: 100%;"
71 :show-overflow-tooltip="true"> 88 :show-overflow-tooltip="true">
72 <el-table-column 89 <el-table-column
73 - prop="parkName" 90 + prop="acctType"
74 label="账户类型" 91 label="账户类型"
75 :show-overflow-tooltip="true"> 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>
76 </el-table-column> 97 </el-table-column>
77 <el-table-column 98 <el-table-column
78 - prop="license" 99 + prop="tradeFee"
79 label="交易金额" 100 label="交易金额"
80 :show-overflow-tooltip="true"> 101 :show-overflow-tooltip="true">
  102 + <template slot-scope="scope">
  103 + <span>{{(scope.row.tradeFee) |fen2Yuan}} </span>
  104 + </template>
81 </el-table-column> 105 </el-table-column>
82 <el-table-column 106 <el-table-column
83 - prop="money" 107 + prop="tradeBalance"
84 label="交易后余额"> 108 label="交易后余额">
  109 + <template slot-scope="scope">
  110 + <span>{{(scope.row.tradeBalance) |fen2Yuan}} </span>
  111 + </template>
85 </el-table-column> 112 </el-table-column>
86 <el-table-column 113 <el-table-column
87 - prop="outtype" 114 + prop="tradeDetialType"
88 label="交易类型"> 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>
89 </el-table-column> 126 </el-table-column>
90 <el-table-column 127 <el-table-column
91 - prop="inTime" 128 + prop="tradeTime"
92 label="交易时间" 129 label="交易时间"
93 :show-overflow-tooltip="true"> 130 :show-overflow-tooltip="true">
  131 + <template slot-scope="scope">
  132 + <span>{{(scope.row.tradeTime) |string2Date(7)}} </span>
  133 + </template>
94 </el-table-column> 134 </el-table-column>
95 </el-table> 135 </el-table>
96 <el-pagination 136 <el-pagination
97 :page-size="10" 137 :page-size="10"
98 :pager-count="21" 138 :pager-count="21"
99 layout="prev, pager, next" 139 layout="prev, pager, next"
100 - :total="total"> 140 + :total="total2"
  141 + @size-change="handleSizeChange2"
  142 + @current-change="handleSizeChange2"
  143 + @prev-click="handleSizeChange2"
  144 + @next-click="handleSizeChange2">
101 </el-pagination> 145 </el-pagination>
102 </el-tab-pane> 146 </el-tab-pane>
103 </el-tabs> 147 </el-tabs>
@@ -111,7 +155,8 @@ @@ -111,7 +155,8 @@
111 import pagination from '@/components/Pagination/index.vue'; 155 import pagination from '@/components/Pagination/index.vue';
112 import LoadingBar from 'nprogress' // progress bar 156 import LoadingBar from 'nprogress' // progress bar
113 import 'nprogress/nprogress.css' // progress bar style 157 import 'nprogress/nprogress.css' // progress bar style
114 - 158 +import {getAcctPersonGroupByAcctType,queryCustRechargeFeeStaticMsg,queryAcctPayOutForPage} from '@/api/account';
  159 +import {fen2Yuan,string2Date} from '@/filters/index';
115 export default { 160 export default {
116 components:{ 161 components:{
117 'i-pagination': pagination 162 'i-pagination': pagination
@@ -121,101 +166,140 @@ export default { @@ -121,101 +166,140 @@ export default {
121 }, 166 },
122 data() { 167 data() {
123 return { 168 return {
  169 + rechargeBalance:0,
  170 + presentBalance:0,
124 list: null, 171 list: null,
125 tabPosition:'top', 172 tabPosition:'top',
126 listLoading: true, 173 listLoading: true,
127 btnLoading:false, 174 btnLoading:false,
128 loading:false, 175 loading:false,
129 - paytableData: [  
130 - {  
131 - parkName: '个人账户',  
132 - license: '21',  
133 - money: '31',  
134 - inTime: '2019-06-02 09:00:00',  
135 - },  
136 - {  
137 - parkName: '个人账户',  
138 - license: '10',  
139 - money: '31',  
140 - inTime: '2019-06-02 00:23:00',  
141 - },  
142 - {  
143 - parkName: '个人账户',  
144 - license: '21',  
145 - money: '31',  
146 - inTime: '2019-06-02 09:00:00',  
147 - },  
148 - {  
149 - parkName: '个人账户',  
150 - license: '10',  
151 - money: '31',  
152 - inTime: '2019-06-02 00:23:00',  
153 - },{  
154 - parkName: '个人账户',  
155 - license: '10',  
156 - money: '31',  
157 - inTime: '2019-06-02 00:23:00',  
158 - }, 176 + rechargeTableData: [
159 ], 177 ],
160 - outtableData: [  
161 - {  
162 - parkName: '个人账户',  
163 - license: '21',  
164 - money: '31',  
165 - outtype: '停车支付',  
166 - inTime: '2019-06-02 09:00:00',  
167 - },  
168 - {  
169 - parkName: '个人账户',  
170 - license: '10',  
171 - money: '31',  
172 - outtype: '停车支付',  
173 - inTime: '2019-06-02 00:23:00',  
174 - },  
175 - {  
176 - parkName: '个人账户',  
177 - license: '21',  
178 - money: '31',  
179 - outtype: '停车支付',  
180 - inTime: '2019-06-02 09:00:00',  
181 - },  
182 - {  
183 - parkName: '个人账户',  
184 - license: '10',  
185 - money: '31',  
186 - outtype: '停车支付',  
187 - inTime: '2019-06-02 00:23:00',  
188 - }, 178 + payOutTableData: [
189 ], 179 ],
190 /** 分页*/ 180 /** 分页*/
191 - total: 32, 181 + total: 0,
192 currentPage: 1, 182 currentPage: 1,
193 pageSize: 10, 183 pageSize: 10,
  184 + total2: 0,
  185 + currentPage2: 1,
  186 + pageSize2: 10,
194 } 187 }
195 }, 188 },
196 - computed: { 189 + mounted: function() {
  190 + this.getAcctPersonGroupByAcctType();
  191 + this.queryCustRechargeFeeStaticMsg();
  192 + this.queryAcctPayOutForPage();
197 }, 193 },
198 - created() {  
199 194
200 - },  
201 - mounted:function () {  
202 - },  
203 methods: { 195 methods: {
204 - queryBtn:function () {  
205 - LoadingBar.start();  
206 - this.btnLoading=true;  
207 - this.loading = true; 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 + }
208 239
  240 + });
209 }, 241 },
210 - /**获取子组件页码方法*/  
211 - handleSizeChange: function(pages) {  
212 - this.currentPage = pages.page;  
213 - this.pageSize = pages.limit; 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;
214 /** 调用表格数据.*/ 286 /** 调用表格数据.*/
215 - this.queryBtn(); 287 + this.queryCustRechargeFeeStaticMsg();
  288 +
216 }, 289 },
  290 + // 获取子组件页码方法
  291 + handleSizeChange2: function(page) {
  292 + console.log(page)
  293 + this.currentPage2 = page;
  294 + /** 调用表格数据.*/
  295 + this.queryAcctPayOutForPage();
  296 +
  297 + },
  298 +
  299 + },
  300 +
  301 +
217 302
218 - }  
219 } 303 }
220 </script> 304 </script>
221 <style lang="scss" scoped > 305 <style lang="scss" scoped >
src/views/cardticket/index.vue
  View file @840795a
@@ -5,17 +5,18 @@ @@ -5,17 +5,18 @@
5 <el-row :gutter="16" class=""> 5 <el-row :gutter="16" class="">
6 <el-col :span="6" v-for="(ticket,id) in ticketList" :key="id" class="margin-bottom16"> 6 <el-col :span="6" v-for="(ticket,id) in ticketList" :key="id" class="margin-bottom16">
7 <el-card class="box-card"> 7 <el-card class="box-card">
8 - <div class="ticket-title boxshadow-4 " :class="ticket.ptype == 1 ?'eff-bgcolor': 'off-bgcolor'">  
9 - <div class=" float-left" :class="ticket.ptype == 1 ?'eff-icon': 'off-icon'"></div>  
10 - <div class="ticket-name hs-hidden-nowrap hs-cursor-pointer float-left" >{{ticket.plname}}</div>  
11 - <div class="ticket-oper float-right">{{ticket.pname}}</div> 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> 12 </div>
13 <div class="ticket-content"> 13 <div class="ticket-content">
14 - <div class="ticket-main clearfix">  
15 - <div class=" hs-hidden-nowrap hs-cursor-pointer float-left" :class="ticket.ptype == 1 ?'ticket-effmoney': 'ticket-offmoney'">{{ticket.pmoney}}</div> 14 + <div class="ticket-main clearfix" >
  15 + <div class=" hs-hidden-nowrap hs-cursor-pointer float-left ticket-effmoney" >{{ticket.fullCutValue | fen2Yuan}}</div>
  16 +
16 <div class="ticket-notes float-left">元 优惠券</div> 17 <div class="ticket-notes float-left">元 优惠券</div>
17 </div> 18 </div>
18 - <div class="ticket-time">有效时间:{{ticket.ptime}}</div> 19 + <div class="ticket-time">有效时间:{{ticket.endTime | string2Date(1)}}</div>
19 </div> 20 </div>
20 </el-card> 21 </el-card>
21 </el-col> 22 </el-col>
@@ -24,82 +25,34 @@ @@ -24,82 +25,34 @@
24 </template> 25 </template>
25 26
26 <script> 27 <script>
  28 + import {getCouponPerson} from '@/api/cardticket.js';
27 export default { 29 export default {
28 -  
29 data() { 30 data() {
30 return { 31 return {
31 ticketList:[ 32 ticketList:[
32 - { 33 + /*{
33 id:'123', 34 id:'123',
34 ptype:'1', 35 ptype:'1',
35 plname:'静雅地上停车场', 36 plname:'静雅地上停车场',
36 pname:'有效', 37 pname:'有效',
37 pmoney:'50', 38 pmoney:'50',
38 ptime:'2019/8/30', 39 ptime:'2019/8/30',
39 - },  
40 - {  
41 - id:'123',  
42 - ptype:'2',  
43 - plname:'静雅地上停车场',  
44 - pname:'无效',  
45 - pmoney:'50',  
46 - ptime:'2019/8/30',  
47 - },  
48 - {  
49 - id:'123',  
50 - ptype:'2',  
51 - plname:'静雅地上停车场',  
52 - pname:'无效',  
53 - pmoney:'50',  
54 - ptime:'2019/8/30',  
55 - },  
56 - {  
57 - id:'123',  
58 - ptype:'1',  
59 - plname:'静雅地上停车场',  
60 - pname:'有效',  
61 - pmoney:'50',  
62 - ptime:'2019/8/30',  
63 - },  
64 - {  
65 - id:'123',  
66 - ptype:'1',  
67 - plname:'静雅地上停车场',  
68 - pname:'有效',  
69 - pmoney:'50',  
70 - ptime:'2019/8/30',  
71 - },  
72 - {  
73 - id:'123',  
74 - ptype:'2',  
75 - plname:'静雅地上停车场',  
76 - pname:'无效',  
77 - pmoney:'50',  
78 - ptime:'2019/8/30',  
79 - },  
80 - {  
81 - id:'123',  
82 - ptype:'2',  
83 - plname:'静雅地上停车场',  
84 - pname:'无效',  
85 - pmoney:'50',  
86 - ptime:'2019/8/30',  
87 - },  
88 - {  
89 - id:'123',  
90 - ptype:'1',  
91 - plname:'静雅地上停车场',  
92 - pname:'有效',  
93 - pmoney:'50',  
94 - ptime:'2019/8/30',  
95 - }, 40 + }*/
96 ] 41 ]
97 } 42 }
98 }, 43 },
99 -  
100 -  
101 methods: { 44 methods: {
102 - 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();
103 } 56 }
104 } 57 }
105 </script> 58 </script>
src/views/dashboard/index.vue
  View file @840795a
@@ -8,10 +8,10 @@ @@ -8,10 +8,10 @@
8 </div> 8 </div>
9 <div class="card-panel-description"> 9 <div class="card-panel-description">
10 <div class="card-panel-text"> 10 <div class="card-panel-text">
11 - 本月订单： 21 11 + 本月订单： {{cardData.monthOrderNum}}
12 </div> 12 </div>
13 <div class="card-panel-text"> 13 <div class="card-panel-text">
14 - 订单总量： 1231 14 + 订单总量： {{cardData.totalOrderNum}}
15 </div> 15 </div>
16 </div> 16 </div>
17 </div> 17 </div>
@@ -23,10 +23,10 @@ @@ -23,10 +23,10 @@
23 </div> 23 </div>
24 <div class="card-panel-description"> 24 <div class="card-panel-description">
25 <div class="card-panel-text"> 25 <div class="card-panel-text">
26 - 可用卡券： 101 26 + 可用卡券： {{cardData.validCouponNum}}
27 </div> 27 </div>
28 <div class="card-panel-text"> 28 <div class="card-panel-text">
29 - 卡券总量： 332 29 + 卡券总量： {{cardData.totalCouponNum}}
30 </div> 30 </div>
31 </div> 31 </div>
32 </div> 32 </div>
@@ -38,10 +38,10 @@ @@ -38,10 +38,10 @@
38 </div> 38 </div>
39 <div class="card-panel-description"> 39 <div class="card-panel-description">
40 <div class="card-panel-text"> 40 <div class="card-panel-text">
41 - 可用积分： 21 41 + 可用积分： {{cardData.validScore}}
42 </div> 42 </div>
43 <div class="card-panel-text"> 43 <div class="card-panel-text">
44 - 全部积分： 231 44 + 全部积分： {{cardData.totalScore}}
45 </div> 45 </div>
46 </div> 46 </div>
47 </div> 47 </div>
@@ -109,164 +109,243 @@ @@ -109,164 +109,243 @@
109 </div> 109 </div>
110 110
111 <div class="table-wrap"> 111 <div class="table-wrap">
112 - <p class="table-title">最新订单</p> 112 + <p class="table-title">最新订单(近三个月)</p>
113 <el-table 113 <el-table
114 :data="orderData" 114 :data="orderData"
115 style="width: 100%;" 115 style="width: 100%;"
116 :show-overflow-tooltip="true"> 116 :show-overflow-tooltip="true">
117 <el-table-column 117 <el-table-column
118 - prop="parkName" 118 + prop="plName"
119 label="停车场" 119 label="停车场"
120 :show-overflow-tooltip="true"> 120 :show-overflow-tooltip="true">
121 </el-table-column> 121 </el-table-column>
122 <el-table-column 122 <el-table-column
123 - prop="license" 123 + prop="carNumber"
124 label="车牌" 124 label="车牌"
125 :show-overflow-tooltip="true"> 125 :show-overflow-tooltip="true">
126 </el-table-column> 126 </el-table-column>
127 <el-table-column 127 <el-table-column
128 - prop="money"  
129 - label="停车费"> 128 + prop="orderTotalFee"
  129 + label="应收费用">
  130 + <template slot-scope="scope">
  131 + <span>{{(scope.row.orderTotalFee) |fen2Yuan}} </span>
  132 + </template>
130 </el-table-column> 133 </el-table-column>
131 <el-table-column 134 <el-table-column
132 - prop="inTime" 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"
133 label="入场时间" 143 label="入场时间"
134 :show-overflow-tooltip="true"> 144 :show-overflow-tooltip="true">
  145 + <template slot-scope="scope">
  146 + <span>{{(scope.row.parkInTime) |string2Date(7)}} </span>
  147 + </template>
135 </el-table-column> 148 </el-table-column>
136 <el-table-column 149 <el-table-column
137 - prop="outTime" 150 + prop="parkOutTime"
138 label="出场时间" 151 label="出场时间"
139 :show-overflow-tooltip="true"> 152 :show-overflow-tooltip="true">
  153 + <template slot-scope="scope">
  154 + <span>{{(scope.row.parkOutTime) |string2Date(7)}} </span>
  155 + </template>
140 </el-table-column> 156 </el-table-column>
141 <el-table-column 157 <el-table-column
142 - prop="duration" 158 + prop="parkingDuration"
143 label="停车时长" 159 label="停车时长"
144 :show-overflow-tooltip="true"> 160 :show-overflow-tooltip="true">
  161 + <template slot-scope="scope">
  162 + <span>{{(scope.row) |parkingDurationFormatter(scope.row.parkingDuration)}} </span>
  163 + </template>
145 </el-table-column> 164 </el-table-column>
146 <el-table-column 165 <el-table-column
147 - prop="berthNum" 166 + prop="berthNo"
148 label="泊位编号"> 167 label="泊位编号">
149 </el-table-column> 168 </el-table-column>
150 <el-table-column 169 <el-table-column
151 - prop="status" 170 + prop="orderState"
152 label="订单状态"> 171 label="订单状态">
  172 + <template slot-scope="scope">
  173 + <span>{{(scope.row) |inOutStateFormatter}} </span>
  174 + </template>
153 </el-table-column> 175 </el-table-column>
154 </el-table> 176 </el-table>
155 <el-pagination 177 <el-pagination
156 :page-size="10" 178 :page-size="10"
157 :pager-count="11" 179 :pager-count="11"
158 layout="prev, pager, next" 180 layout="prev, pager, next"
159 - :total="total"> 181 + :total="total"
  182 + @size-change="handleSizeChange"
  183 + @current-change="handleSizeChange"
  184 + @prev-click="handleSizeChange"
  185 + @next-click="handleSizeChange"
  186 + >
160 </el-pagination> 187 </el-pagination>
161 </div> 188 </div>
162 </div> 189 </div>
163 </template> 190 </template>
164 191
165 <script> 192 <script>
166 -import { mapGetters } from 'vuex'  
167 -  
168 -export default {  
169 - name: 'Dashboard',  
170 - computed: {  
171 - ...mapGetters([  
172 - 'name'  
173 - ])  
174 - },  
175 - data() {  
176 - return {  
177 - total: 15,  
178 - currentPage: 1,  
179 - pageSize: 10,  
180 - moneyData: [{  
181 - name: '消费金额',  
182 - january: '123411',  
183 - february: '9787162',  
184 - march: '123097',  
185 - april: '82713',  
186 - may: '1239789',  
187 - june: '81273',  
188 - july: '129387',  
189 - august: '1298778',  
190 - september: '1239878',  
191 - october: '76765',  
192 - november: '123124',  
193 - december: '12341'  
194 - }],  
195 - orderData: [  
196 - {  
197 - parkName: '承德老二中停车场',  
198 - license: '冀H7517732',  
199 - money: '31',  
200 - inTime: '2019-06-02 00:00:00',  
201 - outTime: '2019-06-01 08:00:00',  
202 - duration: '2小时28分钟43秒',  
203 - berthNum: 'A1212231',  
204 - status: '完成'  
205 - },  
206 - {  
207 - parkName: '承德老二中停车场',  
208 - license: '冀H7517732',  
209 - money: '31',  
210 - inTime: '2019-06-02 00:00:00',  
211 - outTime: '2019-06-01 08:00:00',  
212 - duration: '2小时28分钟43秒',  
213 - berthNum: 'A1212231',  
214 - status: '完成'  
215 - },  
216 - {  
217 - parkName: '承德老二中停车场',  
218 - license: '冀H7517732',  
219 - money: '31',  
220 - inTime: '2019-06-02 00:00:00',  
221 - outTime: '2019-06-01 08:00:00',  
222 - duration: '2小时28分钟43秒',  
223 - berthNum: 'A1212231',  
224 - status: '完成'  
225 - },  
226 - {  
227 - parkName: '承德老二中停车场',  
228 - license: '冀H7517732',  
229 - money: '31',  
230 - inTime: '2019-06-02 00:00:00',  
231 - outTime: '2019-06-01 08:00:00',  
232 - duration: '2小时28分钟43秒',  
233 - berthNum: 'A1212231',  
234 - status: '完成' 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,
235 }, 212 },
236 - {  
237 - parkName: '承德老二中停车场',  
238 - license: '冀H7517732',  
239 - money: '31',  
240 - inTime: '2019-06-02 00:00:00',  
241 - outTime: '2019-06-01 08:00:00',  
242 - duration: '2小时28分钟43秒',  
243 - berthNum: 'A1212231',  
244 - status: '完成'  
245 - },  
246 - {  
247 - parkName: '承德老二中停车场',  
248 - license: '冀H7517732',  
249 - money: '31',  
250 - inTime: '2019-06-02 00:00:00',  
251 - outTime: '2019-06-01 08:00:00',  
252 - duration: '2小时28分钟43秒',  
253 - berthNum: 'A1212231',  
254 - status: '完成'  
255 - },  
256 - {  
257 - parkName: '承德老二中停车场',  
258 - license: '冀H7517732',  
259 - money: '31',  
260 - inTime: '2019-06-02 00:00:00',  
261 - outTime: '2019-06-01 08:00:00',  
262 - duration: '2小时28分钟43秒',  
263 - berthNum: 'A1212231',  
264 - status: '完成' 213 + total: 0,
  214 + currentPage: 1,
  215 + pageSize: 10,
  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,
265 }, 325 },
266 - ]  
267 - } 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 +
268 } 348 }
269 -}  
270 </script> 349 </script>
271 350
272 <style lang="scss" scoped> 351 <style lang="scss" scoped>
src/views/information/index.vue
  View file @840795a
1 <template> 1 <template>
2 <div class=""> 2 <div class="">
3 - <!--卡片-->  
4 - <el-row :gutter="16" class="">  
5 - <el-col :span="8">  
6 - <el-card class="box-card">  
7 - <el-upload  
8 - class="avatar-uploader text-center"  
9 - action="https://jsonplaceholder.typicode.com/posts/"  
10 - :show-file-list="false"  
11 - :on-success="handleAvatarSuccess"  
12 - :on-remove="handleRemove"  
13 - :before-upload="beforeAvatarUpload">  
14 - <img v-if="imageUrl" :src="imageUrl" class="avatar">  
15 - <i v-else class="el-icon-plus avatar-uploader-icon"></i>  
16 - </el-upload>  
17 - <!--<el-button class="text-center" size="small" type="primary">点击上传</el-button>-->  
18 - <!--<div slot="tip" class="el-upload__tip"></div>-->  
19 - <div class="common-color text-center" style="line-height: 30px">15143234323</div>  
20 -  
21 - <div class="font-size12 text-center" style="line-height: 30px">支持JPG格式且小于5MB</div>  
22 - <div class="font-size12 text-center" style="height: 146px"> </div>  
23 - </el-card>  
24 - </el-col>  
25 - <el-col :span="16">  
26 - <el-card class="box-card">  
27 - <!-- <div slot="header" class="clearfix" style="line-height: 32px;">  
28 - <span>个人资料</span>  
29 - </div>-->  
30 - <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="80px">  
31 - <el-form-item label="姓名" class="margin-bottom30" prop="username">  
32 - <el-input v-model="ruleForm.username" style="width: 300px"></el-input>  
33 - </el-form-item>  
34 - <el-form-item label="性别" class="margin-bottom30" prop="sex">  
35 - <el-select v-model="ruleForm.sex" style="width: 300px">  
36 - <el-option label="男" value="1"/>  
37 - <el-option label="女" value="2"/>  
38 - </el-select>  
39 - </el-form-item>  
40 - <el-form-item label="生日" class="margin-bottom30" prop="birthday">  
41 - <el-date-picker  
42 - v-model="ruleForm.birthday"  
43 - type="date"  
44 - placeholder="选择日期" style="width: 300px">  
45 - </el-date-picker>  
46 - </el-form-item>  
47 - <el-form-item label="年龄" class="margin-bottom30" prop="num">  
48 - <el-input-number v-model="ruleForm.num" @change="handleChange" :min="1" :max="150" style="width: 300px"></el-input-number>  
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-button @click="resetForm('ruleForm')">取消</el-button>  
57 - </el-form-item>  
58 - </el-form>  
59 - </el-card>  
60 - </el-col>  
61 - </el-row> 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>
62 </div> 61 </div>
63 </template> 62 </template>
64 63
65 <script> 64 <script>
  65 + import {uploadUserPic,updatePersonByCustId} from '@/api/user.js';
  66 +
66 export default { 67 export default {
67 data() { 68 data() {
68 return { 69 return {
69 imageUrl: '', 70 imageUrl: '',
70 ruleForm: { 71 ruleForm: {
71 - username: '万八',  
72 - num: '23',  
73 - sex:'男',  
74 - birthday: '2019-08-17',  
75 - address: '北京海淀区上地五街1003号' 72 + username: '',
  73 + num: '',
  74 + sex: '',
  75 + birthday: '',
  76 + address: '',
  77 + custId: '',
76 }, 78 },
  79 + userPhone:'',
77 rules: { 80 rules: {
78 username: [ 81 username: [
79 - { required: true, message: '请输入活动名称', trigger: 'blur' },  
80 - { min: 1, max: 10, message: '长度在 3 到 10 个字符', trigger: 'blur' } 82 + {required: true, message: '请输入用户名', trigger: 'blur'},
  83 + {min: 1, max: 10, message: '长度在 3 到 10 个字符', trigger: 'blur'}
81 ], 84 ],
82 birthday: [ 85 birthday: [
83 - { required: true, message: '请输入日期', trigger: 'blur' },  
84 - { type: 'email', message: '请输入正确的日期', trigger: ['blur', 'change'] } 86 + {required: true, message: '请输入日期', trigger: 'blur'}
85 ], 87 ],
86 address: [ 88 address: [
87 - { required: true, message: '请输入活动名称', trigger: 'blur' },  
88 - { min: 1, max: 30, message: '长度在 1 到 30 个字符', trigger: 'blur' } 89 + {required: true, message: '请输入地址信息', trigger: 'blur'},
  90 + {min: 1, max: 30, message: '长度在 1 到 30 个字符', trigger: 'blur'}
89 ], 91 ],
90 } 92 }
91 }; 93 };
@@ -96,8 +98,10 @@ @@ -96,8 +98,10 @@
96 }, 98 },
97 handleAvatarSuccess(res, file) { 99 handleAvatarSuccess(res, file) {
98 this.imageUrl = URL.createObjectURL(file.raw); 100 this.imageUrl = URL.createObjectURL(file.raw);
  101 + debugger
99 }, 102 },
100 beforeAvatarUpload(file) { 103 beforeAvatarUpload(file) {
  104 + let that = this;
101 const isJPG = file.type === 'image/jpeg'; 105 const isJPG = file.type === 'image/jpeg';
102 const isLt5M = file.size / 1024 / 1024 < 5; 106 const isLt5M = file.size / 1024 / 1024 < 5;
103 107
@@ -107,15 +111,76 @@ @@ -107,15 +111,76 @@
107 if (!isLt5M) { 111 if (!isLt5M) {
108 this.$message.error('上传头像图片大小不能超过 5MB!'); 112 this.$message.error('上传头像图片大小不能超过 5MB!');
109 } 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 +
110 return isJPG && isLt5M; 127 return isJPG && isLt5M;
111 }, 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 + },
112 resetForm(formName) { 162 resetForm(formName) {
113 this.$refs[formName].resetFields(); 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 + }
114 } 176 }
  177 + },
  178 + mounted: function () {
  179 + this.queryUserInfo();
115 } 180 }
116 } 181 }
117 </script> 182 </script>
118 -<style lang="scss" > 183 +<style lang="scss">
119 184
120 .avatar-uploader .el-upload { 185 .avatar-uploader .el-upload {
121 border: 1px dashed #d9d9d9; 186 border: 1px dashed #d9d9d9;
@@ -124,9 +189,11 @@ @@ -124,9 +189,11 @@
124 position: relative; 189 position: relative;
125 overflow: hidden; 190 overflow: hidden;
126 } 191 }
  192 +
127 .avatar-uploader .el-upload:hover { 193 .avatar-uploader .el-upload:hover {
128 border-color: #409EFF; 194 border-color: #409EFF;
129 } 195 }
  196 +
130 .avatar-uploader-icon { 197 .avatar-uploader-icon {
131 font-size: 28px; 198 font-size: 28px;
132 color: #8c939d; 199 color: #8c939d;
@@ -135,12 +202,14 @@ @@ -135,12 +202,14 @@
135 line-height: 178px; 202 line-height: 178px;
136 text-align: center; 203 text-align: center;
137 } 204 }
  205 +
138 .avatar { 206 .avatar {
139 width: 178px; 207 width: 178px;
140 height: 178px; 208 height: 178px;
141 display: block; 209 display: block;
142 } 210 }
143 - .margin-bottom30{ 211 +
  212 + .margin-bottom30 {
144 margin-bottom: 30px; 213 margin-bottom: 30px;
145 } 214 }
146 </style> 215 </style>
src/views/login/index.vue
  View file @840795a
@@ -109,14 +109,16 @@ export default { @@ -109,14 +109,16 @@ export default {
109 //获取验证码 109 //获取验证码
110 else { 110 else {
111 sendValidatorCode(phone).then(response =>{ 111 sendValidatorCode(phone).then(response =>{
112 - if(response.code=='8888'){ 112 + let data = response.data;
  113 + if(data.code=='8888'){
113 this.$message({ 114 this.$message({
114 type: 'success', 115 type: 'success',
115 message: '验证码发送成功！' 116 message: '验证码发送成功！'
116 }); 117 });
117 } 118 }
118 }); 119 });
119 - this.validateBtn(); 120 + //this.validateBtn();
  121 +
120 } 122 }
121 }, 123 },
122 validateBtn(){ 124 validateBtn(){
@@ -136,7 +138,6 @@ export default { @@ -136,7 +138,6 @@ export default {
136 }, 138 },
137 handleLogin() { 139 handleLogin() {
138 this.$refs.loginForm.validate(valid => { 140 this.$refs.loginForm.validate(valid => {
139 - debugger  
140 if (valid) { 141 if (valid) {
141 this.loading = true 142 this.loading = true
142 this.$store.dispatch('user/login', this.loginForm).then(() => { 143 this.$store.dispatch('user/login', this.loginForm).then(() => {
src/views/mycar/index.vue
  View file @840795a
@@ -5,113 +5,208 @@ @@ -5,113 +5,208 @@
5 <el-row :gutter="20"> 5 <el-row :gutter="20">
6 <el-form ref="form" :model="form" label-width="60px" label-position="left"> 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"> 7 <el-col :xs="8" :sm="6" :md="7" :lg="7" :xl="1">
8 - <el-form-item label="我的账户">  
9 - <el-input v-model="form.email" maxlength="20" readonly /> 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"/>
10 </el-form-item> 15 </el-form-item>
11 </el-col> 16 </el-col>
12 </el-form> 17 </el-form>
13 </el-row> 18 </el-row>
14 </div> 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 +
15 65
16 - <el-card shadow="always" class="card-second-top">  
17 - <div slot="header" class="clearfix" style="line-height: 32px;">  
18 - <span>我的车牌</span>  
19 - <el-button type="primary" size="small" style="float: right" @click="dialogFormVisible = true">绑定车牌</el-button>  
20 - </div>  
21 - <el-form label-width="60px" style="margin-bottom: 55px;" label-position="left">  
22 - <el-col :xs="8" :sm="6" :md="7" :lg="7" :xl="1">  
23 - <el-form-item label="">  
24 - <el-select v-model="value" >  
25 - <el-option  
26 - v-for="item in region"  
27 - :key="item.value"  
28 - :label="item.label"  
29 - :value="item.value"  
30 - >  
31 - </el-option>  
32 - </el-select>  
33 - </el-form-item>  
34 - </el-col>  
35 - <el-col :xs="8" :sm="6" :md="3" :lg="3" :xl="1">  
36 - <el-button type="primary" @click="onSubmit">解绑</el-button>  
37 - </el-col>  
38 - </el-form>  
39 - </el-card>  
40 -  
41 - <el-dialog title="绑定车牌" :visible.sync="dialogFormVisible">  
42 - <el-form :model="problemform" label-width="60px" label-position="left">  
43 - <el-col :xs="8" :sm="6" :md="7" :lg="7" :xl="1">  
44 - <el-form-item label="车牌">  
45 - <el-input v-model="problemform.carnum" maxlength="20" />  
46 - </el-form-item>  
47 - </el-col>  
48 - </el-form>  
49 - <div slot="footer" class="dialog-footer">  
50 - <el-button @click="dialogFormVisible = false">取 消</el-button>  
51 - <el-button type="primary" @click="dialogFormVisible = false">绑定</el-button>  
52 - </div>  
53 - </el-dialog>  
54 </div> 66 </div>
55 </template> 67 </template>
56 68
57 <script> 69 <script>
  70 + import {getPersonCarNumPC,boundCarNum,unboundCarNum} from '@/api/mycar.js';
58 export default { 71 export default {
59 data() { 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 + };
60 return { 84 return {
61 form: { 85 form: {
62 - email: '13133415312', 86 + custId: '',
  87 + phone: '',
63 }, 88 },
64 - value:'京A32323',  
65 - region: [  
66 - {  
67 - value: '京A32323',  
68 - label: '京A32323',  
69 - },{  
70 - value: '京A93323',  
71 - label: '京A93323',  
72 - },  
73 - ],  
74 - dialogFormVisible:false,  
75 - problemform:{  
76 - carnum:'',  
77 - } 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 + }
78 } 104 }
  105 +
  106 +
79 }, 107 },
80 methods: { 108 methods: {
81 - onSubmit() {  
82 - this.$message({  
83 - message: '解绑成功!',  
84 - type: 'success' 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 + }
85 }); 136 });
86 }, 137 },
87 - problemonSubmit() {  
88 - this.$message('提交成功!')  
89 - },  
90 - onCancel() {  
91 - this.$message({  
92 - message: 'cancel!',  
93 - type: 'warning'  
94 - }) 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 + });
95 }, 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();
96 } 187 }
97 } 188 }
98 </script> 189 </script>
99 190
100 <style lang="scss"> 191 <style lang="scss">
101 - .search-wrap{ 192 + .search-wrap {
102 background-color: #FFF; 193 background-color: #FFF;
103 padding: 15px; 194 padding: 15px;
104 } 195 }
105 - .card-second-top{ 196 +
  197 + .card-second-top {
106 margin-top: 15px; 198 margin-top: 15px;
107 } 199 }
108 - .el-card__header{ 200 +
  201 + .el-card__header {
109 padding: 10px 20px; 202 padding: 10px 20px;
110 } 203 }
111 - .el-radio{ 204 +
  205 + .el-radio {
112 margin-right: 80px; 206 margin-right: 80px;
113 } 207 }
114 - .el-radio.is-bordered+.el-radio.is-bordered{ 208 +
  209 + .el-radio.is-bordered + .el-radio.is-bordered {
115 margin-left: 0px; 210 margin-left: 0px;
116 margin-top: 15px; 211 margin-top: 15px;
117 } 212 }
src/views/myevaluate/index.vue
  View file @840795a
@@ -5,22 +5,14 @@ @@ -5,22 +5,14 @@
5 <el-form ref="form" :model="form" label-width="60px" label-position="left"> 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"> 6 <el-col :xs="8" :sm="6" :md="7" :lg="7" :xl="1">
7 <el-form-item label="问题类型"> 7 <el-form-item label="问题类型">
8 - <el-select v-model="form.region" placeholder="请选择问题类型">  
9 - <el-option label="问题类型1" value="1"/>  
10 - <el-option label="问题类型2" value="2"/>  
11 - </el-select>  
12 - </el-form-item>  
13 - </el-col>  
14 - <el-col :xs="8" :sm="6" :md="7" :lg="7" :xl="1">  
15 - <el-form-item label="状态">  
16 - <el-select v-model="form.region" placeholder="请选择状态">  
17 - <el-option label="状态1" value="11"/>  
18 - <el-option label="状态2" value="22"/> 8 + <el-select v-model="form.feedbackId" placeholder="请选择问题类型">
  9 + <el-option v-for="item in problemTpyeSelectData" :label="item.name" :value="item.code"/>
  10 +
19 </el-select> 11 </el-select>
20 </el-form-item> 12 </el-form-item>
21 </el-col> 13 </el-col>
22 - <el-col :xs="16" :sm="6" :md="3" :lg="3" :xl="1">  
23 - <el-button type="primary" @click="onSubmit">查询</el-button> 14 + <el-col :xs="16" :sm="6" :md="3" :lg="3" :xl="1" :offset="12">
  15 + <el-button type="primary" @click="queryBtn">查询</el-button>
24 </el-col> 16 </el-col>
25 </el-form> 17 </el-form>
26 </el-row> 18 </el-row>
@@ -29,120 +21,195 @@ @@ -29,120 +21,195 @@
29 <el-card shadow="always" class="card-second-top"> 21 <el-card shadow="always" class="card-second-top">
30 <div slot="header" class="clearfix" style="line-height: 32px;"> 22 <div slot="header" class="clearfix" style="line-height: 32px;">
31 <span>详细记录</span> 23 <span>详细记录</span>
32 - <el-button type="primary" size="small" style="float: right" @click="dialogFormVisible = true">评价</el-button> 24 + <el-button type="primary" size="small" style="float: right" @click="dialogOpen">评价</el-button>
33 </div> 25 </div>
34 <el-table 26 <el-table
35 :data="orderData" 27 :data="orderData"
36 style="width: 100%;" 28 style="width: 100%;"
37 :show-overflow-tooltip="true"> 29 :show-overflow-tooltip="true">
38 <el-table-column 30 <el-table-column
39 - prop="parkName" 31 + prop="feedbackCode"
40 label="问题类型" 32 label="问题类型"
  33 + :formatter="formatProblemType"
41 :show-overflow-tooltip="true"> 34 :show-overflow-tooltip="true">
42 </el-table-column> 35 </el-table-column>
43 <el-table-column 36 <el-table-column
44 - prop="license" 37 + prop="suggestDesc"
45 label="问题内容" 38 label="问题内容"
46 :show-overflow-tooltip="true"> 39 :show-overflow-tooltip="true">
47 </el-table-column> 40 </el-table-column>
48 <el-table-column 41 <el-table-column
49 - prop="inTime" 42 + prop="createDate"
50 label="提交时间" 43 label="提交时间"
  44 + :formatter="formatCreateDate"
51 :show-overflow-tooltip="true"> 45 :show-overflow-tooltip="true">
52 </el-table-column> 46 </el-table-column>
53 <el-table-column 47 <el-table-column
54 - prop="status"  
55 - label="状态"> 48 + prop="userPhone"
  49 + :formatter="formatserPhone"
  50 + label="用户手机号">
56 </el-table-column> 51 </el-table-column>
57 </el-table> 52 </el-table>
58 <el-pagination 53 <el-pagination
59 - :page-size="10"  
60 - :pager-count="11" 54 + :page-size="pageSize"
  55 + :pager-count="currentPage"
61 layout="prev, pager, next" 56 layout="prev, pager, next"
  57 + @current-change="handleCurrentChange"
62 :total="total"> 58 :total="total">
63 </el-pagination> 59 </el-pagination>
64 </el-card> 60 </el-card>
65 61
66 <el-dialog title="提交问题" :visible.sync="dialogFormVisible"> 62 <el-dialog title="提交问题" :visible.sync="dialogFormVisible">
67 - <el-form :model="problemform"> 63 + <el-form :model="problemform" :rules="rules" ref="problemform">
68 <el-form-item label=""> 64 <el-form-item label="">
69 <el-radio-group v-model="problemform.resource" size=""> 65 <el-radio-group v-model="problemform.resource" size="">
70 - <el-radio border label="APP问题"></el-radio>  
71 - <el-radio border label="支付问题"></el-radio>  
72 - <el-radio border label="车场问题"></el-radio>  
73 - <el-radio border label="服务投诉"></el-radio>  
74 - <el-radio border label="改进建议"></el-radio>  
75 - <el-radio border label="其他问题"></el-radio> 66 + <el-radio border v-for="item in problemTpyeSelectData" :label="item.code">{{item.name}}</el-radio>
76 </el-radio-group> 67 </el-radio-group>
77 </el-form-item> 68 </el-form-item>
78 - <el-form-item label="问题内容">  
79 - <el-input type="textarea" v-model="problemform.desc"></el-input> 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>
80 </el-form-item> 71 </el-form-item>
81 </el-form> 72 </el-form>
82 <div slot="footer" class="dialog-footer"> 73 <div slot="footer" class="dialog-footer">
83 <el-button @click="dialogFormVisible = false">取 消</el-button> 74 <el-button @click="dialogFormVisible = false">取 消</el-button>
84 - <el-button type="primary" @click="dialogFormVisible = false">提交</el-button> 75 + <el-button type="primary" @click="executeDialog('problemform')">提交</el-button>
85 </div> 76 </div>
86 </el-dialog> 77 </el-dialog>
87 </div> 78 </div>
88 </template> 79 </template>
89 80
90 <script> 81 <script>
  82 + import {queryFeedbackAndSuggestForPage,getFeedbackType,saveFeedbackAndSuggest} from '@/api/mysuggest.js';
  83 + import {timeFormatter} from '@/utils/utils.js'
91 export default { 84 export default {
92 data() { 85 data() {
93 return { 86 return {
94 form: { 87 form: {
95 - name: '',  
96 - region: '',  
97 - date1: '',  
98 - date2: '',  
99 - delivery: false,  
100 - type: [],  
101 - resource: '',  
102 - desc: '' 88 + feedbackId:''
103 }, 89 },
  90 + problemTpyeSelectData:[],
104 problemform: { 91 problemform: {
105 - desc: '' 92 + resource: '1',
  93 + desc:''
106 }, 94 },
107 dialogFormVisible: false, 95 dialogFormVisible: false,
108 - total: 55, 96 + total: 10,
109 currentPage: 1, 97 currentPage: 1,
110 pageSize: 10, 98 pageSize: 10,
111 - orderData: [  
112 - {  
113 - parkName: 'APP问题',  
114 - license: '任你停APP闪退',  
115 - inTime: '2019/03/07',  
116 - status: '已受理'  
117 - },  
118 - {  
119 - parkName: '支付问题',  
120 - license: '建议开通银联支付',  
121 - inTime: '2019/06/02',  
122 - status: '已受理'  
123 - },  
124 - {  
125 - parkName: '改进建议',  
126 - license: '建议减免电动车停车费',  
127 - inTime: '2019/06/02',  
128 - status: '未受理'  
129 - },  
130 - ] 99 + orderData: [],
  100 + rules:{
  101 + desc:[
  102 + {required: true, message: '请输入问题内容', trigger: 'blur'},
  103 + {min: 1, max: 10, message: '长度在 3 到 128 个字符', trigger: 'blur'}
  104 + ]
  105 + }
131 } 106 }
132 }, 107 },
133 methods: { 108 methods: {
134 - onSubmit() {  
135 - this.$message('提交!') 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)
136 }, 145 },
137 - problemonSubmit() {  
138 - this.$message('提交成功!') 146 + /**问题类型查询*/
  147 + getFeedbackType:function(){
  148 + getFeedbackType().then(response =>{
  149 + if(response.code='8888'){
  150 + this.problemTpyeSelectData = response.data;
  151 + }
  152 + });
139 }, 153 },
140 - onCancel() {  
141 - this.$message({  
142 - message: 'cancel!',  
143 - type: 'warning'  
144 - }) 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 + }
145 }, 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();
146 } 213 }
147 } 214 }
148 </script> 215 </script>
src/views/order/index.vue
  View file @840795a
@@ -3,30 +3,30 @@ @@ -3,30 +3,30 @@
3 <div class="serch-wrap"> 3 <div class="serch-wrap">
4 <el-row :gutter="20"> 4 <el-row :gutter="20">
5 <el-form ref="form" :model="form" label-width="60px" label-position="left"> 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"> 6 + <!--<el-col :xs="8" :sm="6" :md="7" :lg="7" :xl="1">-->
7 7
8 - <el-form-item label="停车场">  
9 - <el-select v-model="form.region" placeholder="请选择停车场">  
10 - <el-option label="停车场BA" value="shanghai"/>  
11 - <el-option label="停车场" value="beijing"/>  
12 - </el-select>  
13 - </el-form-item> 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 14
15 - </el-col> 15 + <!--</el-col>-->
16 <el-col :xs="8" :sm="6" :md="7" :lg="7" :xl="1"> 16 <el-col :xs="8" :sm="6" :md="7" :lg="7" :xl="1">
17 <el-form-item label="车牌"> 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="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> 18 + <el-input v-model="form.carNum" maxlength="10" />
27 </el-form-item> 19 </el-form-item>
28 </el-col> 20 </el-col>
29 - <el-col :xs="8" :sm="6" :md="3" :lg="3" :xl="1"> 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> 30 <el-button type="primary" @click="onSubmit">查询</el-button>
31 </el-col> 31 </el-col>
32 </el-form> 32 </el-form>
@@ -40,147 +40,151 @@ @@ -40,147 +40,151 @@
40 style="width: 100%;" 40 style="width: 100%;"
41 :show-overflow-tooltip="true"> 41 :show-overflow-tooltip="true">
42 <el-table-column 42 <el-table-column
43 - prop="parkName" 43 + prop="plName"
44 label="停车场" 44 label="停车场"
45 :show-overflow-tooltip="true"> 45 :show-overflow-tooltip="true">
46 </el-table-column> 46 </el-table-column>
47 <el-table-column 47 <el-table-column
48 - prop="license" 48 + prop="carNumber"
49 label="车牌" 49 label="车牌"
50 :show-overflow-tooltip="true"> 50 :show-overflow-tooltip="true">
51 </el-table-column> 51 </el-table-column>
52 <el-table-column 52 <el-table-column
53 - prop="money"  
54 - label="停车费"> 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>
55 </el-table-column> 65 </el-table-column>
56 <el-table-column 66 <el-table-column
57 - prop="inTime"  
58 - label="进场时间" 67 + prop="parkInTime"
  68 + label="入场时间"
59 :show-overflow-tooltip="true"> 69 :show-overflow-tooltip="true">
  70 + <template slot-scope="scope">
  71 + <span>{{(scope.row.parkInTime) |string2Date(7)}} </span>
  72 + </template>
60 </el-table-column> 73 </el-table-column>
61 <el-table-column 74 <el-table-column
62 - prop="outTime" 75 + prop="parkOutTime"
63 label="出场时间" 76 label="出场时间"
64 :show-overflow-tooltip="true"> 77 :show-overflow-tooltip="true">
  78 + <template slot-scope="scope">
  79 + <span>{{(scope.row.parkOutTime) |string2Date(7)}} </span>
  80 + </template>
65 </el-table-column> 81 </el-table-column>
66 <el-table-column 82 <el-table-column
67 - prop="duration" 83 + prop="parkingDuration"
68 label="停车时长" 84 label="停车时长"
69 :show-overflow-tooltip="true"> 85 :show-overflow-tooltip="true">
  86 + <template slot-scope="scope">
  87 + <span>{{(scope.row) |parkingDurationFormatter(scope.row.parkingDuration)}} </span>
  88 + </template>
70 </el-table-column> 89 </el-table-column>
71 <el-table-column 90 <el-table-column
72 - prop="berthNum" 91 + prop="berthNo"
73 label="泊位编号"> 92 label="泊位编号">
74 </el-table-column> 93 </el-table-column>
75 <el-table-column 94 <el-table-column
76 - prop="status" 95 + prop="orderState"
77 label="订单状态"> 96 label="订单状态">
  97 + <template slot-scope="scope">
  98 + <span>{{(scope.row) |inOutStateFormatter}} </span>
  99 + </template>
78 </el-table-column> 100 </el-table-column>
79 </el-table> 101 </el-table>
80 <el-pagination 102 <el-pagination
81 :page-size="10" 103 :page-size="10"
82 :pager-count="11" 104 :pager-count="11"
83 layout="prev, pager, next" 105 layout="prev, pager, next"
84 - :total="total"> 106 + :total="total"
  107 + @size-change="handleSizeChange"
  108 + @current-change="handleSizeChange"
  109 + @prev-click="handleSizeChange"
  110 + @next-click="handleSizeChange"
  111 + >
85 </el-pagination> 112 </el-pagination>
86 </div> 113 </div>
87 </div> 114 </div>
88 </template> 115 </template>
89 116
90 <script> 117 <script>
  118 + import {queryOwnerParkRecord} from '@/api/index';
  119 + import {fen2Yuan,string2Date,inOutStateFormatter,parkingDurationFormatter} from '@/filters/index';
91 export default { 120 export default {
92 data() { 121 data() {
93 return { 122 return {
94 form: { 123 form: {
95 - name: '',  
96 - region: '',  
97 - date1: '',  
98 - date2: '',  
99 - delivery: false,  
100 - type: [],  
101 - resource: '',  
102 - desc: '' 124 + plNos: null,
  125 + carNum: null,
  126 +
103 }, 127 },
104 - total: 55, 128 + total: 0,
105 currentPage: 1, 129 currentPage: 1,
106 pageSize: 10, 130 pageSize: 10,
107 orderData: [ 131 orderData: [
108 - {  
109 - parkName: '承德老二中停车场',  
110 - license: '冀H7517732',  
111 - money: '31',  
112 - inTime: '2019-06-02 00:00:00',  
113 - outTime: '2019-06-01 08:00:00',  
114 - duration: '2小时28分钟43秒',  
115 - berthNum: 'A1212231',  
116 - status: '完成'  
117 - },  
118 - {  
119 - parkName: '承德老二中停车场',  
120 - license: '冀H7517732',  
121 - money: '31',  
122 - inTime: '2019-06-02 00:00:00',  
123 - outTime: '2019-06-01 08:00:00',  
124 - duration: '2小时28分钟43秒',  
125 - berthNum: 'A1212231',  
126 - status: '完成'  
127 - },  
128 - {  
129 - parkName: '承德老二中停车场',  
130 - license: '冀H7517732',  
131 - money: '31',  
132 - inTime: '2019-06-02 00:00:00',  
133 - outTime: '2019-06-01 08:00:00',  
134 - duration: '2小时28分钟43秒',  
135 - berthNum: 'A1212231',  
136 - status: '完成'  
137 - },  
138 - {  
139 - parkName: '承德老二中停车场',  
140 - license: '冀H7517732',  
141 - money: '31',  
142 - inTime: '2019-06-02 00:00:00',  
143 - outTime: '2019-06-01 08:00:00',  
144 - duration: '2小时28分钟43秒',  
145 - berthNum: 'A1212231',  
146 - status: '完成'  
147 - },  
148 - {  
149 - parkName: '承德老二中停车场',  
150 - license: '冀H7517732',  
151 - money: '31',  
152 - inTime: '2019-06-02 00:00:00',  
153 - outTime: '2019-06-01 08:00:00',  
154 - duration: '2小时28分钟43秒',  
155 - berthNum: 'A1212231',  
156 - status: '完成'  
157 - },  
158 - {  
159 - parkName: '承德老二中停车场',  
160 - license: '冀H7517732',  
161 - money: '31',  
162 - inTime: '2019-06-02 00:00:00',  
163 - outTime: '2019-06-01 08:00:00',  
164 - duration: '2小时28分钟43秒',  
165 - berthNum: 'A1212231',  
166 - status: '完成'  
167 - },  
168 - {  
169 - parkName: '承德老二中停车场',  
170 - license: '冀H7517732',  
171 - money: '31',  
172 - inTime: '2019-06-02 00:00:00',  
173 - outTime: '2019-06-01 08:00:00',  
174 - duration: '2小时28分钟43秒',  
175 - berthNum: 'A1212231',  
176 - status: '完成'  
177 - },  
178 ] 132 ]
179 } 133 }
180 }, 134 },
  135 + mounted: function() {
  136 +
  137 + this.queryOwnerParkRecord();
  138 + },
181 methods: { 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 +
182 onSubmit() { 186 onSubmit() {
183 - this.$message('submit!') 187 + this.queryOwnerParkRecord();
184 }, 188 },
185 onCancel() { 189 onCancel() {
186 this.$message({ 190 this.$message({
src/views/payback/index.vue
  View file @840795a
@@ -4,6 +4,16 @@ @@ -4,6 +4,16 @@
4 <el-row :gutter="20"> 4 <el-row :gutter="20">
5 <el-form ref="form" :model="form" label-width="60px" label-position="left"> 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"> 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">
7 <el-form-item label="车牌"> 17 <el-form-item label="车牌">
8 <el-input v-model="form.name" maxlength="10" /> 18 <el-input v-model="form.name" maxlength="10" />
9 </el-form-item> 19 </el-form-item>
@@ -16,162 +26,295 @@ @@ -16,162 +26,295 @@
16 </div> 26 </div>
17 27
18 <div class="table-wrap"> 28 <div class="table-wrap">
19 - <p class="table-title">订单详情</p> 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>
20 <el-table 37 <el-table
21 :data="orderData" 38 :data="orderData"
22 style="width: 100%;" 39 style="width: 100%;"
23 - :show-overflow-tooltip="true"> 40 + :show-overflow-tooltip="true"
  41 + @selection-change="handleSelectionChange">
  42 + <el-table-column
  43 + type="selection">
  44 + </el-table-column>
24 <el-table-column 45 <el-table-column
25 - prop="parkName" 46 + prop="plName"
26 label="停车场" 47 label="停车场"
27 :show-overflow-tooltip="true"> 48 :show-overflow-tooltip="true">
28 </el-table-column> 49 </el-table-column>
29 <el-table-column 50 <el-table-column
30 - prop="license" 51 + prop="carNumber"
31 label="车牌" 52 label="车牌"
32 :show-overflow-tooltip="true"> 53 :show-overflow-tooltip="true">
33 </el-table-column> 54 </el-table-column>
34 <el-table-column 55 <el-table-column
35 - prop="money"  
36 - label="停车费"> 56 + prop="arrearageFee"
  57 + label="欠费金额">
  58 + <template slot-scope="scope">
  59 + <span>{{(scope.row.arrearageFee) |fen2Yuan}} </span>
  60 + </template>
37 </el-table-column> 61 </el-table-column>
38 <el-table-column 62 <el-table-column
39 - prop="inTime"  
40 - label="进场时间" 63 + prop="parkInTime"
  64 + label="入场时间"
41 :show-overflow-tooltip="true"> 65 :show-overflow-tooltip="true">
  66 + <template slot-scope="scope">
  67 + <span>{{(scope.row.parkInTime) |string2Date(7)}} </span>
  68 + </template>
42 </el-table-column> 69 </el-table-column>
43 <el-table-column 70 <el-table-column
44 - prop="outTime" 71 + prop="parkOutTime"
45 label="出场时间" 72 label="出场时间"
46 :show-overflow-tooltip="true"> 73 :show-overflow-tooltip="true">
  74 + <template slot-scope="scope">
  75 + <span>{{(scope.row.parkOutTime) |string2Date(7)}} </span>
  76 + </template>
47 </el-table-column> 77 </el-table-column>
48 <el-table-column 78 <el-table-column
49 - prop="duration" 79 + prop="parkingDuration"
50 label="停车时长" 80 label="停车时长"
51 :show-overflow-tooltip="true"> 81 :show-overflow-tooltip="true">
  82 + <template slot-scope="scope">
  83 + <span>{{(scope.row) |parkingDurationFormatter(scope.row.parkingDuration)}} </span>
  84 + </template>
52 </el-table-column> 85 </el-table-column>
53 <el-table-column 86 <el-table-column
54 - prop="berthNum" 87 + prop="berthNo"
55 label="泊位编号"> 88 label="泊位编号">
56 </el-table-column> 89 </el-table-column>
57 <el-table-column 90 <el-table-column
58 - prop="status" 91 + prop="orderState"
59 label="订单状态"> 92 label="订单状态">
  93 + <template slot-scope="scope">
  94 + <span>{{(scope.row) |inOutStateFormatter}} </span>
  95 + </template>
60 </el-table-column> 96 </el-table-column>
61 </el-table> 97 </el-table>
62 <el-pagination 98 <el-pagination
63 :page-size="10" 99 :page-size="10"
64 :pager-count="11" 100 :pager-count="11"
65 layout="prev, pager, next" 101 layout="prev, pager, next"
66 - :total="total"> 102 + :total="total"
  103 + @size-change="handleSizeChange"
  104 + @current-change="handleSizeChange"
  105 + @prev-click="handleSizeChange"
  106 + @next-click="handleSizeChange"
  107 + >
67 </el-pagination> 108 </el-pagination>
68 </div> 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 +
69 </div> 128 </div>
70 </template> 129 </template>
71 130
72 <script> 131 <script>
73 -export default {  
74 - data() {  
75 - return {  
76 - form: {  
77 - name: '',  
78 - region: '',  
79 - date1: '',  
80 - date2: '',  
81 - delivery: false,  
82 - type: [],  
83 - resource: '',  
84 - desc: ''  
85 - },  
86 - total: 55,  
87 - currentPage: 1,  
88 - pageSize: 10,  
89 - orderData: [  
90 - {  
91 - parkName: '承德老二中停车场',  
92 - license: '冀H7517732',  
93 - money: '31',  
94 - inTime: '2019-06-02 00:00:00',  
95 - outTime: '2019-06-01 08:00:00',  
96 - duration: '2小时28分钟43秒',  
97 - berthNum: 'A1212231',  
98 - status: '完成'  
99 - },  
100 - {  
101 - parkName: '承德老二中停车场',  
102 - license: '冀H7517732',  
103 - money: '31',  
104 - inTime: '2019-06-02 00:00:00',  
105 - outTime: '2019-06-01 08:00:00',  
106 - duration: '2小时28分钟43秒',  
107 - berthNum: 'A1212231',  
108 - status: '完成'  
109 - },  
110 - {  
111 - parkName: '承德老二中停车场',  
112 - license: '冀H7517732',  
113 - money: '31',  
114 - inTime: '2019-06-02 00:00:00',  
115 - outTime: '2019-06-01 08:00:00',  
116 - duration: '2小时28分钟43秒',  
117 - berthNum: 'A1212231',  
118 - status: '完成'  
119 - },  
120 - {  
121 - parkName: '承德老二中停车场',  
122 - license: '冀H7517732',  
123 - money: '31',  
124 - inTime: '2019-06-02 00:00:00',  
125 - outTime: '2019-06-01 08:00:00',  
126 - duration: '2小时28分钟43秒',  
127 - berthNum: 'A1212231',  
128 - status: '完成'  
129 - },  
130 - {  
131 - parkName: '承德老二中停车场',  
132 - license: '冀H7517732',  
133 - money: '31',  
134 - inTime: '2019-06-02 00:00:00',  
135 - outTime: '2019-06-01 08:00:00',  
136 - duration: '2小时28分钟43秒',  
137 - berthNum: 'A1212231',  
138 - status: '完成'  
139 - },  
140 - {  
141 - parkName: '承德老二中停车场',  
142 - license: '冀H7517732',  
143 - money: '31',  
144 - inTime: '2019-06-02 00:00:00',  
145 - outTime: '2019-06-01 08:00:00',  
146 - duration: '2小时28分钟43秒',  
147 - berthNum: 'A1212231',  
148 - status: '完成'  
149 - },  
150 - {  
151 - parkName: '承德老二中停车场',  
152 - license: '冀H7517732',  
153 - money: '31',  
154 - inTime: '2019-06-02 00:00:00',  
155 - outTime: '2019-06-01 08:00:00',  
156 - duration: '2小时28分钟43秒',  
157 - berthNum: 'A1212231',  
158 - status: '完成' 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 +
159 }, 143 },
160 - ]  
161 - }  
162 - },  
163 - methods: {  
164 - onSubmit() {  
165 - this.$message('submit!') 144 + orgs:[],
  145 + total: 0,
  146 + currentPage: 1,
  147 + pageSize: 10,
  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 +
166 }, 158 },
167 - onCancel() {  
168 - this.$message({  
169 - message: 'cancel!',  
170 - type: 'warning'  
171 - }) 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 + }
172 } 316 }
173 } 317 }
174 -}  
175 </script> 318 </script>
176 319
177 <style scoped> 320 <style scoped>
vue.config.js
  View file @840795a
@@ -21,7 +21,7 @@ module.exports = { @@ -21,7 +21,7 @@ module.exports = {
21 * In most cases please use '/' !!! 21 * In most cases please use '/' !!!
22 * Detail: https://cli.vuejs.org/config/#publicpath 22 * Detail: https://cli.vuejs.org/config/#publicpath
23 */ 23 */
24 - publicPath: '/', 24 + publicPath: './',
25 outputDir: 'dist', 25 outputDir: 'dist',
26 assetsDir: 'static', 26 assetsDir: 'static',
27 lintOnSave: process.env.NODE_ENV === 'development', 27 lintOnSave: process.env.NODE_ENV === 'development',