Elements-SY

modify

1 -export const formConfig = [
2 - {
3 - label: "原航班",
4 - type: "Input",
5 - name: "originOfFlightNo",
6 - prop: "originOfFlightNo",
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 - // rules: { required: true, message: "请选择开始时间", trigger: "blur" },
19 - format: "yyyy-MM-dd",
20 - colWidth: "23%",
21 - inputWidth: "100%",
22 - },
23 - {
24 - label: "到",
25 - type: "Date",
26 - name: "endTime",
27 - prop: "endTime",
28 - placeholder: "请选择结束时间",
29 - // rules: { required: true, message: "请选择结束时间", trigger: "blur" },
30 - format: "yyyy-MM-dd",
31 - colWidth: "20%",
32 - labelWidth: "20px",
33 - inputWidth: "100%",
34 - },
35 - {
36 - label: "规则状态",
37 - type: "Select",
38 - name: "status",
39 - prop: "status",
40 - placeholder: "请选择状态",
41 - options: {
42 - data: [
43 - {
44 - value: "1",
45 - label: "有效",
46 - },
47 - {
48 - value: "0",
49 - label: "无效",
50 - },
51 - ],
52 - },
53 - colWidth: "18%",
54 - labelWidth: "70px",
55 - inputWidth: "100%",
56 - },
57 -];
58 -
59 -export const editFormConfig = [
60 - {
61 - label: "航班号",
62 - type: "Search",
63 - name: "route",
64 - prop: "fltNo",
65 - placeholder: "请输入航班号",
66 - rules: {
67 - required: true,
68 - message: "请输入航班号",
69 - trigger: ["change", "blur"],
70 - },
71 - http: {
72 - url: "/dictionary/queryRouteByFltNo",
73 - method: "post",
74 - data: {
75 - fltNo: "",
76 - },
77 - },
78 - },
79 - {
80 - label: "",
81 - type: "inputNumber",
82 - name: "count",
83 - prop: "count",
84 - placeholder: "+",
85 - min: 0,
86 - max: 7,
87 - with: "50px",
88 - },
89 - {
90 - label: "航线优先级",
91 - type: "Input",
92 - name: "route",
93 - prop: "fltNum",
94 - placeholder: "请选择航线优先级",
95 - trigger: "focus",
96 - },
97 - {
98 - label: "爆仓是否继续配舱",
99 - type: "Checkbox",
100 - name: "checked",
101 - prop: "checked",
102 - disabled: false,
103 - },
104 -];
1 -<template>
2 - <div ref="formHeaderRef" class="form-header container">
3 - <el-row>
4 - <el-col>
5 - <yl-form
6 - ref="ruleForm"
7 - :formConfig="formConfig"
8 - :queryForm="queryForm"
9 - :inline="false"
10 - formWidth="auto"
11 - @blur="blurEvent"
12 - />
13 - </el-col>
14 - </el-row>
15 - <yl-table
16 - ref="ylTable"
17 - :attrs="tableAttr"
18 - :loadingTable="tableAttr.loadingTable"
19 - :columns="columns"
20 - :tableData="tableData"
21 - :pageConfig="pageConfig"
22 - @sizeChange="handleSizeChange"
23 - @currentChange="handleCurrentChange"
24 - @search="searchBtn"
25 - @add="addBtn"
26 - >
27 - </yl-table>
28 - </div>
29 -</template>
30 -<script>
31 -import YlForm from "@/components/YlForm";
32 -import YlTable from "@/components/YlTable";
33 -import { formConfig } from "./formConfig";
34 -import { tableAttr, columnHeader } from "./tableConfig";
35 -import { restTableHeight, sortList } from "@/utils";
36 -import store from '@/store'
37 -import {
38 - findAllEtesRules, // ET86查询
39 - deleteEtesRuleById, // 删除
40 -} from "@/api/et86";
41 -export default {
42 - components: {
43 - YlForm,
44 - YlTable,
45 - },
46 - data() {
47 - return {
48 - formConfig: formConfig, // 表单配置项
49 - queryForm: {
50 - // 表单参数
51 - status: "有效",
52 - },
53 - pageConfig: {
54 - // 分页配置项
55 - isPagination: true,
56 - total: 0,
57 - pageData: {
58 - page: 1,
59 - size: 10,
60 - },
61 - },
62 - tableAttr: tableAttr, // table配置项
63 - columns: columnHeader(this.indexAdd, this.viewRow, this.editRow, this.deleteRow), // 表头
64 - tableData: [], // 表格数据
65 - };
66 - },
67 - created() {
68 - // ET86查询
69 - this.$nextTick(() => {
70 - this.searchBtn();
71 - });
72 - },
73 - mounted() {
74 - this.$nextTick(() => {
75 - this.tableAttr.maxHeight =
76 - window.innerHeight - restTableHeight(this.$refs);
77 - });
78 - console.log(store.getters.appHeaderBlockClientHeight)
79 - },
80 - methods: {
81 - // ET86查询
82 - queryFindAllEtesRules() {
83 - const { page, size } = this.pageConfig.pageData;
84 - let params = {
85 - originOfFlightNo: this.queryForm.originOfFlightNo,
86 - updateTimeStart: this.queryForm.startTime
87 - ? this.queryForm.startTime
88 - : "",
89 - updateTimeEnd: this.queryForm.endTime ? this.queryForm.endTime : "",
90 - limitStart: (page - 1) * size,
91 - limitSize: size,
92 - status: this.queryForm.status,
93 - };
94 - if (this.queryForm.status == "有效") {
95 - params.status = "1";
96 - }
97 - this.tableAttr.loadingTable = true;
98 - findAllEtesRules(params)
99 - .then((res) => {
100 - this.tableAttr.loadingTable = false;
101 - const { code, data } = res;
102 - if (code == 200) {
103 - const valid = data.list.filter((item) => item.status == "1"); // 有效
104 - const invalid = data.list.filter((item) => item.status == "0"); // 无效
105 - this.tableData = valid.concat(invalid);
106 - this.pageConfig.total = data.total;
107 - }
108 - })
109 - .catch(() => {});
110 - },
111 - // 失焦事件
112 - blurEvent({ originOfFlightNo }) {
113 - this.queryForm.originOfFlightNo = this.upCase(originOfFlightNo);
114 - },
115 - // 搜索
116 - searchBtn() {
117 - this.pageConfig.pageData.page = 1;
118 - this.pageConfig.pageData.size = 10;
119 - this.$refs.ruleForm.handleSearch("ruleForm", (val) => {
120 - this.queryFindAllEtesRules();
121 - });
122 - },
123 - // 翻页序号递增
124 - indexAdd(index){
125 - const page = this.pageConfig.pageData.page // 当前页码
126 - const pagesize = this.pageConfig.pageData.size // 每页条数
127 - return index + 1 + (page - 1) * pagesize
128 - },
129 - //条数变化
130 - handleSizeChange(e) {
131 - this.pageConfig.pageData.size = e;
132 - this.pageConfig.pageData.page = 1;
133 - this.queryFindAllEtesRules();
134 - },
135 - //页码变化
136 - handleCurrentChange(e) {
137 - this.pageConfig.pageData.page = e;
138 - this.queryFindAllEtesRules();
139 - },
140 - // 添加
141 - addBtn(item) {
142 - this.$router.push({
143 - path: "/edit",
144 - query: {
145 - name: "add",
146 - },
147 - });
148 - },
149 - // 重置表单
150 - restForm() {
151 - this.$refs.ruleForm.resetFields("ruleForm");
152 - },
153 - // 查看
154 - viewRow({ row }) {
155 - this.$router.push({
156 - path: "/edit",
157 - query: {
158 - name: "view",
159 - id: row.id,
160 - status: row.status,
161 - },
162 - });
163 - },
164 - // 编辑
165 - editRow({ row }) {
166 - this.$router.push({
167 - path: "/edit",
168 - query: {
169 - name: "edit",
170 - id: row.id,
171 - status: row.status,
172 - },
173 - });
174 - },
175 - // 删除
176 - deleteRow({ row }) {
177 - this.$confirm("是否确认删除? 删除后该规则设置为无效,不可恢复", "提示", {
178 - confirmButtonText: "确定",
179 - cancelButtonText: "取消",
180 - type: "warning",
181 - center: true,
182 - })
183 - .then(() => {
184 - deleteEtesRuleById({ id: row.id }).then((res) => {
185 - const { code, msg } = res;
186 - if (code == 200) {
187 - this.searchBtn();
188 - this.msgSuccess("删除成功!");
189 - } else {
190 - this.msgError(msg || "删除失败");
191 - }
192 - });
193 - })
194 - .catch(() => {});
195 - },
196 - },
197 -};
198 -</script>
199 -<style lang="scss" scoped></style>