add 添加并引用状态组件

This commit is contained in:
lb 2023-03-24 14:48:11 +08:00
parent d84a2d7dbf
commit 766de83deb
6 changed files with 106 additions and 9 deletions

View File

@ -0,0 +1,90 @@
<template>
<div class="state-select">
<select name="state" id="state" @change.stop.prevent="handleChange" :key="selectKey" style="color: #606266;">
<option v-for="(opt, index) in options" :key="index" :value="opt.value" :selected="chosen === opt.value">
{{ opt.label }}
</option>
</select>
</div>
</template>
<script>
import { getDictDataList } from "@/utils";
export default {
name: "StateSelect",
props: {
injectData: {
type: Object,
default: () => null,
},
},
data() {
const d = getDictDataList("car_state");
const chosen = this.injectData.stateDictValue;
return {
options: d.map((o) => ({
value: o.dictValue,
label: o.dictLabel,
})),
chosen,
selectKey: 0,
};
},
methods: {
handleChange(e) {
const old = this.chosen;
const value = e.target.value;
const { id } = this.injectData;
this.$confirm("确定更改窑车状态?", "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
})
.then(() => {
return this.$http
.post("/pms/carHandle/change", {
id,
stateDictValue: value,
})
.then(({ data: res }) => {
if (res.code === 0) {
this.chosen = value;
this.$nextTick(() => {
this.selectKey = Math.random();
});
this.$message({
message: "更新成功",
duration: 1500,
type: "success",
});
} else {
this.$message({
message: "更新失败",
duration: 1500,
type: "error",
});
throw new Error();
}
});
})
.catch(() => {
this.chosen = old;
this.$nextTick(() => {
this.selectKey = Math.random();
});
});
},
},
};
</script>
<style scoped>
.state-select >>> #state {
width: 100%;
/* appearance: unset; */
border: none;
}
</style>

View File

