This commit is contained in:
linfso 2024-02-19 17:39:33 +08:00
parent 493394f463
commit 7f05d003a2
2 changed files with 312 additions and 11 deletions

View File

@ -0,0 +1,301 @@
<template>
<div>
<div>
<el-form
:size="'small'"
:inline="true"
:model="ruleForm"
ref="ruleForm"
label-width="120px"
label-position="left"
:rules="addRules"
>
<div class="scan_title">展示:</div>
<!-- 自定义清除方法,注意change方法在clear前执行 -->
<el-row>
<el-form-item label="省/州" prop="firstId">
<el-select
v-model="ruleForm.firstId"
placeholder="请选择省/州"
@change="changeFirst"
@clear="handleClearFirstId"
style="width: 220px"
clearable
>
<el-option
v-for="item in allFirstList"
:key="item.firstId"
:label="item.firstNo"
:value="item.firstId"
>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="市" prop="secondId">
<el-select
style="width: 220px"
v-model="ruleForm.secondId"
placeholder="请选择次级省/州"
@change="changeSecond"
@clear="handleClearSecondId"
clearable
>
<el-option
v-for="item in allSecondList"
:key="item.secondId"
:label="item.secondNo"
:value="item.secondId"
>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="三级选项:" prop="thirdId">
<el-select
style="width: 220px"
v-model="ruleForm.thirdId"
placeholder="请选择三级选项编号"
@change="changeThird"
value-key="thirdId"
clearable
>
<el-option
v-for="item in allThirdList"
:key="item.thirdId"
:label="item.thirdNo"
:value="item.thirdId"
>
</el-option>
</el-select>
</el-form-item>
</el-row>
</el-form>
</div>
</div>
</template>
<script>
export default {
name: "LinkingSelect",
props: {},
data() {
return {
selectedLabelList: [],
filSelectedLabels: [],
refreshKey: 0,
ruleForm: {},
dynamicTags: [],
tagVisible: false,
allFirstList: [],
allSecondList: [],
allThirdList: [],
addRules: {
firstId: [
{
required: true,
trigger: "change,blur",
message: "请选择一级选项",
},
],
secondId: [
{
required: true,
trigger: "change,blur",
message: "请选择次级选项",
},
],
thirdId: [
{
required: true,
trigger: "change,blur",
message: "请选择三级选项",
},
],
},
};
},
created() {
this.handleGetAllFirst();
},
mounted() {
},
methods: {
// 清除次级选择以及子孙选择的内容
handleClearSecondId() {
this.ruleForm.secondId = "";
this.ruleForm.thirdId = "";
this.allThirdList = [];
},
// 清除一级选择以及子孙选择的内容
handleClearFirstId() {
this.ruleForm.firstId = "";
this.ruleForm.secondId = "";
this.ruleForm.thirdId = "";
this.allThirdList = [];
this.allSecondList = [];
},
// 清除最后一级选择的内容并刷新
changeThird() {
this.$forceUpdate();
},
changeSecond(secondId) {
this.ruleForm.thirdId = "";
// 判断是否为空字符串
if (secondId && secondId !== "") {
// 请求接口
// getThird({
// secondId: secondId,
// fileId: this.ruleForm.fileId,
// }).then((res) => {
// this.allThirdList = res.data;
// });
// 模拟数据
this.allThirdList = [
{
createBy: "admin",
createTime: "2023-03-27 10:24:30",
updateBy: "",
updateTime: null,
remark: null,
thirdId: 3,
thirdNo: "H0",
leftCapacity: 1,
totalCapacity: 5,
secondNo: "X0",
secondId: 11,
firstNo: "G0",
firstId: 11,
manageBy: "admin",
delFlag: "0",
deptId: 100,
deptName: "xx科技",
beginTime: null,
endTime: null,
userId: null,
},
];
}
},
changeFirst(firstId) {
this.ruleForm.secondId = "";
this.ruleForm.thirdId = "";
if (firstId !== "") {
// 请求接口
// getSecond({
// firstId: firstId,
// fileId: this.ruleForm.fileId,
// }).then((res) => {
// this.allSecondList = res.data;
// });
// 模拟数据
this.allSecondList = [
{
createBy: "admin",
createTime: "2023-03-27 10:24:10",
updateBy: "",
updateTime: null,
remark: null,
secondId: 11,
secondNo: "X0",
leftCapacity: 4,
totalCapacity: 5,
firstId: 11,
firstNo: "G0",
manageBy: "admin",
delFlag: "0",
deptId: 100,
deptName: "xx科技",
userId: null,
thirdId: null,
},
];
}
},
handleGetAllFirst() {
// getFirst({
// fileId: this.ruleForm.fileId,
// }).then((res) => {
// this.allFirstList = res.data;
// });
this.allFirstList = [
{
createBy: "admin",
createTime: "2023-03-27 10:23:57",
updateBy: "",
updateTime: null,
remark: null,
firstId: 11,
firstNo: "G0",
leftCapacity: 5,
totalCapacity: 5,
manageBy: "admin",
delFlag: "0",
deptId: 100,
deptName: "若依科技",
beginTime: null,
endTime: null,
userId: null,
fileCate: null,
secondId: null,
thirdId: null,
},
{
createBy: "aduser",
createTime: "2023-03-27 10:15:12",
updateBy: "",
updateTime: null,
remark: null,
firstId: 6,
firstNo: "G1",
leftCapacity: 0,
totalCapacity: 5,
manageBy: "aduser",
delFlag: "0",
deptId: 201,
deptName: "管理部",
beginTime: null,
endTime: null,
userId: null,
fileCate: null,
secondId: null,
thirdId: null,
},
{
createBy: "aduser2",
createTime: "2023-03-27 10:00:14",
updateBy: "aduser2",
updateTime: "2023-03-27 10:14:31",
remark: null,
firstId: 1,
firstNo: "G11",
leftCapacity: 0,
totalCapacity: 5,
manageBy: "aduser2",
delFlag: "0",
deptId: 207,
deptName: "管理一部",
beginTime: null,
endTime: null,
userId: null,
fileCate: null,
secondId: null,
thirdId: null,
},
];
},
},
};
</script>
<style scoped>
</style>

