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
.env.production
... ... @@ -3,5 +3,5 @@ ENV = 'production'
3 3  
4 4 # base api
5 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
... ... @@ -21,6 +21,7 @@
21 21 "normalize.css": "7.0.0",
22 22 "nprogress": "^0.2.0",
23 23 "path-to-regexp": "2.4.0",
  24 + "qrcodejs2": "^0.0.2",
24 25 "vue": "2.6.10",
25 26 "vue-router": "3.0.6",
26 27 "vuex": "3.1.0"
... ...
src/api/account.js 0 → 100644
  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
  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
  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
  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
  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
... ... @@ -9,7 +9,6 @@ export function login(data) {
9 9 }
10 10  
11 11 export function getInfo(token) {
12   - debugger
13 12 return request({
14 13 url: '/personPc/getUserInfo',
15 14 method: 'post',
... ... @@ -35,3 +34,25 @@ export function logout() {
35 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
  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
... ... @@ -11,6 +11,7 @@ import &#39;@/styles/index.scss&#39; // global css
11 11 import App from './App'
12 12 import store from './store'
13 13 import router from './router'
  14 +import * as filters from './filters' // global filters
14 15  
15 16 import '@/icons' // icon
16 17 import '@/permission' // permission control
... ... @@ -28,6 +29,10 @@ import &#39;@/permission&#39; // permission control
28 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 36 // set ElementUI lang to EN
32 37 Vue.use(ElementUI, { locale })
33 38  
... ...
src/router/index.js
... ... @@ -123,11 +123,6 @@ export const constantRoutes = [
123 123 meta: { title: '个人资料' }
124 124 },
125 125 {
126   - path: 'settings',
127   - component: () => import('@/views/settings/index'),
128   - meta: { title: '账户设置' },
129   - },
130   - {
131 126 path: 'myevaluate',
132 127 component: () => import('@/views/myevaluate/index'),
133 128 meta: { title: '我的评价' }
... ...
src/store/modules/user.js
... ... @@ -32,7 +32,6 @@ const actions = {
32 32 return new Promise((resolve, reject) => {
33 33 login({ userPhone: phone.trim(), validatorCode: password }).then(response => {
34 34 const { data } = response
35   - debugger;
36 35 commit('SET_TOKEN', data.token)
37 36 setToken(data.token)
38 37 resolve()
... ... @@ -45,14 +44,11 @@ const actions = {
45 44 // get user info
46 45 getInfo({ commit, state }) {
47 46 return new Promise((resolve, reject) => {
48   - debugger
49 47 getInfo(state.token).then(response => {
50 48 const { data } = response
51   -
52 49 if (!data) {
53 50 reject('Verification failed, please Login again.')
54 51 }
55   -
56 52 const { custName, headPicUrl } = data
57 53  
58 54 commit('SET_NAME', custName)
... ...
src/utils/DateUtils.js 0 → 100755
  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
... ... @@ -58,7 +58,6 @@ service.interceptors.response.use(
58 58 }
59 59 },
60 60 error => {
61   - debugger
62 61 console.log('err' + error) // for debug
63 62 Message({
64 63 message: error.message,
... ...
src/utils/utils.js 0 → 100644
  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
... ... @@ -10,7 +10,7 @@
10 10 </el-col>
11 11 <el-col :span="12" :offset="4">
12 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 14 </el-col>
15 15 </el-row>
16 16 </el-card>
... ... @@ -23,7 +23,7 @@
23 23 </el-col>
24 24 <el-col :span="12" :offset="4">
25 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 27 </el-col>
28 28 </el-row>
29 29 </el-card>
... ... @@ -34,70 +34,114 @@
34 34 <el-tabs :tab-position="tabPosition" >
35 35 <el-tab-pane label="充值记录">
36 36 <el-table
37   - :data="paytableData"
  37 + :data="rechargeTableData"
38 38 style="width: 100%;"
39 39 :show-overflow-tooltip="true">
40 40 <el-table-column
41   - prop="parkName"
  41 + prop="acctType"
42 42 label="账户类型"
43 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 48 </el-table-column>
45 49 <el-table-column
46   - prop="license"
  50 + prop="rechargeFee"
47 51 label="充值金额"
48 52 :show-overflow-tooltip="true">
  53 + <template slot-scope="scope">
  54 + <span>{{(scope.row.rechargeFee) |fen2Yuan}} </span>
  55 + </template>
49 56 </el-table-column>
50 57 <el-table-column
51   - prop="money"
  58 + prop="rechargeBalance"
52 59 label="充值后余额">
  60 + <template slot-scope="scope">
  61 + <span>{{(scope.row.rechargeBalance) |fen2Yuan}} </span>
  62 + </template>
53 63 </el-table-column>
54 64 <el-table-column
55   - prop="inTime"
  65 + prop="rechargeTime"
56 66 label="充值时间"
57 67 :show-overflow-tooltip="true">
  68 + <template slot-scope="scope">
  69 + <span>{{(scope.row.rechargeTime) |string2Date(7)}} </span>
  70 + </template>
58 71 </el-table-column>
59 72 </el-table>
60 73 <el-pagination
61 74 :page-size="10"
62 75 :pager-count="11"
63 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 82 </el-pagination>
66 83 </el-tab-pane>
67 84 <el-tab-pane label="支出记录">
68 85 <el-table
69   - :data="outtableData"
  86 + :data="payOutTableData"
70 87 style="width: 100%;"
71 88 :show-overflow-tooltip="true">
72 89 <el-table-column
73   - prop="parkName"
  90 + prop="acctType"
74 91 label="账户类型"
75 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 97 </el-table-column>
77 98 <el-table-column
78   - prop="license"
  99 + prop="tradeFee"
79 100 label="交易金额"
80 101 :show-overflow-tooltip="true">
  102 + <template slot-scope="scope">
  103 + <span>{{(scope.row.tradeFee) |fen2Yuan}} </span>
  104 + </template>
81 105 </el-table-column>
82 106 <el-table-column
83   - prop="money"
  107 + prop="tradeBalance"
84 108 label="交易后余额">
  109 + <template slot-scope="scope">
  110 + <span>{{(scope.row.tradeBalance) |fen2Yuan}} </span>
  111 + </template>
85 112 </el-table-column>
86 113 <el-table-column
87   - prop="outtype"
  114 + prop="tradeDetialType"
88 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 126 </el-table-column>
90 127 <el-table-column
91   - prop="inTime"
  128 + prop="tradeTime"
92 129 label="交易时间"
93 130 :show-overflow-tooltip="true">
  131 + <template slot-scope="scope">
  132 + <span>{{(scope.row.tradeTime) |string2Date(7)}} </span>
  133 + </template>
94 134 </el-table-column>
95 135 </el-table>
96 136 <el-pagination
97 137 :page-size="10"
98 138 :pager-count="21"
99 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 145 </el-pagination>
102 146 </el-tab-pane>
103 147 </el-tabs>
... ... @@ -111,7 +155,8 @@
111 155 import pagination from '@/components/Pagination/index.vue';
112 156 import LoadingBar from 'nprogress' // progress bar
113 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 160 export default {
116 161 components:{
117 162 'i-pagination': pagination
... ... @@ -121,101 +166,140 @@ export default {
121 166 },
122 167 data() {
123 168 return {
  169 + rechargeBalance:0,
  170 + presentBalance:0,
124 171 list: null,
125 172 tabPosition:'top',
126 173 listLoading: true,
127 174 btnLoading:false,
128 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 182 currentPage: 1,
193 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 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 304 </script>
221 305 <style lang="scss" scoped >
... ...
src/views/cardticket/index.vue
... ... @@ -5,17 +5,18 @@
5 5 <el-row :gutter="16" class="">
6 6 <el-col :span="6" v-for="(ticket,id) in ticketList" :key="id" class="margin-bottom16">
7 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 12 </div>
13 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 17 <div class="ticket-notes float-left">元 优惠券</div>
17 18 </div>
18   - <div class="ticket-time">有效时间:{{ticket.ptime}}</div>
  19 + <div class="ticket-time">有效时间:{{ticket.endTime | string2Date(1)}}</div>
19 20 </div>
20 21 </el-card>
21 22 </el-col>
... ... @@ -24,82 +25,34 @@
24 25 </template>
25 26  
26 27 <script>
  28 + import {getCouponPerson} from '@/api/cardticket.js';
27 29 export default {
28   -
29 30 data() {
30 31 return {
31 32 ticketList:[
32   - {
  33 + /*{
33 34 id:'123',
34 35 ptype:'1',
35 36 plname:'静雅地上停车场',
36 37 pname:'有效',
37 38 pmoney:'50',
38 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 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 58 </script>
... ...
src/views/dashboard/index.vue
... ... @@ -8,10 +8,10 @@
8 8 </div>
9 9 <div class="card-panel-description">
10 10 <div class="card-panel-text">
11   - 本月订单: 21
  11 + 本月订单: {{cardData.monthOrderNum}}
12 12 </div>
13 13 <div class="card-panel-text">
14   - 订单总量: 1231
  14 + 订单总量: {{cardData.totalOrderNum}}
15 15 </div>
16 16 </div>
17 17 </div>
... ... @@ -23,10 +23,10 @@
23 23 </div>
24 24 <div class="card-panel-description">
25 25 <div class="card-panel-text">
26   - 可用卡券: 101
  26 + 可用卡券: {{cardData.validCouponNum}}
27 27 </div>
28 28 <div class="card-panel-text">
29   - 卡券总量: 332
  29 + 卡券总量: {{cardData.totalCouponNum}}
30 30 </div>
31 31 </div>
32 32 </div>
... ... @@ -38,10 +38,10 @@
38 38 </div>
39 39 <div class="card-panel-description">
40 40 <div class="card-panel-text">
41   - 可用积分: 21
  41 + 可用积分: {{cardData.validScore}}
42 42 </div>
43 43 <div class="card-panel-text">
44   - 全部积分: 231
  44 + 全部积分: {{cardData.totalScore}}
45 45 </div>
46 46 </div>
47 47 </div>
... ... @@ -109,164 +109,243 @@
109 109 </div>
110 110  
111 111 <div class="table-wrap">
112   - <p class="table-title">最新订单</p>
  112 + <p class="table-title">最新订单(近三个月)</p>
113 113 <el-table
114 114 :data="orderData"
115 115 style="width: 100%;"
116 116 :show-overflow-tooltip="true">
117 117 <el-table-column
118   - prop="parkName"
  118 + prop="plName"
119 119 label="停车场"
120 120 :show-overflow-tooltip="true">
121 121 </el-table-column>
122 122 <el-table-column
123   - prop="license"
  123 + prop="carNumber"
124 124 label="车牌"
125 125 :show-overflow-tooltip="true">
126 126 </el-table-column>
127 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 133 </el-table-column>
131 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 143 label="入场时间"
134 144 :show-overflow-tooltip="true">
  145 + <template slot-scope="scope">
  146 + <span>{{(scope.row.parkInTime) |string2Date(7)}} </span>
  147 + </template>
135 148 </el-table-column>
136 149 <el-table-column
137   - prop="outTime"
  150 + prop="parkOutTime"
138 151 label="出场时间"
139 152 :show-overflow-tooltip="true">
  153 + <template slot-scope="scope">
  154 + <span>{{(scope.row.parkOutTime) |string2Date(7)}} </span>
  155 + </template>
140 156 </el-table-column>
141 157 <el-table-column
142   - prop="duration"
  158 + prop="parkingDuration"
143 159 label="停车时长"
144 160 :show-overflow-tooltip="true">
  161 + <template slot-scope="scope">
  162 + <span>{{(scope.row) |parkingDurationFormatter(scope.row.parkingDuration)}} </span>
  163 + </template>
145 164 </el-table-column>
146 165 <el-table-column
147   - prop="berthNum"
  166 + prop="berthNo"
148 167 label="泊位编号">
149 168 </el-table-column>
150 169 <el-table-column
151   - prop="status"
  170 + prop="orderState"
152 171 label="订单状态">
  172 + <template slot-scope="scope">
  173 + <span>{{(scope.row) |inOutStateFormatter}} </span>
  174 + </template>
153 175 </el-table-column>
154 176 </el-table>
155 177 <el-pagination
156 178 :page-size="10"
157 179 :pager-count="11"
158 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 187 </el-pagination>
161 188 </div>
162 189 </div>
163 190 </template>
164 191  
165 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 349 </script>
271 350  
272 351 <style lang="scss" scoped>
... ...
src/views/information/index.vue
1 1 <template>
2 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 61 </div>
63 62 </template>
64 63  
65 64 <script>
  65 + import {uploadUserPic,updatePersonByCustId} from '@/api/user.js';
  66 +
66 67 export default {
67 68 data() {
68 69 return {
69 70 imageUrl: '',
70 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 80 rules: {
78 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 85 birthday: [
83   - { required: true, message: '请输入日期', trigger: 'blur' },
84   - { type: 'email', message: '请输入正确的日期', trigger: ['blur', 'change'] }
  86 + {required: true, message: '请输入日期', trigger: 'blur'}
85 87 ],
86 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 98 },
97 99 handleAvatarSuccess(res, file) {
98 100 this.imageUrl = URL.createObjectURL(file.raw);
  101 + debugger
99 102 },
100 103 beforeAvatarUpload(file) {
  104 + let that = this;
101 105 const isJPG = file.type === 'image/jpeg';
102 106 const isLt5M = file.size / 1024 / 1024 < 5;
103 107  
... ... @@ -107,15 +111,76 @@
107 111 if (!isLt5M) {
108 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 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 162 resetForm(formName) {
113 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 182 </script>
118   -<style lang="scss" >
  183 +<style lang="scss">
119 184  
120 185 .avatar-uploader .el-upload {
121 186 border: 1px dashed #d9d9d9;
... ... @@ -124,9 +189,11 @@
124 189 position: relative;
125 190 overflow: hidden;
126 191 }
  192 +
127 193 .avatar-uploader .el-upload:hover {
128 194 border-color: #409EFF;
129 195 }
  196 +
130 197 .avatar-uploader-icon {
131 198 font-size: 28px;
132 199 color: #8c939d;
... ... @@ -135,12 +202,14 @@
135 202 line-height: 178px;
136 203 text-align: center;
137 204 }
  205 +
138 206 .avatar {
139 207 width: 178px;
140 208 height: 178px;
141 209 display: block;
142 210 }
143   - .margin-bottom30{
  211 +
  212 + .margin-bottom30 {
144 213 margin-bottom: 30px;
145 214 }
146 215 </style>
... ...
src/views/login/index.vue
... ... @@ -109,14 +109,16 @@ export default {
109 109 //获取验证码
110 110 else {
111 111 sendValidatorCode(phone).then(response =>{
112   - if(response.code=='8888'){
  112 + let data = response.data;
  113 + if(data.code=='8888'){
113 114 this.$message({
114 115 type: 'success',
115 116 message: '验证码发送成功!'
116 117 });
117 118 }
118 119 });
119   - this.validateBtn();
  120 + //this.validateBtn();
  121 +
120 122 }
121 123 },
122 124 validateBtn(){
... ... @@ -136,7 +138,6 @@ export default {
136 138 },
137 139 handleLogin() {
138 140 this.$refs.loginForm.validate(valid => {
139   - debugger
140 141 if (valid) {
141 142 this.loading = true
142 143 this.$store.dispatch('user/login', this.loginForm).then(() => {
... ...
src/views/mycar/index.vue
... ... @@ -5,113 +5,208 @@
5 5 <el-row :gutter="20">
6 6 <el-form ref="form" :model="form" label-width="60px" label-position="left">
7 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 15 </el-form-item>
11 16 </el-col>
12 17 </el-form>
13 18 </el-row>
14 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 66 </div>
55 67 </template>
56 68  
57 69 <script>
  70 + import {getPersonCarNumPC,boundCarNum,unboundCarNum} from '@/api/mycar.js';
58 71 export default {
59 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 84 return {
61 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 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 189 </script>
99 190  
100 191 <style lang="scss">
101   - .search-wrap{
  192 + .search-wrap {
102 193 background-color: #FFF;
103 194 padding: 15px;
104 195 }
105   - .card-second-top{
  196 +
  197 + .card-second-top {
106 198 margin-top: 15px;
107 199 }
108   - .el-card__header{
  200 +
  201 + .el-card__header {
109 202 padding: 10px 20px;
110 203 }
111   - .el-radio{
  204 +
  205 + .el-radio {
112 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 210 margin-left: 0px;
116 211 margin-top: 15px;
117 212 }
... ...
src/views/myevaluate/index.vue
... ... @@ -5,22 +5,14 @@
5 5 <el-form ref="form" :model="form" label-width="60px" label-position="left">
6 6 <el-col :xs="8" :sm="6" :md="7" :lg="7" :xl="1">
7 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 11 </el-select>
20 12 </el-form-item>
21 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 16 </el-col>
25 17 </el-form>
26 18 </el-row>
... ... @@ -29,120 +21,195 @@
29 21 <el-card shadow="always" class="card-second-top">
30 22 <div slot="header" class="clearfix" style="line-height: 32px;">
31 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 25 </div>
34 26 <el-table
35 27 :data="orderData"
36 28 style="width: 100%;"
37 29 :show-overflow-tooltip="true">
38 30 <el-table-column
39   - prop="parkName"
  31 + prop="feedbackCode"
40 32 label="问题类型"
  33 + :formatter="formatProblemType"
41 34 :show-overflow-tooltip="true">
42 35 </el-table-column>
43 36 <el-table-column
44   - prop="license"
  37 + prop="suggestDesc"
45 38 label="问题内容"
46 39 :show-overflow-tooltip="true">
47 40 </el-table-column>
48 41 <el-table-column
49   - prop="inTime"
  42 + prop="createDate"
50 43 label="提交时间"
  44 + :formatter="formatCreateDate"
51 45 :show-overflow-tooltip="true">
52 46 </el-table-column>
53 47 <el-table-column
54   - prop="status"
55   - label="状态">
  48 + prop="userPhone"
  49 + :formatter="formatserPhone"
  50 + label="用户手机号">
56 51 </el-table-column>
57 52 </el-table>
58 53 <el-pagination
59   - :page-size="10"
60   - :pager-count="11"
  54 + :page-size="pageSize"
  55 + :pager-count="currentPage"
61 56 layout="prev, pager, next"
  57 + @current-change="handleCurrentChange"
62 58 :total="total">
63 59 </el-pagination>
64 60 </el-card>
65 61  
66 62 <el-dialog title="提交问题" :visible.sync="dialogFormVisible">
67   - <el-form :model="problemform">
  63 + <el-form :model="problemform" :rules="rules" ref="problemform">
68 64 <el-form-item label="">
69 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 67 </el-radio-group>
77 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 71 </el-form-item>
81 72 </el-form>
82 73 <div slot="footer" class="dialog-footer">
83 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 76 </div>
86 77 </el-dialog>
87 78 </div>
88 79 </template>
89 80  
90 81 <script>
  82 + import {queryFeedbackAndSuggestForPage,getFeedbackType,saveFeedbackAndSuggest} from '@/api/mysuggest.js';
  83 + import {timeFormatter} from '@/utils/utils.js'
91 84 export default {
92 85 data() {
93 86 return {
94 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 91 problemform: {
105   - desc: ''
  92 + resource: '1',
  93 + desc:''
106 94 },
107 95 dialogFormVisible: false,
108   - total: 55,
  96 + total: 10,
109 97 currentPage: 1,
110 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 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 215 </script>
... ...
src/views/order/index.vue
... ... @@ -3,30 +3,30 @@
3 3 <div class="serch-wrap">
4 4 <el-row :gutter="20">
5 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 16 <el-col :xs="8" :sm="6" :md="7" :lg="7" :xl="1">
17 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 19 </el-form-item>
28 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 30 <el-button type="primary" @click="onSubmit">查询</el-button>
31 31 </el-col>
32 32 </el-form>
... ... @@ -40,147 +40,151 @@
40 40 style="width: 100%;"
41 41 :show-overflow-tooltip="true">
42 42 <el-table-column
43   - prop="parkName"
  43 + prop="plName"
44 44 label="停车场"
45 45 :show-overflow-tooltip="true">
46 46 </el-table-column>
47 47 <el-table-column
48   - prop="license"
  48 + prop="carNumber"
49 49 label="车牌"
50 50 :show-overflow-tooltip="true">
51 51 </el-table-column>
52 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 65 </el-table-column>
56 66 <el-table-column
57   - prop="inTime"
58   - label="进场时间"
  67 + prop="parkInTime"
  68 + label="入场时间"
59 69 :show-overflow-tooltip="true">
  70 + <template slot-scope="scope">
  71 + <span>{{(scope.row.parkInTime) |string2Date(7)}} </span>
  72 + </template>
60 73 </el-table-column>
61 74 <el-table-column
62   - prop="outTime"
  75 + prop="parkOutTime"
63 76 label="出场时间"
64 77 :show-overflow-tooltip="true">
  78 + <template slot-scope="scope">
  79 + <span>{{(scope.row.parkOutTime) |string2Date(7)}} </span>
  80 + </template>
65 81 </el-table-column>
66 82 <el-table-column
67   - prop="duration"
  83 + prop="parkingDuration"
68 84 label="停车时长"
69 85 :show-overflow-tooltip="true">
  86 + <template slot-scope="scope">
  87 + <span>{{(scope.row) |parkingDurationFormatter(scope.row.parkingDuration)}} </span>
  88 + </template>
70 89 </el-table-column>
71 90 <el-table-column
72   - prop="berthNum"
  91 + prop="berthNo"
73 92 label="泊位编号">
74 93 </el-table-column>
75 94 <el-table-column
76   - prop="status"
  95 + prop="orderState"
77 96 label="订单状态">
  97 + <template slot-scope="scope">
  98 + <span>{{(scope.row) |inOutStateFormatter}} </span>
  99 + </template>
78 100 </el-table-column>
79 101 </el-table>
80 102 <el-pagination
81 103 :page-size="10"
82 104 :pager-count="11"
83 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 112 </el-pagination>
86 113 </div>
87 114 </div>
88 115 </template>
89 116  
90 117 <script>
  118 + import {queryOwnerParkRecord} from '@/api/index';
  119 + import {fen2Yuan,string2Date,inOutStateFormatter,parkingDurationFormatter} from '@/filters/index';
91 120 export default {
92 121 data() {
93 122 return {
94 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 129 currentPage: 1,
106 130 pageSize: 10,
107 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 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 186 onSubmit() {
183   - this.$message('submit!')
  187 + this.queryOwnerParkRecord();
184 188 },
185 189 onCancel() {
186 190 this.$message({
... ...
src/views/payback/index.vue
... ... @@ -4,6 +4,16 @@
4 4 <el-row :gutter="20">
5 5 <el-form ref="form" :model="form" label-width="60px" label-position="left">
6 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 17 <el-form-item label="车牌">
8 18 <el-input v-model="form.name" maxlength="10" />
9 19 </el-form-item>
... ... @@ -16,162 +26,295 @@
16 26 </div>
17 27  
18 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 37 <el-table
21 38 :data="orderData"
22 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 45 <el-table-column
25   - prop="parkName"
  46 + prop="plName"
26 47 label="停车场"
27 48 :show-overflow-tooltip="true">
28 49 </el-table-column>
29 50 <el-table-column
30   - prop="license"
  51 + prop="carNumber"
31 52 label="车牌"
32 53 :show-overflow-tooltip="true">
33 54 </el-table-column>
34 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 61 </el-table-column>
38 62 <el-table-column
39   - prop="inTime"
40   - label="进场时间"
  63 + prop="parkInTime"
  64 + label="入场时间"
41 65 :show-overflow-tooltip="true">
  66 + <template slot-scope="scope">
  67 + <span>{{(scope.row.parkInTime) |string2Date(7)}} </span>
  68 + </template>
42 69 </el-table-column>
43 70 <el-table-column
44   - prop="outTime"
  71 + prop="parkOutTime"
45 72 label="出场时间"
46 73 :show-overflow-tooltip="true">
  74 + <template slot-scope="scope">
  75 + <span>{{(scope.row.parkOutTime) |string2Date(7)}} </span>
  76 + </template>
47 77 </el-table-column>
48 78 <el-table-column
49   - prop="duration"
  79 + prop="parkingDuration"
50 80 label="停车时长"
51 81 :show-overflow-tooltip="true">
  82 + <template slot-scope="scope">
  83 + <span>{{(scope.row) |parkingDurationFormatter(scope.row.parkingDuration)}} </span>
  84 + </template>
52 85 </el-table-column>
53 86 <el-table-column
54   - prop="berthNum"
  87 + prop="berthNo"
55 88 label="泊位编号">
56 89 </el-table-column>
57 90 <el-table-column
58   - prop="status"
  91 + prop="orderState"
59 92 label="订单状态">
  93 + <template slot-scope="scope">
  94 + <span>{{(scope.row) |inOutStateFormatter}} </span>
  95 + </template>
60 96 </el-table-column>
61 97 </el-table>
62 98 <el-pagination
63 99 :page-size="10"
64 100 :pager-count="11"
65 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 108 </el-pagination>
68 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 128 </div>
70 129 </template>
71 130  
72 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 318 </script>
176 319  
177 320 <style scoped>
... ...
vue.config.js
... ... @@ -21,7 +21,7 @@ module.exports = {
21 21 * In most cases please use '/' !!!
22 22 * Detail: https://cli.vuejs.org/config/#publicpath
23 23 */
24   - publicPath: '/',
  24 + publicPath: './',
25 25 outputDir: 'dist',
26 26 assetsDir: 'static',
27 27 lintOnSave: process.env.NODE_ENV === 'development',
... ...