Fedex / imac-vue

Go to a project
Toggle navigation Toggle navigation pinning
Elements-SY
e656ba18 1 parent 1591f834

modify

Expand all
Inline Side-by-side
Showing 11 changed files with 454 additions and 38 deletions
...@@ -10,7 +10,7 @@ ...@@ -10,7 +10,7 @@
10 </div> 10 </div>
11 </transition-group> 11 </transition-group>
12 </template> 12 </template>
13 - 13 +
14 <script> 14 <script>
15 // draggable 属性规定元素是否可拖动 15 // draggable 属性规定元素是否可拖动
16 // dragstart 事件在用户开始拖动元素或选择的文本时触发 16 // dragstart 事件在用户开始拖动元素或选择的文本时触发
...@@ -77,14 +77,14 @@ export default { ...@@ -77,14 +77,14 @@ export default {
77 } 77 }
78 } 78 }
79 </script> 79 </script>
80 - 80 +
81 <style lang="scss" scoped> 81 <style lang="scss" scoped>
82 .container { 82 .container {
83 max-width: 350px; 83 max-width: 350px;
84 height: 150px; 84 height: 150px;
85 overflow-y: scroll; 85 overflow-y: scroll;
86 padding: 0; 86 padding: 0;
87 - border: 1px solid #ccc; 87 + border: 1px solid #e7eaec;
88 88
89 &::-webkit-scrollbar { 89 &::-webkit-scrollbar {
90 width: 7px; 90 width: 7px;
...@@ -121,4 +121,4 @@ export default { ...@@ -121,4 +121,4 @@ export default {
121 .item:hover { 121 .item:hover {
122 background-color: #c6e2ff; 122 background-color: #c6e2ff;
123 } 123 }
124 -</style>
...\ No newline at end of file ...\ No newline at end of file
124 +</style>
......
1 +<template>
2 + <el-card>
3 + <div class="row">
4 + <div class="col-6">
5 + <draggable class="list-group" tag="ul" v-model="list" v-bind="dragOptions" @start="drag = true"
6 + @end="drag = false">
7 + <transition-group type="transition" :name="!drag ? 'flip-list' : null">
8 + <li class="list-group-item" v-for="element in list" :key="element.order">
9 + <i :class="element.fixed ? 'fa fa-anchor' : 'glyphicon glyphicon-pushpin'
10 + " @click="element.fixed = !element.fixed" aria-hidden="true"></i>
11 + {{ element.name }}
12 + </li>
13 + </transition-group>
14 + </draggable>
15 + </div>
16 + </div>
17 + </el-card>
18 +</template>
19 +
20 +<script>
21 +import draggable from "vuedraggable";
22 +const message = [
23 + "vue.draggable",
24 + "draggable",
25 + "component",
26 + "for",
27 + "vue.js 2.0",
28 + "based",
29 + "on",
30 + "Sortablejs"
31 +];
32 +export default {
33 + name: "transition-example-2",
34 + display: "Transitions",
35 + order: 7,
36 + components: {
37 + draggable
38 + },
39 + data() {
40 + return {
41 + list: message.map((name, index) => {
42 + return { name, order: index + 1 };
43 + }),
44 + drag: false
45 + };
46 + },
47 + methods: {
48 + sort() {
49 + this.list = this.list.sort((a, b) => a.order - b.order);
50 + }
51 + },
52 + computed: {
53 + dragOptions() {
54 + return {
55 + animation: 200,
56 + group: "description",
57 + disabled: false,
58 + ghostClass: "ghost"
59 + };
60 + }
61 + }
62 +};
63 +</script>
64 +
65 +<style lang="scss">
66 +.el-card__body {
67 + padding: 15px 10px 0px 10px !important;
68 +}
69 +.list-group {
70 + min-height: 20px;
71 + max-height: 150px;
72 + overflow: auto;
73 + margin-top: 0;
74 + padding: 0;
75 +
76 + &::-webkit-scrollbar {
77 + width: 7px;
78 + height: 7px;
79 + }
80 +
81 + &::-webkit-scrollbar-track {
82 + background-color: #fff;
83 + }
84 +
85 + &::-webkit-scrollbar-thumb {
86 + background-color: #ccc;
87 + border-radius: 20px;
88 + }
89 +
90 + &::-webkit-scrollbar-thumb:hover {
91 + background-color: #409eff;
92 + }
93 +
94 + &::-webkit-scrollbar-track-piece {
95 + background: #F2F6FC;
96 + }
97 +}
98 +
99 +.list-group-item {
100 + cursor: move;
101 + padding: 5px 0px;
102 +}
103 +
104 +.list-group-item i {
105 + cursor: pointer;
106 +}
107 +</style>
...@@ -41,6 +41,7 @@ ...@@ -41,6 +41,7 @@
41 :rules="item.rules" 41 :rules="item.rules"
42 :label-width="item.labelWidth" 42 :label-width="item.labelWidth"
43 > 43 >
44 + <slot v-if="item.type === 'slot'"></slot>
44 <!-- 输入框 --> 45 <!-- 输入框 -->
45 <el-input 46 <el-input
46 v-if="item.type === 'Input'" 47 v-if="item.type === 'Input'"
......
...@@ -87,6 +87,15 @@ export const constantRoutes = [ ...@@ -87,6 +87,15 @@ export const constantRoutes = [
87 meta: { title: "错误信息提示", icon: "user" }, 87 meta: { title: "错误信息提示", icon: "user" },
88 }, 88 },
89 { 89 {
90 + path: "/routeInfo",
91 + component: (resolve) =>
92 + require([
93 + "@/views/allocationConfig/flightAllocConfig/routeInfo",
94 + ], resolve),
95 + name: "routeInfo",
96 + meta: { title: "航班配舱", icon: "user" },
97 + },
98 + {
90 path: "/info/:handle/id=:id;routeStatus=:routeStatus;fltNo=:fltNo;route=:route;fltDate=:fltDate;status=:status", 99 path: "/info/:handle/id=:id;routeStatus=:routeStatus;fltNo=:fltNo;route=:route;fltDate=:fltDate;status=:status",
91 component: (resolve) => 100 component: (resolve) =>
92 require(["@/views/allocationConfig/flightAllocConfig/info"], resolve), 101 require(["@/views/allocationConfig/flightAllocConfig/info"], resolve),
......
...@@ -494,16 +494,18 @@ export function removeDuplicates(arr, keys) { ...@@ -494,16 +494,18 @@ export function removeDuplicates(arr, keys) {
494 if (typeof keys == "string") return result; 494 if (typeof keys == "string") return result;
495 // 排序 495 // 排序
496 if (typeof keys == "object") { 496 if (typeof keys == "object") {
497 - if (keys.sortType.toLowerCase().trim() == "number") { 497 + if (keys.sort) {
498 - if (result.repeat.length) { 498 + if (keys.sortType.toLowerCase().trim() == "number") {
499 - result.repeat = sortFn("repeat"); 499 + if (result.repeat.length) {
500 - } 500 + result.repeat = sortFn("repeat");
501 - if (result.unique.length) { 501 + }
502 - result.unique = sortFn("unique"); 502 + if (result.unique.length) {
503 + result.unique = sortFn("unique");
504 + }
505 + // 返回排序去重结果
503 } 506 }
504 - // 返回排序去重结果
505 - return result;
506 } 507 }
508 + return result;
507 } 509 }
508 // 排序方法 510 // 排序方法
509 function sortFn(attr) { 511 function sortFn(attr) {
......
...@@ -173,16 +173,18 @@ export const inputBlurValidate = { ...@@ -173,16 +173,18 @@ export const inputBlurValidate = {
173 this.$refs.minWeight.innerHTML = ""; 173 this.$refs.minWeight.innerHTML = "";
174 this.$refs.minWeight.innerHTML = "最小重量不得大于最大重量"; 174 this.$refs.minWeight.innerHTML = "最小重量不得大于最大重量";
175 } 175 }
176 - } else if (this.queryForm[weight] > 34) { 176 + }
177 - this.validateForm = false; 177 + // else if (this.queryForm[weight] > 34) {
178 - if (Array.isArray(this.$refs.minWeight)) { 178 + // this.validateForm = false;
179 - this.msgError("最大重量不能大于34KG"); 179 + // if (Array.isArray(this.$refs.minWeight)) {
180 - } else { 180 + // this.msgError("最大重量不能大于34KG");
181 - this.validateForm = false; 181 + // } else {
182 - this.$refs.minWeight.innerHTML = ""; 182 + // this.validateForm = false;
183 - this.$refs.minWeight.innerHTML = "最大重量不能大于34KG"; 183 + // this.$refs.minWeight.innerHTML = "";
184 - } 184 + // this.$refs.minWeight.innerHTML = "最大重量不能大于34KG";
185 - } else { 185 + // }
186 + // }
187 + else {
186 if (!Array.isArray(this.$refs.minWeight)) { 188 if (!Array.isArray(this.$refs.minWeight)) {
187 this.validateForm = true; 189 this.validateForm = true;
188 this.$refs.minWeight.innerHTML = ""; 190 this.$refs.minWeight.innerHTML = "";
......
1 +export const formConfig = [
2 + {
3 + label: "航班号",
4 + type: "Input",
5 + name: "fltNo",
6 + prop: "fltNo",
7 + placeholder: "请输入航班号",
8 + span: 5,
9 + trigger: "blur",
10 + labelWidth: "55px",
11 + },
12 + {
13 + label: "航班日期",
14 + type: "Date",
15 + name: "startTime",
16 + prop: "startTime",
17 + placeholder: "请选择航班日期",
18 + format: "yyyy-MM-dd",
19 + colWidth: "23%",
20 + inputWidth: "100%",
21 + },
22 + {
23 + label: "航线",
24 + type: "Input",
25 + name: "route",
26 + prop: "route",
27 + placeholder: "",
28 + span: 5,
29 + labelWidth: "40px",
30 + trigger: "blur", // 事件名
31 + },
32 + {
33 + label: "航线优先级",
34 + type: "slot",
35 + name: "flightRoute",
36 + prop: "flightRoute",
37 + placeholder: "",
38 + colWidth: "23%",
39 + labelWidth: "85px",
40 + trigger: "blur", // 事件名
41 + },
42 +];
43 +// 航线规则表单
44 +export const routeRuleForm = {
45 + flightRoute: "", // 飞行航线
46 + location: "", // 包含始发站
47 + notLocation: "", // 不包含始发站
48 + destinationSite: "", // 包含目的站
49 + notDestinationSite: "", // 不包含目的站
50 + includeUrsa: "", // URSA包含
51 + notIncludeUrsa: "", // URSA不包含
52 + minNumOfPieces: "", // 最小件数
53 + maxNumOfPieces: "", // 最大件数
54 + minWeight: "", // 最小重量
55 + maxWeight: "", // 最大重量
56 + typeOfGoods: "", // 申报类别
57 + cargoType: "", // 货物类型
58 + puporpuxCode: "", // 取件扫描号
59 + serviceCode: "", // Service Code
60 + handlingCode: "", // Handling Code
61 + subCategory: "", // Sub Category
62 +}
...@@ -50,11 +50,10 @@ ...@@ -50,11 +50,10 @@
50 <template slot="optionColumn"> 50 <template slot="optionColumn">
51 <el-table-column label="操作" align="center" width="150"> 51 <el-table-column label="操作" align="center" width="150">
52 <template slot-scope="scope"> 52 <template slot-scope="scope">
53 - <el-button type="text" size="mini" icon="el-icon-view" 53 + <el-button type="text" size="mini" icon="el-icon-view" @click="handleClick(scope.row, 'view')">查看
54 - @click="handleClick(scope.row.purposeOfFlightNo, 'detail', scope.row.ruleDate, scope.row.status)">查看
55 </el-button> 54 </el-button>
56 <el-button type="text" size="mini" icon="el-icon-edit" v-hasPermi="['allocation:alloc:update']" 55 <el-button type="text" size="mini" icon="el-icon-edit" v-hasPermi="['allocation:alloc:update']"
57 - @click="handleClick(scope.row.purposeOfFlightNo, 'update', scope.row.ruleDate, scope.row.status)">修改 56 + @click="handleClick(scope.row, 'edit')">修改
58 </el-button> 57 </el-button>
59 <!-- <el-button type="text" size="mini" icon="el-icon-delete" style="color:#ff4949" 58 <!-- <el-button type="text" size="mini" icon="el-icon-delete" style="color:#ff4949"
60 v-hasPermi="['allocation:alloc:delete']" @click="del(scope.row.id, scope.row.status)">删除</el-button> 59 v-hasPermi="['allocation:alloc:delete']" @click="del(scope.row.id, scope.row.status)">删除</el-button>
...@@ -144,21 +143,31 @@ export default { ...@@ -144,21 +143,31 @@ export default {
144 }) 143 })
145 }, 144 },
146 //跳转到查看，修改页面 145 //跳转到查看，修改页面
147 - handleClick(fltNo, handle, fltDate, status) { 146 + handleClick({ purposeOfFlightNo, ruleDate, flightRoute, status }, name) {
148 - let obj = {
149 - id: ' ',
150 - handle: handle,
151 - fltNo: fltNo,
152 - fltDate: fltDate != null ? fltDate : ' ',
153 - route: ' ',
154 - routeStatus: 'FlightAllocConfig',
155 - status: status == '3' ? '3' : ' ',
156 - createStatus: 1
157 - }
158 this.$router.push({ 147 this.$router.push({
159 - name: "FlightAllocConfigInfo", 148 + path: "/routeInfo",
160 - params: obj, 149 + query: {
150 + purposeOfFlightNo: purposeOfFlightNo,
151 + flightDate: ruleDate,
152 + flightRoute: flightRoute,
153 + status: status,
154 + name: name,
155 + },
161 }); 156 });
157 + // let obj = {
158 + // id: ' ',
159 + // handle: handle,
160 + // fltNo: fltNo,
161 + // fltDate: fltDate != null ? fltDate : ' ',
162 + // route: ' ',
163 + // routeStatus: 'FlightAllocConfig',
164 + // status: status == '3' ? '3' : ' ',
165 + // createStatus: 1
166 + // }
167 + // this.$router.push({
168 + // name: "FlightAllocConfigInfo",
169 + // params: obj,
170 + // });
162 }, 171 },
163 //航班优先级修改 172 //航班优先级修改
164 toRouteOrder(val) { 173 toRouteOrder(val) {
......
This diff is collapsed. Click to expand it.
1 +<template>
2 + <div ref="barEcharts" class="route-info-container">
3 + <!-- 航线设置规则信息查询条件 -->
4 + <el-row style="padding: 0 50px">
5 + <el-col>
6 + <yl-form ref="ruleForm" :formConfig="formConfig" :queryForm="queryForm" :inline="false" formWidth="auto"
7 + @blur="blurEvent">
8 + <yl-draggable></yl-draggable>
9 + </yl-form>
10 + </el-col>
11 + </el-row>
12 + <!-- 航线设置规则信息 -->
13 + <el-row>
14 + <el-col :span="24">
15 + <el-divider content-position="left">航线维度设置</el-divider>
16 + </el-col>
17 + <el-col>
18 + <route-info :routesInfo="routesInfo" :cargoType="cargoType" :cargoStatus="cargoStatus" :puporpux="puporpux"
19 + :serviceCode="serviceCode" :handlingCode="handlingCode" :subCategory="subCategory" @collapse="collapseChange"
20 + @location="changeLocation" @destinationSite="changeDestinationSite" @cargoType="changeCargoType"
21 + @cargoStatus="changeCargoStatus" @puporpux="changePuporpux" @serviceCode="changeServiceCode"
22 + @handlingCode="changeHandlingCode" @subCategory="changeSubCategory" @addRlue="addRlue">
23 + </route-info>
24 + </el-col>
25 + </el-row>
26 + </div>
27 +</template>
28 +<script>
29 +import YlForm from "@/components/YlForm";
30 +import RouteInfo from "./components/routeInfo";
31 +import YlDraggable from "@/components/YlDraggable";
32 +import { formConfig, routeRuleForm } from "./formConfig";
33 +import { removeDuplicates, filterRepeat } from "@/utils"
34 +import {
35 + allDictData, // 获取全部字典
36 + findDestinationFltRuleByFlightNo, // 航线维度设置详情
37 + findByFlightId, // 通过id查询目的航班维度配置详情
38 + updateOrAddFlight, // 修改
39 + delFlightId, // 删除航线规则配置
40 + enableOrDisable, // 是否停用/开启航线规则配置
41 + batchUpdateOrAddFlight, // 更新航线优先级
42 + queryRouteByFltNo, // 通过航班号查询航线
43 +} from "@/api/destinationFlight";
44 +import { routeData, routeInfo } from "./routeData";
45 +export default {
46 + components: {
47 + YlForm,
48 + RouteInfo,
49 + YlDraggable,
50 + },
51 + data() {
52 + return {
53 + formConfig: formConfig, // 表单配置项
54 + queryForm: {
55 + // 表单参数
56 + },
57 + routesInfo: [], // 航线规则信息
58 + cargoType: [], // 申报类别
59 + cargoStatus: [], // 货物类型
60 + puporpux: [], // 取件扫描号
61 + serviceCode: [], // Service Code
62 + handlingCode: [], // Handling Code
63 + subCategory: [], // Sub Category
64 + };
65 + },
66 + computed: {},
67 + created() {
68 + this.getAllDictData(); // 获取全部字典
69 + if (this.$route.query.name == "view" || this.$route.query.name == "edit") {
70 + let parmas = {
71 + flightDate: this.$route.query.flightDate, // 航班日期
72 + flightRoute: "", // 航线
73 + flightRouteListStr: "", //
74 + purposeOfFlightNo: this.$route.query.purposeOfFlightNo, // 原航班号
75 + status: "", //
76 + };
77 + // 日期级别
78 + if (this.$route.query.flightDate) {
79 + delete parmas.flightRouteListStr
80 + this.getFlightRouteConfigInfoDetail(parmas)
81 + } else {
82 + // 普通级别
83 + this.getFlightRouteConfigInfoDetail(parmas)
84 + }
85 + console.log(this.$route.query);
86 + }
87 + },
88 + mounted() { },
89 + methods: {
90 + // 获取所有数据字典
91 + getAllDictData() {
92 + allDictData()
93 + .then((res) => {
94 + if (res.code != 200) {
95 + this.msgError(res.msg);
96 + return;
97 + }
98 + // 给checkBox表单赋值做展示信息
99 + const { data } = res;
100 + this.cargoType = data.cargoType; // 申报类别
101 + this.cargoStatus = data.cargoStatus; // 货物类型
102 + this.puporpux = data.puporpux; // 取件扫描号
103 + this.serviceCode = data.serviceCode; // Service Code
104 + this.handlingCode = data.handlingCode; // Handling Code
105 + this.subCategory = data.subCategory; // Sub Category
106 + })
107 + .catch(() => { });
108 + },
109 + // 航线维度设置详情
110 + getFlightRouteConfigInfoDetail(parmas) {
111 + findDestinationFltRuleByFlightNo(parmas)
112 + .then((res) => {
113 + const { code, data, msg } = res;
114 + if (code != 200) {
115 + this.msgError(msg);
116 + return;
117 + }
118 + let routeList1 = data.routeList; // 航班航线基本信息
119 + let { flightDate } = parmas;
120 + // 如果是日期级别的再做一次没有日期的查询
121 + if (flightDate) {
122 + parmas.flightDate = "";
123 + parmas.flightRouteListStr = "",
124 + findDestinationFltRuleByFlightNo(parmas).then(response => {
125 + if (response.code != 200) {
126 + this.msgError(response.msg);
127 + return;
128 + }
129 + let routeList2 = response.data.routeList; // 航班航线基本信息
130 +
131 + /*
132 + 日期级别；
133 + 日期级别只拿日期级别的航线，但是日期级别的航线没有数据则去查询没有日期的航班信息，
134 + 然后拿没有日期的航班维度信息；
135 +
136 + */
137 + // 日期级别航班航线维度规则详情
138 + const dataList1 = removeDuplicates(data.list, {
139 + duplicate: "flightRoute", // 去重字段
140 + sort: false, // 是否要排序
141 + sortType: "Number", // 排序类型
142 + sortAttr: "routePriority", // 排序字段
143 + });
144 + // 普通级别航班航线维度规则详情
145 + const dataList2 = removeDuplicates(response.data.list, {
146 + duplicate: "flightRoute", // 去重字段
147 + sort: false, // 是否要排序
148 + sortType: "Number", // 排序类型
149 + sortAttr: "routePriority", // 排序字段
150 + });
151 + // 先把日期级别的数据合并，然后再对遍历普通级别的dataList2；
152 + // 看看
153 + // console.log(dataList1)
154 + // console.log(dataList2)
155 + const newRouteList1 = routeList1.filter((item, index, array) => {
156 + if(item.route == dataList1.unique[index].flightRoute){
157 + console.log(array)
158 + }
159 + });
160 + console.log(newRouteList1)
161 +
162 + }).catch(() => { });
163 + }
164 +
165 + // console.log(routeList2);
166 + // 如果当前航班号的航线下没有数据给这个航线在list里面追加一个data属性，值设置为false
167 + // 当点击新增规则按钮往这个routesInfo push数据并且把data属性值设置为true
168 + })
169 + .catch(() => { });
170 + },
171 + // 失焦事件
172 + blurEvent({ originOfFlightNo }) {
173 + this.queryForm.originOfFlightNo = this.upCase(originOfFlightNo);
174 + },
175 + // 当前激活面板改变时触发
176 + collapseChange(name) {
177 + console.log(name);
178 + },
179 + // 始发站
180 + changeLocation(val) {
181 + console.log("始发站：", val);
182 + },
183 + // 目的站
184 + changeDestinationSite(val) {
185 + console.log("目的站：", val);
186 + },
187 + // 申报类别
188 + changeCargoType(arr) {
189 + console.log("申报类别：", arr);
190 + },
191 + // 货物类型
192 + changeCargoStatus(arr) {
193 + console.log("货物类型：", arr);
194 + },
195 + // 取件扫描号
196 + changePuporpux(arr) {
197 + console.log("取件扫描号：", arr);
198 + },
199 + // Service Code
200 + changeServiceCode(arr) {
201 + console.log("Service Code：", arr);
202 + },
203 + // Handling Code
204 + changeHandlingCode(arr) {
205 + console.log("Handling Code：", arr);
206 + },
207 + // Sub Category
208 + changeSubCategory(arr) {
209 + console.log("Sub Category：", arr);
210 + },
211 + // 新增规则
212 + addRlue(index) {
213 + // 如果当前航班号的航线下没有数据给
214 + this.routesInfo.push(routeRuleForm); // 给新增规则赋上默认数据
215 + console.log("新增规则：", index);
216 + },
217 + },
218 +};
219 +</script>
220 +<style lang="scss" scoped>
221 +.route-info-container {
222 + padding: 20px;
223 +}
224 +</style>