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 @@
</div>
</transition-group>
</template>
<script>
// draggable 属性规定元素是否可拖动
// dragstart 事件在用户开始拖动元素或选择的文本时触发
......@@ -77,14 +77,14 @@ export default {
}
}
</script>
<style lang="scss" scoped>
.container {
max-width: 350px;
height: 150px;
overflow-y: scroll;
padding: 0;
border: 1px solid #ccc;
border: 1px solid #e7eaec;
&::-webkit-scrollbar {
width: 7px;
......@@ -121,4 +121,4 @@ export default {
.item:hover {
background-color: #c6e2ff;
}
</style>
\ No newline at end of file
</style>
......
<template>
<el-card>
<div class="row">
<div class="col-6">
<draggable class="list-group" tag="ul" v-model="list" v-bind="dragOptions" @start="drag = true"
@end="drag = false">
<transition-group type="transition" :name="!drag ? 'flip-list' : null">
<li class="list-group-item" v-for="element in list" :key="element.order">
<i :class="element.fixed ? 'fa fa-anchor' : 'glyphicon glyphicon-pushpin'
" @click="element.fixed = !element.fixed" aria-hidden="true"></i>
{{ element.name }}
</li>
</transition-group>
</draggable>
</div>
</div>
</el-card>
</template>
<script>
import draggable from "vuedraggable";
const message = [
"vue.draggable",
"draggable",
"component",
"for",
"vue.js 2.0",
"based",
"on",
"Sortablejs"
];
export default {
name: "transition-example-2",
display: "Transitions",
order: 7,
components: {
draggable
},
data() {
return {
list: message.map((name, index) => {
return { name, order: index + 1 };
}),
drag: false
};
},
methods: {
sort() {
this.list = this.list.sort((a, b) => a.order - b.order);
}
},
computed: {
dragOptions() {
return {
animation: 200,
group: "description",
disabled: false,
ghostClass: "ghost"
};
}
}
};
</script>
<style lang="scss">
.el-card__body {
padding: 15px 10px 0px 10px !important;
}
.list-group {
min-height: 20px;
max-height: 150px;
overflow: auto;
margin-top: 0;
padding: 0;
&::-webkit-scrollbar {
width: 7px;
height: 7px;
}
&::-webkit-scrollbar-track {
background-color: #fff;
}
&::-webkit-scrollbar-thumb {
background-color: #ccc;
border-radius: 20px;
}
&::-webkit-scrollbar-thumb:hover {
background-color: #409eff;
}
&::-webkit-scrollbar-track-piece {
background: #F2F6FC;
}
}
.list-group-item {
cursor: move;
padding: 5px 0px;
}
.list-group-item i {
cursor: pointer;
}
</style>
......@@ -41,6 +41,7 @@
:rules="item.rules"
:label-width="item.labelWidth"
>
<slot v-if="item.type === 'slot'"></slot>
<!-- 输入框 -->
<el-input
v-if="item.type === 'Input'"
......
......@@ -87,6 +87,15 @@ export const constantRoutes = [
meta: { title: "错误信息提示", icon: "user" },
},
{
path: "/routeInfo",
component: (resolve) =>
require([
"@/views/allocationConfig/flightAllocConfig/routeInfo",
], resolve),
name: "routeInfo",
meta: { title: "航班配舱", icon: "user" },
},
{
path: "/info/:handle/id=:id;routeStatus=:routeStatus;fltNo=:fltNo;route=:route;fltDate=:fltDate;status=:status",
component: (resolve) =>
require(["@/views/allocationConfig/flightAllocConfig/info"], resolve),
......
......@@ -494,16 +494,18 @@ export function removeDuplicates(arr, keys) {
if (typeof keys == "string") return result;
// 排序
if (typeof keys == "object") {
if (keys.sortType.toLowerCase().trim() == "number") {
if (result.repeat.length) {
result.repeat = sortFn("repeat");
}
if (result.unique.length) {
result.unique = sortFn("unique");
if (keys.sort) {
if (keys.sortType.toLowerCase().trim() == "number") {
if (result.repeat.length) {
result.repeat = sortFn("repeat");
}
if (result.unique.length) {
result.unique = sortFn("unique");
}
// 返回排序去重结果
}
// 返回排序去重结果
return result;
}
return result;
}
// 排序方法
function sortFn(attr) {
......
......@@ -173,16 +173,18 @@ export const inputBlurValidate = {
this.$refs.minWeight.innerHTML = "";
this.$refs.minWeight.innerHTML = "最小重量不得大于最大重量";
}
} else if (this.queryForm[weight] > 34) {
this.validateForm = false;
if (Array.isArray(this.$refs.minWeight)) {
this.msgError("最大重量不能大于34KG");
} else {
this.validateForm = false;
this.$refs.minWeight.innerHTML = "";
this.$refs.minWeight.innerHTML = "最大重量不能大于34KG";
}
} else {
}
// else if (this.queryForm[weight] > 34) {
// this.validateForm = false;
// if (Array.isArray(this.$refs.minWeight)) {
// this.msgError("最大重量不能大于34KG");
// } else {
// this.validateForm = false;
// this.$refs.minWeight.innerHTML = "";
// this.$refs.minWeight.innerHTML = "最大重量不能大于34KG";
// }
// }
else {
if (!Array.isArray(this.$refs.minWeight)) {
this.validateForm = true;
this.$refs.minWeight.innerHTML = "";
......
export const formConfig = [
{
label: "航班号",
type: "Input",
name: "fltNo",
prop: "fltNo",
placeholder: "请输入航班号",
span: 5,
trigger: "blur",
labelWidth: "55px",
},
{
label: "航班日期",
type: "Date",
name: "startTime",
prop: "startTime",
placeholder: "请选择航班日期",
format: "yyyy-MM-dd",
colWidth: "23%",
inputWidth: "100%",
},
{
label: "航线",
type: "Input",
name: "route",
prop: "route",
placeholder: "",
span: 5,
labelWidth: "40px",
trigger: "blur", // 事件名
},
{
label: "航线优先级",
type: "slot",
name: "flightRoute",
prop: "flightRoute",
placeholder: "",
colWidth: "23%",
labelWidth: "85px",
trigger: "blur", // 事件名
},
];
// 航线规则表单
export const routeRuleForm = {
flightRoute: "", // 飞行航线
location: "", // 包含始发站
notLocation: "", // 不包含始发站
destinationSite: "", // 包含目的站
notDestinationSite: "", // 不包含目的站
includeUrsa: "", // URSA包含
notIncludeUrsa: "", // URSA不包含
minNumOfPieces: "", // 最小件数
maxNumOfPieces: "", // 最大件数
minWeight: "", // 最小重量
maxWeight: "", // 最大重量
typeOfGoods: "", // 申报类别
cargoType: "", // 货物类型
puporpuxCode: "", // 取件扫描号
serviceCode: "", // Service Code
handlingCode: "", // Handling Code
subCategory: "", // Sub Category
}
......@@ -50,11 +50,10 @@
<template slot="optionColumn">
<el-table-column label="操作" align="center" width="150">
<template slot-scope="scope">
<el-button type="text" size="mini" icon="el-icon-view"
@click="handleClick(scope.row.purposeOfFlightNo, 'detail', scope.row.ruleDate, scope.row.status)">查看
<el-button type="text" size="mini" icon="el-icon-view" @click="handleClick(scope.row, 'view')">查看
</el-button>
<el-button type="text" size="mini" icon="el-icon-edit" v-hasPermi="['allocation:alloc:update']"
@click="handleClick(scope.row.purposeOfFlightNo, 'update', scope.row.ruleDate, scope.row.status)">修改
@click="handleClick(scope.row, 'edit')">修改
</el-button>
<!-- <el-button type="text" size="mini" icon="el-icon-delete" style="color:#ff4949"
v-hasPermi="['allocation:alloc:delete']" @click="del(scope.row.id, scope.row.status)">删除</el-button>
......@@ -144,21 +143,31 @@ export default {
})
},
//跳转到查看，修改页面
handleClick(fltNo, handle, fltDate, status) {
let obj = {
id: ' ',
handle: handle,
fltNo: fltNo,
fltDate: fltDate != null ? fltDate : ' ',
route: ' ',
routeStatus: 'FlightAllocConfig',
status: status == '3' ? '3' : ' ',
createStatus: 1
}
handleClick({ purposeOfFlightNo, ruleDate, flightRoute, status }, name) {
this.$router.push({
name: "FlightAllocConfigInfo",
params: obj,
path: "/routeInfo",
query: {
purposeOfFlightNo: purposeOfFlightNo,
flightDate: ruleDate,
flightRoute: flightRoute,
status: status,
name: name,
},
});
// let obj = {
// id: ' ',
// handle: handle,
// fltNo: fltNo,
// fltDate: fltDate != null ? fltDate : ' ',
// route: ' ',
// routeStatus: 'FlightAllocConfig',
// status: status == '3' ? '3' : ' ',
// createStatus: 1
// }
// this.$router.push({
// name: "FlightAllocConfigInfo",
// params: obj,
// });
},
//航班优先级修改
toRouteOrder(val) {
......
This diff is collapsed. Click to expand it.
<template>
<div ref="barEcharts" class="route-info-container">
<!-- 航线设置规则信息查询条件 -->
<el-row style="padding: 0 50px">
<el-col>
<yl-form ref="ruleForm" :formConfig="formConfig" :queryForm="queryForm" :inline="false" formWidth="auto"
@blur="blurEvent">
<yl-draggable></yl-draggable>
</yl-form>
</el-col>
</el-row>
<!-- 航线设置规则信息 -->
<el-row>
<el-col :span="24">
<el-divider content-position="left">航线维度设置</el-divider>
</el-col>
<el-col>
<route-info :routesInfo="routesInfo" :cargoType="cargoType" :cargoStatus="cargoStatus" :puporpux="puporpux"
:serviceCode="serviceCode" :handlingCode="handlingCode" :subCategory="subCategory" @collapse="collapseChange"
@location="changeLocation" @destinationSite="changeDestinationSite" @cargoType="changeCargoType"
@cargoStatus="changeCargoStatus" @puporpux="changePuporpux" @serviceCode="changeServiceCode"
@handlingCode="changeHandlingCode" @subCategory="changeSubCategory" @addRlue="addRlue">
</route-info>
</el-col>
</el-row>
</div>
</template>
<script>
import YlForm from "@/components/YlForm";
import RouteInfo from "./components/routeInfo";
import YlDraggable from "@/components/YlDraggable";
import { formConfig, routeRuleForm } from "./formConfig";
import { removeDuplicates, filterRepeat } from "@/utils"
import {
allDictData, // 获取全部字典
findDestinationFltRuleByFlightNo, // 航线维度设置详情
findByFlightId, // 通过id查询目的航班维度配置详情
updateOrAddFlight, // 修改
delFlightId, // 删除航线规则配置
enableOrDisable, // 是否停用/开启航线规则配置
batchUpdateOrAddFlight, // 更新航线优先级
queryRouteByFltNo, // 通过航班号查询航线
} from "@/api/destinationFlight";
import { routeData, routeInfo } from "./routeData";
export default {
components: {
YlForm,
RouteInfo,
YlDraggable,
},
data() {
return {
formConfig: formConfig, // 表单配置项
queryForm: {
// 表单参数
},
routesInfo: [], // 航线规则信息
cargoType: [], // 申报类别
cargoStatus: [], // 货物类型
puporpux: [], // 取件扫描号
serviceCode: [], // Service Code
handlingCode: [], // Handling Code
subCategory: [], // Sub Category
};
},
computed: {},
created() {
this.getAllDictData(); // 获取全部字典
if (this.$route.query.name == "view" || this.$route.query.name == "edit") {
let parmas = {
flightDate: this.$route.query.flightDate, // 航班日期
flightRoute: "", // 航线
flightRouteListStr: "", //
purposeOfFlightNo: this.$route.query.purposeOfFlightNo, // 原航班号
status: "", //
};
// 日期级别
if (this.$route.query.flightDate) {
delete parmas.flightRouteListStr
this.getFlightRouteConfigInfoDetail(parmas)
} else {
// 普通级别
this.getFlightRouteConfigInfoDetail(parmas)
}
console.log(this.$route.query);
}
},
mounted() { },
methods: {
// 获取所有数据字典
getAllDictData() {
allDictData()
.then((res) => {
if (res.code != 200) {
this.msgError(res.msg);
return;
}
// 给checkBox表单赋值做展示信息
const { data } = res;
this.cargoType = data.cargoType; // 申报类别
this.cargoStatus = data.cargoStatus; // 货物类型
this.puporpux = data.puporpux; // 取件扫描号
this.serviceCode = data.serviceCode; // Service Code
this.handlingCode = data.handlingCode; // Handling Code
this.subCategory = data.subCategory; // Sub Category
})
.catch(() => { });
},
// 航线维度设置详情
getFlightRouteConfigInfoDetail(parmas) {
findDestinationFltRuleByFlightNo(parmas)
.then((res) => {
const { code, data, msg } = res;
if (code != 200) {
this.msgError(msg);
return;
}
let routeList1 = data.routeList; // 航班航线基本信息
let { flightDate } = parmas;
// 如果是日期级别的再做一次没有日期的查询
if (flightDate) {
parmas.flightDate = "";
parmas.flightRouteListStr = "",
findDestinationFltRuleByFlightNo(parmas).then(response => {
if (response.code != 200) {
this.msgError(response.msg);
return;
}
let routeList2 = response.data.routeList; // 航班航线基本信息
/*
日期级别；
日期级别只拿日期级别的航线，但是日期级别的航线没有数据则去查询没有日期的航班信息，
然后拿没有日期的航班维度信息；
*/
// 日期级别航班航线维度规则详情
const dataList1 = removeDuplicates(data.list, {
duplicate: "flightRoute", // 去重字段
sort: false, // 是否要排序
sortType: "Number", // 排序类型
sortAttr: "routePriority", // 排序字段
});
// 普通级别航班航线维度规则详情
const dataList2 = removeDuplicates(response.data.list, {
duplicate: "flightRoute", // 去重字段
sort: false, // 是否要排序
sortType: "Number", // 排序类型
sortAttr: "routePriority", // 排序字段
});
// 先把日期级别的数据合并，然后再对遍历普通级别的dataList2；
// 看看
// console.log(dataList1)
// console.log(dataList2)
const newRouteList1 = routeList1.filter((item, index, array) => {
if(item.route == dataList1.unique[index].flightRoute){
console.log(array)
}
});
console.log(newRouteList1)
}).catch(() => { });
}
// console.log(routeList2);
// 如果当前航班号的航线下没有数据给这个航线在list里面追加一个data属性，值设置为false
// 当点击新增规则按钮往这个routesInfo push数据并且把data属性值设置为true
})
.catch(() => { });
},
// 失焦事件
blurEvent({ originOfFlightNo }) {
this.queryForm.originOfFlightNo = this.upCase(originOfFlightNo);
},
// 当前激活面板改变时触发
collapseChange(name) {
console.log(name);
},
// 始发站
changeLocation(val) {
console.log("始发站：", val);
},
// 目的站
changeDestinationSite(val) {
console.log("目的站：", val);
},
// 申报类别
changeCargoType(arr) {
console.log("申报类别：", arr);
},
// 货物类型
changeCargoStatus(arr) {
console.log("货物类型：", arr);
},
// 取件扫描号
changePuporpux(arr) {
console.log("取件扫描号：", arr);
},
// Service Code
changeServiceCode(arr) {
console.log("Service Code：", arr);
},
// Handling Code
changeHandlingCode(arr) {
console.log("Handling Code：", arr);
},
// Sub Category
changeSubCategory(arr) {
console.log("Sub Category：", arr);
},
// 新增规则
addRlue(index) {
// 如果当前航班号的航线下没有数据给
this.routesInfo.push(routeRuleForm); // 给新增规则赋上默认数据
console.log("新增规则：", index);
},
},
};
</script>
<style lang="scss" scoped>
.route-info-container {
padding: 20px;
}
</style>