@ -1,5 +1,5 @@
import TableOperaionComponent from "@/components/noTemplateComponents/operationComponent"; import TableOperaionComponent from "@/components/noTemplateComponents/operationComponent";
import StateSelect from '@/components/StateSelect.vue';
import request from "@/utils/request"; import request from "@/utils/request";
import { timeFilter } from '@/utils/filters' import { timeFilter } from '@/utils/filters'
@ -8,7 +8,8 @@ export default function () {
{ type: 'index', label: '序号' }, { type: 'index', label: '序号' },
{ prop: "createTime", label: "添加时间", filter: timeFilter }, { prop: "createTime", label: "添加时间", filter: timeFilter },
{ prop: "code", label: "窑车号" }, { prop: "code", label: "窑车号" },
{ prop: "stateDictValue", label: "状态", filter: v => (v !== null && v !== undefined) ? ['没有数据', '正常', '判废', '过渡'][v] : '-' }, // subcomponent { prop: "stateDictValue", label: "状态", subcomponent: StateSelect },
// { prop: "stateDictValue", label: "状态", filter: v => (v !== null && v !== undefined) ? ['没有数据', '正常', '判废', '过渡'][v] : '-' }, // subcomponent
{ prop: "orderCode", label: "订单号" }, { prop: "orderCode", label: "订单号" },
{ prop: "posCode", label: "位置" }, { prop: "posCode", label: "位置" },
{ prop: "startTime", label: "开始时间", filter: timeFilter }, { prop: "startTime", label: "开始时间", filter: timeFilter },

View File

@ -2,12 +2,15 @@ import TableOperaionComponent from "@/components/noTemplateComponents/operationC
import request from "@/utils/request"; import request from "@/utils/request";
import { timeFilter } from "@/utils/filters"; import { timeFilter } from "@/utils/filters";
import StateSelect from '@/components/StateSelect.vue';
export default function () { export default function () {
const tableProps = [ const tableProps = [
{ type: "index", label: "序号" }, { type: "index", label: "序号" },
{ prop: "createTime", label: "添加时间", filter: timeFilter }, { prop: "createTime", label: "添加时间", filter: timeFilter },
{ prop: "code", label: "窑车号" }, { prop: "code", label: "窑车号" },
{ prop: "stateDictValue", label: "状态", filter: (v) => (v !== null && v !== undefined ? ["没有数据", "正常", "判废", "过渡"][v] : "-") }, // subcomponent { prop: "stateDictValue", label: "状态", subcomponent: StateSelect },
// { prop: "stateDictValue", label: "状态", filter: (v) => (v !== null && v !== undefined ? ["没有数据", "正常", "判废", "过渡"][v] : "-") }, // subcomponent
{ prop: "orderCode", label: "订单号" }, { prop: "orderCode", label: "订单号" },
{ prop: "posCode", label: "位置" }, { prop: "posCode", label: "位置" },
{ prop: "startTime", label: "开始时间", filter: timeFilter }, { prop: "startTime", label: "开始时间", filter: timeFilter },

View File

@ -1,5 +1,5 @@
import TableOperaionComponent from "@/components/noTemplateComponents/operationComponent"; import TableOperaionComponent from "@/components/noTemplateComponents/operationComponent";
import StateSelect from '@/components/StateSelect.vue';
import request from "@/utils/request"; import request from "@/utils/request";
import { timeFilter } from '@/utils/filters' import { timeFilter } from '@/utils/filters'
import { getDictDataList } from '@/utils' import { getDictDataList } from '@/utils'
@ -9,7 +9,8 @@ export default function () {
{ type: 'index', label: '序号' }, { type: 'index', label: '序号' },
{ prop: "createTime", label: "添加时间", filter: timeFilter }, { prop: "createTime", label: "添加时间", filter: timeFilter },
{ prop: "code", label: "窑车号" }, { prop: "code", label: "窑车号" },
{ prop: "stateDictValue", label: "状态", filter: v => (v !== null && v !== undefined) ? ['没有数据', '正常', '判废', '过渡'][v] : '-' }, // subcomponent { prop: "stateDictValue", label: "状态", subcomponent: StateSelect },
// { prop: "stateDictValue", label: "状态", filter: v => (v !== null && v !== undefined) ? ['没有数据', '正常', '判废', '过渡'][v] : '-' }, // subcomponent
{ prop: "orderCode", label: "订单号" }, { prop: "orderCode", label: "订单号" },
{ prop: "posCode", label: "位置" }, { prop: "posCode", label: "位置" },
{ prop: "startTime", label: "开始时间", filter: timeFilter }, { prop: "startTime", label: "开始时间", filter: timeFilter },

View File

@ -1,5 +1,5 @@
import TableOperaionComponent from "@/components/noTemplateComponents/operationComponent"; import TableOperaionComponent from "@/components/noTemplateComponents/operationComponent";
import StateSelect from '@/components/StateSelect.vue';
import request from "@/utils/request"; import request from "@/utils/request";
import { timeFilter } from '@/utils/filters' import { timeFilter } from '@/utils/filters'
import { getDictDataList } from '@/utils' import { getDictDataList } from '@/utils'
@ -9,7 +9,8 @@ export default function () {
{ type: 'index', label: '序号' }, { type: 'index', label: '序号' },
{ prop: "createTime", label: "添加时间", filter: timeFilter }, { prop: "createTime", label: "添加时间", filter: timeFilter },
{ prop: "code", label: "窑车号" }, { prop: "code", label: "窑车号" },
{ prop: "stateDictValue", label: "状态", filter: v => (v !== null && v !== undefined) ? ['没有数据', '正常', '判废', '过渡'][v] : '-' }, // subcomponent { prop: "stateDictValue", label: "状态", subcomponent: StateSelect },
// { prop: "stateDictValue", label: "状态", filter: v => (v !== null && v !== undefined) ? ['没有数据', '正常', '判废', '过渡'][v] : '-' }, // subcomponent
{ prop: "orderCode", label: "订单号" }, { prop: "orderCode", label: "订单号" },
{ prop: "posCode", label: "位置" }, { prop: "posCode", label: "位置" },
{ prop: "startTime", label: "开始时间", filter: timeFilter }, { prop: "startTime", label: "开始时间", filter: timeFilter },

View File

@ -1,5 +1,5 @@
import TableOperaionComponent from "@/components/noTemplateComponents/operationComponent"; import TableOperaionComponent from "@/components/noTemplateComponents/operationComponent";
import StateSelect from '@/components/StateSelect.vue';
import request from "@/utils/request"; import request from "@/utils/request";
import { timeFilter } from '@/utils/filters' import { timeFilter } from '@/utils/filters'
import { getDictDataList } from '@/utils' import { getDictDataList } from '@/utils'
@ -9,7 +9,8 @@ export default function () {
{ type: 'index', label: '序号' }, { type: 'index', label: '序号' },
{ prop: "createTime", label: "添加时间", filter: timeFilter }, { prop: "createTime", label: "添加时间", filter: timeFilter },
{ prop: "code", label: "窑车号" }, { prop: "code", label: "窑车号" },
{ prop: "stateDictValue", label: "状态", filter: v => (v !== null && v !== undefined) ? ['没有数据', '正常', '判废', '过渡'][v] : '-' }, // subcomponent { prop: "stateDictValue", label: "状态", subcomponent: StateSelect },
// { prop: "stateDictValue", label: "状态", filter: v => (v !== null && v !== undefined) ? ['没有数据', '正常', '判废', '过渡'][v] : '-' }, // subcomponent
{ prop: "orderCode", label: "订单号" }, { prop: "orderCode", label: "订单号" },
{ prop: "posCode", label: "位置" }, { prop: "posCode", label: "位置" },
{ prop: "startTime", label: "开始时间", filter: timeFilter }, { prop: "startTime", label: "开始时间", filter: timeFilter },