提交
Showing
27 changed files
with
692 additions
and
38 deletions
package-lock.json
0 → 100644
This diff could not be displayed because it is too large.
... | @@ -19,6 +19,7 @@ | ... | @@ -19,6 +19,7 @@ |
19 | "vant": "^2.12.48", | 19 | "vant": "^2.12.48", |
20 | "vue": "^2.7.8", | 20 | "vue": "^2.7.8", |
21 | "vue-router": "^3.5.4", | 21 | "vue-router": "^3.5.4", |
22 | "vuedraggable": "^2.24.3", | ||
22 | "vuex": "^3.6.2" | 23 | "vuex": "^3.6.2" |
23 | }, | 24 | }, |
24 | "devDependencies": { | 25 | "devDependencies": { | ... | ... |
... | @@ -10,7 +10,7 @@ | ... | @@ -10,7 +10,7 @@ |
10 | <link href="<%= htmlWebpackPlugin.options.cdn.css[i] %>" rel="preload" as="style" /> | 10 | <link href="<%= htmlWebpackPlugin.options.cdn.css[i] %>" rel="preload" as="style" /> |
11 | <link href="<%= htmlWebpackPlugin.options.cdn.css[i] %>" rel="stylesheet" /> | 11 | <link href="<%= htmlWebpackPlugin.options.cdn.css[i] %>" rel="stylesheet" /> |
12 | <% } %> --> | 12 | <% } %> --> |
13 | <title><%= webpackConfig.name %></title> | 13 | <title>demo</title> |
14 | </head> | 14 | </head> |
15 | <body> | 15 | <body> |
16 | <noscript> | 16 | <noscript> | ... | ... |
1 | const api = { | 1 | const api = { |
2 | Login: '/user/login', | 2 | Login: '/user/login', |
3 | UserInfo: '/user/userinfo', | 3 | UserInfo: '/user/userinfo', |
4 | UserName: '/user/name' | 4 | UserName: '/user/name', |
5 | plan: 'apis/api', | ||
6 | session: 'session/os/oauth/token' | ||
5 | } | 7 | } |
6 | 8 | ||
7 | export default api | 9 | export default api | ... | ... |
... | @@ -30,3 +30,35 @@ export function getUserName(params) { | ... | @@ -30,3 +30,35 @@ export function getUserName(params) { |
30 | hideloading: true | 30 | hideloading: true |
31 | }) | 31 | }) |
32 | } | 32 | } |
33 | |||
34 | // 规划 | ||
35 | export function getPlan(data, params) { | ||
36 | return request({ | ||
37 | url: api.plan, | ||
38 | method: 'post', | ||
39 | data, | ||
40 | params, | ||
41 | hideloading: true | ||
42 | }) | ||
43 | } | ||
44 | // 规划2 | ||
45 | export function getPlan2(data, params) { | ||
46 | return request({ | ||
47 | url: api.plan, | ||
48 | method: 'post', | ||
49 | data, | ||
50 | params, | ||
51 | hideloading: true | ||
52 | }) | ||
53 | } | ||
54 | |||
55 | // 获取session | ||
56 | export function getSession(params, data) { | ||
57 | return request({ | ||
58 | url: api.session, | ||
59 | method: 'post', | ||
60 | params, | ||
61 | data, | ||
62 | headers: { 'Content-Type': 'application/x-www-form-urlencoded' }, | ||
63 | }) | ||
64 | } | ... | ... |
... | @@ -2,14 +2,14 @@ | ... | @@ -2,14 +2,14 @@ |
2 | // 清除浮动 | 2 | // 清除浮动 |
3 | @mixin clearfix { | 3 | @mixin clearfix { |
4 | &:after { | 4 | &:after { |
5 | content: ""; | 5 | content: ''; |
6 | display: table; | 6 | display: table; |
7 | clear: both; | 7 | clear: both; |
8 | } | 8 | } |
9 | } | 9 | } |
10 | 10 | ||
11 | // 多行隐藏 | 11 | // 多行隐藏 |
12 | @mixin textoverflow($clamp:1) { | 12 | @mixin textoverflow($clamp: 1) { |
13 | display: block; | 13 | display: block; |
14 | overflow: hidden; | 14 | overflow: hidden; |
15 | text-overflow: ellipsis; | 15 | text-overflow: ellipsis; |
... | @@ -19,9 +19,26 @@ | ... | @@ -19,9 +19,26 @@ |
19 | /*! autoprefixer: ignore next */ | 19 | /*! autoprefixer: ignore next */ |
20 | -webkit-box-orient: vertical; | 20 | -webkit-box-orient: vertical; |
21 | } | 21 | } |
22 | 22 | .city { | |
23 | font-family: '微软雅黑'; | ||
24 | background: rgba(0, 0, 0, 0); | ||
25 | width: 249px; | ||
26 | height: 60px; | ||
27 | font-size: 36px; | ||
28 | text-align: center; | ||
29 | border: 1px #1a1a1a solid; | ||
30 | border-radius: 5px; | ||
31 | } | ||
32 | .text-button { | ||
33 | border: none; | ||
34 | background-color: transparent; | ||
35 | color: #328985; | ||
36 | font-size: 24px; | ||
37 | text-decoration: underline; | ||
38 | cursor: pointer; | ||
39 | } | ||
23 | //flex box | 40 | //flex box |
24 | @mixin flexbox($jc:space-between, $ai:center, $fd:row, $fw:nowrap) { | 41 | @mixin flexbox($jc: space-between, $ai: center, $fd: row, $fw: nowrap) { |
25 | display: flex; | 42 | display: flex; |
26 | display: -webkit-flex; | 43 | display: -webkit-flex; |
27 | flex: 1; | 44 | flex: 1; |
... | @@ -34,3 +51,25 @@ | ... | @@ -34,3 +51,25 @@ |
34 | flex-wrap: $fw; | 51 | flex-wrap: $fw; |
35 | -webkit-flex-wrap: $fw; | 52 | -webkit-flex-wrap: $fw; |
36 | } | 53 | } |
54 | /*定义滚动条高宽及背景 | ||
55 | 高宽分别对应横竖滚动条的尺寸*/ | ||
56 | ::-webkit-scrollbar { | ||
57 | width: 16px; | ||
58 | height: 16px; | ||
59 | background-color: #f5f5f5; | ||
60 | z-index: 999; | ||
61 | } | ||
62 | /*定义滚动条轨道 | ||
63 | 内阴影+圆角*/ | ||
64 | ::-webkit-scrollbar-track { | ||
65 | -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3); | ||
66 | border-radius: 10px; | ||
67 | background-color: #f5f5f5; | ||
68 | } | ||
69 | /*定义滑块 | ||
70 | 内阴影+圆角*/ | ||
71 | ::-webkit-scrollbar-thumb { | ||
72 | border-radius: 10px; | ||
73 | -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3); | ||
74 | background-color: #555; | ||
75 | } | ... | ... |
src/components/Table.vue
0 → 100644
1 | <template> | ||
2 | <div class="vant-table"> | ||
3 | <table cellspacing="0" class="table" :style="{ width: width }"> | ||
4 | <vuedraggable v-model="orginData" :options="{ draggable: this.vuedraggable }" @start="onStart" @end="onEnd"> | ||
5 | <tr slot="header"> | ||
6 | <th class="th" v-if="showCheck"> | ||
7 | <input | ||
8 | type="checkbox" | ||
9 | id="j_cbAll" | ||
10 | :checked="isAllSelected" | ||
11 | @change="selectAllRows" | ||
12 | v-model="isAllSelected" | ||
13 | /> | ||
14 | </th> | ||
15 | <th class="th" v-for="(item, index) in option.column" :key="index" :style="{ width: item.width }"> | ||
16 | {{ item.label }} | ||
17 | </th> | ||
18 | </tr> | ||
19 | <tr | ||
20 | v-for="item in orginData" | ||
21 | :key="item.rowNo" | ||
22 | class="list-tr" | ||
23 | @click="handleRowClick(item)" | ||
24 | :class="{ 'selected-row': item.isClick }" | ||
25 | > | ||
26 | <td v-if="showCheck"> | ||
27 | <input type="checkbox" :checked="item.isSelected" v-model="item.isSelected" @change="selectRow(item)" /> | ||
28 | </td> | ||
29 | <td | ||
30 | v-for="(context, i) in option.column" | ||
31 | :key="i" | ||
32 | :style="[ | ||
33 | item[context.tableDataprop] === '已去' ? { color: 'green' } : {}, | ||
34 | item.type === 'new' ? { color: 'red' } : {}, | ||
35 | { textAlign: context.align }, | ||
36 | { width: context.width } | ||
37 | ]" | ||
38 | > | ||
39 | <slot :name="context.tableDataprop" :item="item"> <span v-html="item[context.tableDataprop]"></span></slot> | ||
40 | <!-- <slot :name="opreate" :item="item"></slot> --> | ||
41 | </td> | ||
42 | </tr> | ||
43 | </vuedraggable> | ||
44 | </table> | ||
45 | <div style="margin: 15px 15px"></div> | ||
46 | </div> | ||
47 | </template> | ||
48 | <script> | ||
49 | import vuedraggable from 'vuedraggable' | ||
50 | import _ from 'lodash' | ||
51 | export default { | ||
52 | name: 'TableVant', | ||
53 | components: { vuedraggable }, | ||
54 | props: { | ||
55 | bgcolor: { | ||
56 | type: Object | ||
57 | }, | ||
58 | width: { | ||
59 | type: String | ||
60 | }, | ||
61 | tableData: { | ||
62 | type: Array | ||
63 | }, | ||
64 | filterTable: { | ||
65 | type: Array | ||
66 | }, | ||
67 | delTable: { | ||
68 | type: Array | ||
69 | }, | ||
70 | option: { | ||
71 | type: Object | ||
72 | }, | ||
73 | showCheck: { | ||
74 | type: Boolean, | ||
75 | default: false | ||
76 | }, | ||
77 | vuedraggable: { | ||
78 | type: String | ||
79 | }, | ||
80 | rowClick: { | ||
81 | type: Boolean, | ||
82 | default: false | ||
83 | } | ||
84 | }, | ||
85 | watch: { | ||
86 | tableData: { | ||
87 | handler: function () { | ||
88 | this.orginData = _.cloneDeep(this.tableData) || [] | ||
89 | }, | ||
90 | deep: true, | ||
91 | immediate: true | ||
92 | }, | ||
93 | filterTable: { | ||
94 | handler: function () { | ||
95 | this.filterData = _.cloneDeep(this.filterTable) || [] | ||
96 | this.filterFlag = this.filterData.length > 0 ? true : false | ||
97 | }, | ||
98 | deep: true, | ||
99 | immediate: true | ||
100 | }, | ||
101 | delTable: { | ||
102 | handler: function () { | ||
103 | this.delData = _.cloneDeep(this.delTable) || [] | ||
104 | this.deleteFlag = this.delData.length > 0 ? true : false | ||
105 | }, | ||
106 | deep: true, | ||
107 | immediate: true | ||
108 | } | ||
109 | }, | ||
110 | data() { | ||
111 | return { | ||
112 | orginData: [], | ||
113 | filterData: [], | ||
114 | delData: [], | ||
115 | filterFlag: false, | ||
116 | deleteFlag: false, | ||
117 | isAllSelected: false, | ||
118 | selectedRows: [] | ||
119 | } | ||
120 | }, | ||
121 | created() {}, | ||
122 | mounted() {}, | ||
123 | methods: { | ||
124 | onStart() { | ||
125 | this.drag = true | ||
126 | console.log('1', this.orginData) | ||
127 | }, | ||
128 | handleRowClick(data) { | ||
129 | if (this.rowClick) { | ||
130 | this.orginData = this.orginData.map(item => { | ||
131 | item.isClick = false | ||
132 | return item | ||
133 | }) | ||
134 | this.$set(data, 'isClick', true) | ||
135 | this.$bus.$emit('rowData', data) | ||
136 | } | ||
137 | }, | ||
138 | onEnd() { | ||
139 | this.drag = false | ||
140 | console.log('2', this.orginData) | ||
141 | this.$bus.$emit('sortTableData', this.orginData) | ||
142 | }, | ||
143 | selectAllRows() { | ||
144 | if (this.isAllSelected) { | ||
145 | this.selectedRows = [...this.orginData] | ||
146 | this.orginData.forEach(item => { | ||
147 | this.$set(item, 'isSelected', true) | ||
148 | }) | ||
149 | } else { | ||
150 | this.selectedRows = [] | ||
151 | this.orginData.forEach(item => { | ||
152 | this.$set(item, 'isSelected', false) | ||
153 | }) | ||
154 | } | ||
155 | this.selectedRows = this.isAllSelected ? this.orginData : [] | ||
156 | this.$bus.$emit('selecte', this.selectedRows) | ||
157 | console.log(this.selectedRows) | ||
158 | }, | ||
159 | selectRow() { | ||
160 | this.selectedRows = this.orginData.filter(row => row.isSelected) | ||
161 | this.isAllSelected = this.selectedRows.length === this.orginData.length | ||
162 | this.$bus.$emit('selecte', this.selectedRows) | ||
163 | console.log(this.selectedRows) | ||
164 | } | ||
165 | } | ||
166 | } | ||
167 | </script> | ||
168 | |||
169 | <style scoped> | ||
170 | .selected-row { | ||
171 | background-color: yellow; | ||
172 | } | ||
173 | .vant-table { | ||
174 | margin-top: 20px; | ||
175 | } | ||
176 | |||
177 | table { | ||
178 | border-radius: 0.185185rem; | ||
179 | border-collapse: collapse; | ||
180 | /* 合并边框,美化表格样式 */ | ||
181 | table-layout: fixed; | ||
182 | table-layout: fixed; | ||
183 | width: 100%; | ||
184 | } | ||
185 | |||
186 | .table { | ||
187 | border-radius: 0.185185rem; | ||
188 | border-collapse: collapse; | ||
189 | /* 合并边框,美化表格样式 */ | ||
190 | table-layout: fixed; | ||
191 | display: flex; | ||
192 | table-layout: fixed; | ||
193 | word-wrap: break-word; | ||
194 | word-break: break-all; | ||
195 | } | ||
196 | |||
197 | th, | ||
198 | td { | ||
199 | border: 1px solid black; | ||
200 | /* 添加边框,美化表格样式 */ | ||
201 | padding: 1px; | ||
202 | /* 添加内边距,使内容与边框有一定距离 */ | ||
203 | } | ||
204 | |||
205 | .th { | ||
206 | height: 1.074074rem; | ||
207 | line-height: 1.074074rem; | ||
208 | background-color: #328985; | ||
209 | color: white; | ||
210 | text-align: center; | ||
211 | font-size: 24px; | ||
212 | } | ||
213 | |||
214 | td { | ||
215 | white-space: pre-wrap; | ||
216 | } | ||
217 | |||
218 | table tr { | ||
219 | margin-bottom: 10px; | ||
220 | /* 调整间距大小 */ | ||
221 | } | ||
222 | |||
223 | .filter-tr, | ||
224 | .list-tr { | ||
225 | height: 1.074074rem; | ||
226 | line-height: 1.074074rem; | ||
227 | font-size: 24px; | ||
228 | } | ||
229 | |||
230 | .filter-tr:last-child { | ||
231 | margin-bottom: 10px; | ||
232 | } | ||
233 | |||
234 | tr > td:nth-child(1) { | ||
235 | text-align: center; | ||
236 | } | ||
237 | |||
238 | .del-text { | ||
239 | font-size: 24px; | ||
240 | font-weight: bold; | ||
241 | } | ||
242 | </style> |
... | @@ -2,7 +2,7 @@ | ... | @@ -2,7 +2,7 @@ |
2 | module.exports = { | 2 | module.exports = { |
3 | title: 'vue-h5-template', | 3 | title: 'vue-h5-template', |
4 | baseUrl: 'http://localhost:9018', // 项目地址 | 4 | baseUrl: 'http://localhost:9018', // 项目地址 |
5 | baseApi: 'https://test.xxx.com/api', // 本地api请求地址,注意:如果你使用了代理,请设置成'/' | 5 | baseApi: '/', // 本地api请求地址,注意:如果你使用了代理,请设置成'/' |
6 | APPID: 'xxx', | 6 | APPID: 'xxx', |
7 | APPSECRET: 'xxx', | 7 | APPSECRET: 'xxx', |
8 | $cdn: 'https://www.sunniejs.cn/static' | 8 | $cdn: 'https://www.sunniejs.cn/static' | ... | ... |
... | @@ -2,7 +2,7 @@ | ... | @@ -2,7 +2,7 @@ |
2 | module.exports = { | 2 | module.exports = { |
3 | title: 'vue-h5-template', | 3 | title: 'vue-h5-template', |
4 | baseUrl: 'https://www.xxx.com/', // 正式项目地址 | 4 | baseUrl: 'https://www.xxx.com/', // 正式项目地址 |
5 | baseApi: 'https://www.xxx.com/api', // 正式api请求地址 | 5 | baseApi: 'https://tsapi.amap.com', // 正式api请求地址 |
6 | APPID: 'xxx', | 6 | APPID: 'xxx', |
7 | APPSECRET: 'xxx', | 7 | APPSECRET: 'xxx', |
8 | $cdn: 'https://www.sunniejs.cn/static' | 8 | $cdn: 'https://www.sunniejs.cn/static' | ... | ... |
1 | module.exports = { | 1 | module.exports = { |
2 | title: 'vue-h5-template', | 2 | title: 'vue-h5-template', |
3 | baseUrl: 'https://test.xxx.com', // 测试项目地址 | 3 | baseUrl: 'https://test.xxx.com', // 测试项目地址 |
4 | baseApi: 'https://test.xxx.com/api', // 测试api请求地址 | 4 | baseApi: 'https://tsapi.amap.com', // 测试api请求地址 |
5 | APPID: 'xxx', | 5 | APPID: 'xxx', |
6 | APPSECRET: 'xxx', | 6 | APPSECRET: 'xxx', |
7 | $cdn: 'https://www.sunniejs.cn/static' | 7 | $cdn: 'https://www.sunniejs.cn/static' | ... | ... |
... | @@ -2,7 +2,7 @@ | ... | @@ -2,7 +2,7 @@ |
2 | *格式化时间 | 2 | *格式化时间 |
3 | *yyyy-MM-dd hh:mm:ss | 3 | *yyyy-MM-dd hh:mm:ss |
4 | */ | 4 | */ |
5 | export function formatDate(time, fmt) { | 5 | export function formatDate(time, fmt = 'yyyy-MM-dd') { |
6 | if (time === undefined || '') { | 6 | if (time === undefined || '') { |
7 | return | 7 | return |
8 | } | 8 | } | ... | ... |
... | @@ -2,12 +2,13 @@ | ... | @@ -2,12 +2,13 @@ |
2 | // https://github.com/zloirock/core-js/blob/master/docs/2019-03-19-core-js-3-babel-and-a-look-into-the-future.md#babelpolyfill | 2 | // https://github.com/zloirock/core-js/blob/master/docs/2019-03-19-core-js-3-babel-and-a-look-into-the-future.md#babelpolyfill |
3 | import 'core-js/stable' | 3 | import 'core-js/stable' |
4 | import 'regenerator-runtime/runtime' | 4 | import 'regenerator-runtime/runtime' |
5 | |||
6 | import Vue from 'vue' | 5 | import Vue from 'vue' |
7 | import App from './App.vue' | 6 | import App from './App.vue' |
8 | import router from './router' | 7 | import router from './router' |
9 | import store from './store' | 8 | import store from './store' |
9 | import Bus from '../src/utils/bus' //这是我的路径,正确引用你们的路径 | ||
10 | 10 | ||
11 | Vue.prototype.$bus = Bus | ||
11 | // 设置 js中可以访问 $cdn | 12 | // 设置 js中可以访问 $cdn |
12 | import { $cdn } from '@/config' | 13 | import { $cdn } from '@/config' |
13 | Vue.prototype.$cdn = $cdn | 14 | Vue.prototype.$cdn = $cdn | ... | ... |
1 | // 按需全局引入 vant组件 | 1 | // 按需全局引入 vant组件 |
2 | import Vue from 'vue' | 2 | import Vue from 'vue' |
3 | import { Button, List, Cell, Tabbar, TabbarItem } from 'vant' | 3 | import { |
4 | Button, | ||
5 | List, | ||
6 | Cell, | ||
7 | Tabbar, | ||
8 | TabbarItem, | ||
9 | Col, | ||
10 | Row, | ||
11 | Divider, | ||
12 | NavBar, | ||
13 | Toast, | ||
14 | Field, | ||
15 | DatetimePicker, | ||
16 | Dialog, | ||
17 | CellGroup | ||
18 | } from 'vant' | ||
4 | Vue.use(Button) | 19 | Vue.use(Button) |
5 | Vue.use(Cell) | 20 | Vue.use(Cell) |
6 | Vue.use(List) | 21 | Vue.use(List) |
7 | Vue.use(Tabbar).use(TabbarItem) | 22 | Vue.use(Tabbar) |
23 | .use(TabbarItem) | ||
24 | .use(Col) | ||
25 | .use(Row) | ||
26 | .use(Divider) | ||
27 | .use(NavBar) | ||
28 | .use(Toast) | ||
29 | .use(Field) | ||
30 | .use(DatetimePicker) | ||
31 | .use(Dialog) | ||
32 | .use(CellGroup) | ... | ... |
... | @@ -6,7 +6,7 @@ export const constantRouterMap = [ | ... | @@ -6,7 +6,7 @@ export const constantRouterMap = [ |
6 | { | 6 | { |
7 | path: '/', | 7 | path: '/', |
8 | component: () => import('@/views/layouts/index'), | 8 | component: () => import('@/views/layouts/index'), |
9 | redirect: '/home', | 9 | redirect: '/departure', |
10 | meta: { | 10 | meta: { |
11 | title: '首页', | 11 | title: '首页', |
12 | keepAlive: false | 12 | keepAlive: false |
... | @@ -23,6 +23,30 @@ export const constantRouterMap = [ | ... | @@ -23,6 +23,30 @@ export const constantRouterMap = [ |
23 | name: 'About', | 23 | name: 'About', |
24 | component: () => import('@/views/home/about'), | 24 | component: () => import('@/views/home/about'), |
25 | meta: { title: '关于我', keepAlive: false } | 25 | meta: { title: '关于我', keepAlive: false } |
26 | }, | ||
27 | { | ||
28 | path: '/departure', | ||
29 | name: 'Departure', | ||
30 | component: () => import('@/views/home/departure'), | ||
31 | meta: { title: '出发列表', keepAlive: false } | ||
32 | }, | ||
33 | { | ||
34 | path: '/result', | ||
35 | name: 'Result', | ||
36 | component: () => import('@/views/home/result'), | ||
37 | meta: { title: '规划结果', keepAlive: false } | ||
38 | }, | ||
39 | { | ||
40 | path: '/target', | ||
41 | name: 'Target', | ||
42 | component: () => import('@/views/home/target'), | ||
43 | meta: { title: '目的列表', keepAlive: false } | ||
44 | }, | ||
45 | { | ||
46 | path: '/about1', | ||
47 | name: 'About1', | ||
48 | component: () => import('@/views/home/about1'), | ||
49 | meta: { title: '关于我', keepAlive: false } | ||
26 | } | 50 | } |
27 | ] | 51 | ] |
28 | } | 52 | } | ... | ... |
1 | const getters = { | 1 | const getters = { |
2 | userName: state => state.app.userName | 2 | getOrder: function (state) { |
3 | if (!state.order) { | ||
4 | state.order = JSON.parse(localStorage.getItem('order')) | ||
5 | } | ||
6 | return state.order | ||
7 | }, | ||
8 | getCity: function (state) { | ||
9 | if (!state.city) { | ||
10 | state.city = localStorage.getItem('city') | ||
11 | } | ||
12 | return state.order | ||
13 | }, | ||
14 | getdepart: function (state) { | ||
15 | if (!state.depart) { | ||
16 | state.depart = JSON.parse(localStorage.getItem('depart')) | ||
17 | } | ||
18 | return state.depart | ||
19 | }, | ||
20 | getTarget: function (state) { | ||
21 | if (!state.target) { | ||
22 | state.target = JSON.parse(localStorage.getItem('target')) | ||
23 | } | ||
24 | return state.target | ||
25 | }, | ||
26 | getCurentData: function (state) { | ||
27 | if (!state.curentData) { | ||
28 | state.curentData = JSON.parse(localStorage.getItem('curentData')) | ||
29 | } | ||
30 | return state.curentData | ||
31 | } | ||
3 | } | 32 | } |
4 | export default getters | 33 | export default getters | ... | ... |
1 | const state = { | 1 | const state = { |
2 | userName: '' | 2 | order: localStorage.getItem('order') ? localStorage.getItem('order') : '', |
3 | city: localStorage.getItem('city') ? localStorage.getItem('city') : '', | ||
4 | depart: localStorage.getItem('depart') ? localStorage.getItem('depart') : '', | ||
5 | target: localStorage.getItem('target') ? localStorage.getItem('target') : '', | ||
6 | curentData: localStorage.getItem('curentData') ? localStorage.getItem('curentData') : '' | ||
3 | } | 7 | } |
4 | const mutations = { | 8 | const mutations = { |
5 | SET_USER_NAME(state, name) { | 9 | SET_ORDER(state, info) { |
6 | state.userName = name | 10 | state.order = info |
11 | localStorage.setItem('order', info) | ||
12 | }, | ||
13 | SET_CITY(state, info) { | ||
14 | state.city = info | ||
15 | localStorage.setItem('city', info) | ||
16 | }, | ||
17 | SET_DEPART(state, info) { | ||
18 | state.depart = info | ||
19 | localStorage.setItem('depart', info) | ||
20 | }, | ||
21 | SET_TARGET(state, info) { | ||
22 | state.target = info | ||
23 | localStorage.setItem('target', info) | ||
24 | }, | ||
25 | SET_CURENTDATA(state, info) { | ||
26 | state.target = info | ||
27 | localStorage.setItem('curentData', info) | ||
7 | } | 28 | } |
8 | } | 29 | } |
9 | const actions = { | 30 | const actions = { |
10 | // 设置name | 31 | // 设置name |
11 | setUserName({ commit }, name) { | 32 | setOrder({ commit }, info) { |
12 | commit('SET_USER_NAME', name) | 33 | commit('SET_ORDER', info) |
34 | }, | ||
35 | // 设置城市 | ||
36 | setCity({ commit }, info) { | ||
37 | commit('SET_CITY', info) | ||
38 | }, | ||
39 | // 设置城市 | ||
40 | setDepart({ commit }, info) { | ||
41 | commit('SET_DEPART', info) | ||
42 | }, | ||
43 | // 设置城市 | ||
44 | setTarget({ commit }, info) { | ||
45 | commit('SET_TARGET', info) | ||
46 | }, | ||
47 | // 设置城市 | ||
48 | setCurentData({ commit }, info) { | ||
49 | commit('SET_CURENTDATA', info) | ||
13 | } | 50 | } |
14 | } | 51 | } |
15 | export default { | 52 | export default { | ... | ... |
src/utils/bus.js
0 → 100644
... | @@ -6,8 +6,8 @@ import { baseApi } from '@/config' | ... | @@ -6,8 +6,8 @@ import { baseApi } from '@/config' |
6 | // create an axios instance | 6 | // create an axios instance |
7 | const service = axios.create({ | 7 | const service = axios.create({ |
8 | baseURL: baseApi, // url = base api url + request url | 8 | baseURL: baseApi, // url = base api url + request url |
9 | withCredentials: true, // send cookies when cross-domain requests | 9 | withCredentials: true // send cookies when cross-domain requests |
10 | timeout: 5000 // request timeout | 10 | // timeout: 5000 // request timeout |
11 | }) | 11 | }) |
12 | 12 | ||
13 | // request拦截器 request interceptor | 13 | // request拦截器 request interceptor |
... | @@ -34,8 +34,8 @@ service.interceptors.request.use( | ... | @@ -34,8 +34,8 @@ service.interceptors.request.use( |
34 | // respone拦截器 | 34 | // respone拦截器 |
35 | service.interceptors.response.use( | 35 | service.interceptors.response.use( |
36 | response => { | 36 | response => { |
37 | Toast.clear() | ||
38 | const res = response.data | 37 | const res = response.data |
38 | Toast.clear() | ||
39 | if (res.status && res.status !== 200) { | 39 | if (res.status && res.status !== 200) { |
40 | // 登录超时,重新登录 | 40 | // 登录超时,重新登录 |
41 | if (res.status === 401) { | 41 | if (res.status === 401) { | ... | ... |
This diff is collapsed.
Click to expand it.
src/views/home/about1.vue
0 → 100644
This diff is collapsed.
Click to expand it.
src/views/home/departure.vue
0 → 100644
This diff is collapsed.
Click to expand it.
This diff is collapsed.
Click to expand it.
src/views/home/result.vue
0 → 100644
1 | <template> | ||
2 | <div> | ||
3 | <div class="title"> | ||
4 | <van-row type="flex" style="margin-top: 15px" justify="space-around"> | ||
5 | <van-col span="24" class="header-text" style="display: flex"> | ||
6 | <van-cell-group> | ||
7 | 城市: | ||
8 | <select name="pets" id="pet-select" v-model="city" class="city" @change="cityChage($event)"> | ||
9 | <option v-for="item in cityOptions" :key="item.value" :value="item.value">{{ item.label }}</option> | ||
10 | </select> | ||
11 | </van-cell-group> | ||
12 | </van-col> | ||
13 | </van-row> | ||
14 | </div> | ||
15 | <div style="width: 100%; overflow-x: auto"> | ||
16 | <Table-vant :option="option" :tableData="resultData" width="790px"> | ||
17 | <template v-slot:startTime="{ item }"> | ||
18 | <div>{{ item.startTime | formatDate('hh:mm:ss') }}</div> | ||
19 | </template> | ||
20 | <template v-slot:lastArrivalTime="{ item }"> | ||
21 | <div>{{ item.lastArrivalTime | formatDate('hh:mm:ss') }}</div> | ||
22 | </template> | ||
23 | <template v-slot:opreate="{ item }"> | ||
24 | <button class="text-button" @click="geDetail(item)">详情</button> | ||
25 | </template> | ||
26 | </Table-vant> | ||
27 | </div> | ||
28 | </div> | ||
29 | </template> | ||
30 | <script> | ||
31 | import TableVant from '@/components/Table.vue' | ||
32 | import { getPlan, getSession } from '@/api/user.js' | ||
33 | import { Toast } from 'vant' | ||
34 | import _ from 'lodash' | ||
35 | export default { | ||
36 | name: '', | ||
37 | props: {}, | ||
38 | components: { TableVant }, | ||
39 | data() { | ||
40 | return { | ||
41 | city: '', | ||
42 | targetData: [], | ||
43 | departureData: [], | ||
44 | cityOptions: [ | ||
45 | { label: '济南', value: '济南' }, | ||
46 | { label: '德州', value: '德州' }, | ||
47 | { label: '聊城', value: '聊城' } | ||
48 | ], | ||
49 | resultData: [ | ||
50 | { | ||
51 | address: '', | ||
52 | batch: '', | ||
53 | coordinate: '', | ||
54 | dateTime: '', | ||
55 | hospital: '', | ||
56 | pkgs: '', | ||
57 | rowNo: '1', | ||
58 | status: '', | ||
59 | stopTime: '' | ||
60 | } | ||
61 | ], | ||
62 | option: { | ||
63 | column: [ | ||
64 | { | ||
65 | label: '序号', | ||
66 | tableDataprop: 'rowNo', | ||
67 | width: '50px', | ||
68 | align: 'center' | ||
69 | }, | ||
70 | { | ||
71 | label: '取件人', | ||
72 | tableDataprop: 'name', | ||
73 | width: '50px' | ||
74 | }, | ||
75 | { | ||
76 | label: '规划路线', | ||
77 | tableDataprop: 'path', | ||
78 | width: '300px' | ||
79 | }, | ||
80 | { | ||
81 | label: '总里程', | ||
82 | tableDataprop: 'totalDistance', | ||
83 | width: '80px' | ||
84 | }, | ||
85 | { | ||
86 | label: '总耗时', | ||
87 | tableDataprop: 'totalTimes', | ||
88 | width: '80px' | ||
89 | }, | ||
90 | { | ||
91 | label: '出发时间', | ||
92 | tableDataprop: 'startTime', | ||
93 | width: '80px' | ||
94 | }, | ||
95 | { | ||
96 | label: '回程时间', | ||
97 | tableDataprop: 'lastArrivalTime', | ||
98 | width: '80px' | ||
99 | }, | ||
100 | { | ||
101 | label: '操作', | ||
102 | tableDataprop: 'opreate', | ||
103 | width: '80px', | ||
104 | align: 'center' | ||
105 | } | ||
106 | ] | ||
107 | } | ||
108 | } | ||
109 | }, | ||
110 | computed: {}, | ||
111 | watch: {}, | ||
112 | methods: { | ||
113 | geDetail(e) { | ||
114 | this.$store.dispatch('setCurentData', JSON.stringify(e)) | ||
115 | this.$router.push({ path: '/about1', query: { data: JSON.stringify(e) } }) | ||
116 | console.log(e) | ||
117 | }, | ||
118 | getSessionId() { | ||
119 | let params = { | ||
120 | client_id: 'dd48c515fcde43bea0b5bd0b8f77e119', | ||
121 | grant_type: 'client_credentials', | ||
122 | client_secret: 'c6602114c9ba488b877d0d84b0e5e700', | ||
123 | scope: 'read' | ||
124 | } | ||
125 | getSession(params, {}).then(res => { | ||
126 | this.accessToken = res.access_token | ||
127 | this.initData([...this.departureData, ...this.targetData]) | ||
128 | }) | ||
129 | }, | ||
130 | // 请求数据案例 | ||
131 | initData(list) { | ||
132 | Toast.loading({ | ||
133 | duration: 0 | ||
134 | }) | ||
135 | console.log('123', list) | ||
136 | let arr = _.cloneDeep(list) | ||
137 | const data = { | ||
138 | region: this.city, | ||
139 | plate: '', | ||
140 | departure: '', | ||
141 | arrival: '', | ||
142 | departureDate: '06:30', | ||
143 | customerData: arr | ||
144 | } | ||
145 | const params = { | ||
146 | method: 'GetRouteMatrix_test', | ||
147 | format: 'json', | ||
148 | sessionId: this.accessToken, | ||
149 | sign: '203EF639BA15A6E001B59DB78AB81470B7893CAF', | ||
150 | appKey: 'dd48c515fcde43bea0b5bd0b8f77e119', | ||
151 | v: '1.0' | ||
152 | } | ||
153 | getPlan(data, params) | ||
154 | .then(res => { | ||
155 | Toast.clear() | ||
156 | let newArr = JSON.parse(res).returnModel | ||
157 | console.log('返回的数据', newArr) | ||
158 | newArr.forEach(item => { | ||
159 | item.data.forEach((e, index) => { | ||
160 | e.distance = e.distance.toFixed(2) | ||
161 | e.hospital = e.returnName | ||
162 | e.status = '未去' | ||
163 | e.coordinate = e.destination | ||
164 | e.isOrigin = 'N' | ||
165 | if (index == item.data.length - 1) { | ||
166 | e.pkgs = 0 | ||
167 | } else { | ||
168 | e.pkgs = 100 | ||
169 | } | ||
170 | // e.distance.toFixed(2) | ||
171 | }) | ||
172 | item.data.pop() | ||
173 | }) | ||
174 | this.resultData = newArr | ||
175 | console.log('aaaaa', this.resultData) | ||
176 | |||
177 | let arrs = this.resultData | ||
178 | arrs.forEach((item, index) => { | ||
179 | item.rowNo = index + 1 | ||
180 | }) | ||
181 | }) | ||
182 | .catch(() => {}) | ||
183 | } | ||
184 | }, | ||
185 | created() { | ||
186 | this.city = this.$store.state.app.city | ||
187 | this.targetData = this.$store.getters.getTarget | ||
188 | this.departureData = JSON.parse(this.$store.state.app.depart) | ||
189 | this.resultData = JSON.parse(this.$store.state.app.order) | ||
190 | }, | ||
191 | mounted() {} | ||
192 | } | ||
193 | </script> | ||
194 | <style lang="scss" scoped> | ||
195 | .header-text { | ||
196 | font-size: 36px; | ||
197 | font-weight: 800; | ||
198 | } | ||
199 | </style> |
src/views/home/target.vue
0 → 100644
This diff is collapsed.
Click to expand it.
1 | <template> | 1 | <template> |
2 | <div class="app-container"> | 2 | <div class="app-container"> |
3 | <van-nav-bar left-text="返回" left-arrow @click-left="onClickLeft" @click-right="onClickRight" /> | ||
3 | <div class="layout-content"> | 4 | <div class="layout-content"> |
4 | <keep-alive v-if="$route.meta.keepAlive"> | 5 | <keep-alive v-if="$route.meta.keepAlive"> |
5 | <router-view></router-view> | 6 | <router-view></router-view> |
6 | </keep-alive> | 7 | </keep-alive> |
7 | <router-view v-else></router-view> | 8 | <router-view v-else></router-view> |
8 | </div> | 9 | </div> |
9 | <div class="layout-footer"> | 10 | <!-- <div class="layout-footer"> |
10 | <TabBar :data="tabbars" @change="handleChange" /> | 11 | <TabBar :data="tabbars" @change="handleChange" /> |
11 | </div> | 12 | </div> --> |
12 | </div> | 13 | </div> |
13 | </template> | 14 | </template> |
14 | 15 | ||
... | @@ -42,7 +43,13 @@ export default { | ... | @@ -42,7 +43,13 @@ export default { |
42 | methods: { | 43 | methods: { |
43 | handleChange(v) { | 44 | handleChange(v) { |
44 | console.log('tab value:', v) | 45 | console.log('tab value:', v) |
45 | } | 46 | }, |
47 | onClickLeft() { | ||
48 | this.$router.go(-1) | ||
49 | }, | ||
50 | onClickRight() { | ||
51 | Toast('按钮'); | ||
52 | }, | ||
46 | } | 53 | } |
47 | } | 54 | } |
48 | </script> | 55 | </script> | ... | ... |
... | @@ -53,18 +53,29 @@ module.exports = defineConfig({ | ... | @@ -53,18 +53,29 @@ module.exports = defineConfig({ |
53 | warnings: false, | 53 | warnings: false, |
54 | errors: true | 54 | errors: true |
55 | } | 55 | } |
56 | }, | ||
57 | headers: { | ||
58 | 'Access-Control-Allow-Origin': '*' | ||
59 | }, | ||
60 | proxy: { | ||
61 | //配置跨域 | ||
62 | '/session': { | ||
63 | target: 'http://117.78.47.109:8180', | ||
64 | // ws:true, | ||
65 | changOrigin: true, | ||
66 | pathRewrite: { | ||
67 | '^/session': '' | ||
68 | } | ||
69 | }, | ||
70 | '/apis': { | ||
71 | target: 'http://117.78.47.109:9081', | ||
72 | // ws:true, | ||
73 | changOrigin: true, | ||
74 | pathRewrite: { | ||
75 | '^/apis': '' | ||
76 | } | ||
77 | } | ||
56 | } | 78 | } |
57 | // proxy: { | ||
58 | // //配置跨域 | ||
59 | // '/api': { | ||
60 | // target: "https://test.xxx.com", | ||
61 | // // ws:true, | ||
62 | // changOrigin:true, | ||
63 | // pathRewrite:{ | ||
64 | // '^/api':'/' | ||
65 | // } | ||
66 | // } | ||
67 | // } | ||
68 | }, | 79 | }, |
69 | css: { | 80 | css: { |
70 | extract: IS_PROD, // 是否将组件中的 CSS 提取至一个独立的 CSS 文件中 (而不是动态注入到 JavaScript 中的 inline 代码)。 | 81 | extract: IS_PROD, // 是否将组件中的 CSS 提取至一个独立的 CSS 文件中 (而不是动态注入到 JavaScript 中的 inline 代码)。 | ... | ... |
This diff could not be displayed because it is too large.
-
Please register or sign in to post a comment