View File

@ -10,18 +10,18 @@
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="" prop="quoteCode">
<!-- <el-form-item label="" prop="quoteCode">
<el-input
v-model="queryParams.quoteCode"
placeholder="报价编码"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
</el-form-item> -->
<el-form-item label="" prop="useSiteCode">
<el-input
v-model="queryParams.useSiteCode"
placeholder="使用站点代码"
placeholder="报价网点编码"
clearable
@keyup.enter.native="handleQuery"
/>
@ -29,7 +29,7 @@
<el-form-item label="" prop="useSite">
<el-input
v-model="queryParams.useSite"
placeholder="使用站点名称"
placeholder="报价网点名称"
clearable
@keyup.enter.native="handleQuery"
/>
@ -74,7 +74,7 @@
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="" prop="soonPieceType">
<!-- <el-form-item label="" prop="soonPieceType">
<el-input
v-model="queryParams.soonPieceType"
placeholder="soon_piece_type"
@ -233,7 +233,7 @@
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
</el-form-item> -->
<el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
@ -251,7 +251,7 @@
v-hasPermi="['emis:emisQuotePrice:add']"
>新增</el-button>
</el-col>
<!--
<!--
<el-col :span="1.5">
<el-button
type="success"
@ -363,7 +363,7 @@
@click="handleUpdate(scope.row)"
v-hasPermi="['emis:emisQuotePrice:edit']"
>修改</el-button>
<!--
<!--
<el-button
size="mini"
type="text"
@ -374,7 +374,7 @@
</template>
</el-table-column>
</el-table>
<pagination
v-show="total>0"
:total="total"
@ -545,11 +545,11 @@
</el-form-item>
</el-col>
<!--
<!--
<el-col :span="24" v-show="moreInputVisible" > </el-col>
<el-col :span="24">
<el-divider content-position="right" @click="handleShowMoreInput" >更多信息[+]</el-divider>
</el-col>
</el-col>
-->
</el-form>