Mes
/
middle-admin-ant
4
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

4.29 别名

This commit is contained in:
ljx 2024-04-29 17:38:25 +08:00
parent 7dc3ce3dee
commit e005266a04
1 changed files with 309 additions and 41 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

350
src/pages/Middle/transport/SoilQualityMaterial/SoilQualityMaterial/Edit.vue
View File

@ -1,5 +1,58 @@
<template>
<basic-page-edit :dataId="getDataId()" :options="pageOptions"></basic-page-edit>
<div class="page-body">
<!-- <basic-page-edit :dataId="getDataId()" :options="pageOptions"></basic-page-edit> -->
<vxe-form :data="formOptions.data" ref="xForm" :title-width="formOptions.titleWidth"
:title-align="formOptions.titleAlign" :rules="formOptions.rules" titleColon>
<!-- =========================== 自定义区域 Start ======================= -->
<vxe-form-item v-for="(item,index) in formOptions.items" :title="item.title" :field="item.field" :span="item.span" :key="index" :item-render="item.itemRender">
<div v-if="item.isTitle" class="Htitle">
<div class="left-line"></div>
<p class="Htitle-p">
{{ item.Htitle }}
</p>
<div style="padding-right: 10px;" v-if="item.needAdd"><vxe-button size="small" status="primary" @click="addTrainNumber" content="新增车次"></vxe-button></div>
<div class="right-line"></div>
</div>
</vxe-form-item>
<!-- =========================== 自定义区域 End ======================= -->
</vxe-form>
<div class="tablebox" v-if="isEdit&&soilQualityMaterialAliasList.length>0">
<div class="Htitle" style="margin-bottom: 20px;">
<div class="left-line"></div>
<p class="Htitle-p">别名管理</p>
<div class="right-line"></div>
</div>
<vxe-table border show-overflow keep-source ref="xTable" :data="soilQualityMaterialAliasList"
@pulldownSelected="onPulldownSelected" @popupSelected="onPopupSelected"
:edit-config="{ trigger: 'click', mode: 'cell', icon: 'vxe-icon-edit', showStatus: false }"
>
<vxe-column width="60">
<template #default="{ row }">
<div style="font-size: 18px;">
<a @click.stop="pageAdd(row)" title="新增" style="margin-right: 5px;">
<a-icon type="plus-circle" />
</a>
<a @click.stop="pageDelete(row)" title="删除">
<a-icon type="delete" />
</a>
</div>
</template>
</vxe-column>
<vxe-column type="seq" width="60"></vxe-column>
<vxe-column field="customer" title="客户" :params="editorCustomer" formatter="formatRef" :edit-render="{ name: 'MkGridDataSelector' }"></vxe-column>
<vxe-column field="name" title="别名" :edit-render="{ name: '$input'}"></vxe-column>
<vxe-column field="price" title="单价" :edit-render="{ name: '$input',props: { type: 'number' } }"></vxe-column>
<!-- <vxe-column field="remark" title="备注" :edit-render="{ name: '$input' }"></vxe-column> -->
</vxe-table>
</div>
<div class="footerbar">
<a-button type="primary" @click="ok">确定</a-button>
<a-button @click="cancel">取消</a-button>
</div>
</div>
</template>
<script>
@ -19,32 +72,7 @@ export default {
},
data() {
return {
pageOptions: {}
};
},
computed: {
// desc() {
// return this.$t('editPageDesc')
// }
},
created() {
this.optionsInit();
this.dataInit();
},
// 函数
methods: {
optionsInit() {
// 页面数据变量
var pageData = {
var pageData = {
// 当前项目名称
currentConfigName: "",
// 当前项目ID
@ -83,14 +111,25 @@ export default {
// =============================== 接口地址 自动生成 End ===============================
},
editorCustomer: {
name: "Custom",
modelName: "Custom",
listdataFieldName:'Custom',
columns: [
{ field: 'name', title: '名称' },
{ field: 'code', title: '编号' }
],
placeholder: "请输入名称或者编号",
searchFieldNames: ['name', 'code'],
textField: 'name',
dataUrl: `${BASE_URL.BASE_URL}/Custom/v1/custom/list`
},
keyName: 'id',
// 是否编辑模式
isEdit: false,
// 表单数据
formOptions: {
data: {
id: 0,
code: "",
name: "",
@ -142,7 +181,8 @@ export default {
},
// 新增模式表单项
addModeItems: [],
soilQualityMaterialAliasList: [],
deleteList:[],
};
@ -152,19 +192,34 @@ export default {
// 合并表单数据及配置
pageData.formOptions = Object.assign({}, this.$mk.config.defaults.formOptions, pageData.formOptions);
return pageData
},
this.pageOptions = pageData;
},
computed: {
// desc() {
// return this.$t('editPageDesc')
// }
},
created() {
// this.optionsInit();
this.dataInit();
},
// 函数
methods: {
dataInit() {
// 获取路由的id参数
let dataId = this.getDataId();
let that = this;
// 如果有id参数，说明是编辑模式
if (dataId) {
const json = `{"id":${dataId}}`;
this.$mk.post({
url: this.pageOptions.actions.get,
loading: "加载中...",
url: this.actions.get,
data: json,
config: {
headers: {
@ -173,7 +228,7 @@ export default {
}
}).then(a => {
let detailDataFieldName = this.pageOptions.detailDataFieldName;
let detailDataFieldName = this.detailDataFieldName;
let rules = [
{field: "warehouse_effective_date", dataRule: "timestamp"},
@ -184,24 +239,67 @@ export default {
rules = []; //上面几个字段如果不需要在表单显示，可以不转换（不转换的话，表单拿到的是什么数据，提交的时候就是什么数据）
this.$mk.formatInitFormData({
data: a.data[detailDataFieldName],
rules: [...this.pageOptions.formOptions.items, ...rules]
rules: [...this.formOptions.items, ...rules]
}); //建议固定格式化写法
this.pageOptions.formOptions.data = a.data[detailDataFieldName];
this.formOptions.data = a.data[detailDataFieldName];
this.$forceUpdate()
}).catch((a) => {
this.$mk.error(a.data.msg);
});
this.pageOptions.isEdit = true;
this.isEdit = true;
this.$mk.post({
url: this.actions.SoilQualityMaterialAliasList,
data: {
"search_rules": [
{
"column": "soil_quality_material_id",
"mode": "=",
"value": dataId
}
],
"page": 1,
"limit": 20,
"end_time": 0,
"order_bys": [
],
"start_time": 0
}
}).then(res=>{
console.log(res)
if(res.data.SoilQualityMaterialAlias == null){
that.soilQualityMaterialAliasList =[{
id:null,
customer:null,
customer_id:'',
name:'',
price:'',
remark:'',
}]
}else{
res.data.SoilQualityMaterialAlias.forEach(item => {
item.customer = [item.customer_id,item.customer_name]
that.soilQualityMaterialAliasList.push({
id:item.id,
customer:item.customer,
customer_id:item.customer_id,
name:item.name,
price:item.price,
remark:item.remark,
})
})
console.log(that.soilQualityMaterialAliasList)
}
})
this.$forceUpdate()
} else {
// 如果没有id参数，说明是新增模式
if(this.addModeItems){
this.addModeItems.forEach(item => {
this.pageOptions.formOptions.items.push(item);
this.formOptions.items.push(item);
})
}
@ -218,10 +316,180 @@ export default {
dataId = 0;
}
return dataId;
}
},
// 新增
pageAdd(row) {
const $table = this.$refs['xTable']
const record = {
id:null,
customer:null,
customer_id:'',
name:'',
price:'',
remark:'',
}
if (row) {
this.soilQualityMaterialAliasList.splice($table.getRowSeq(row), 0, record);
} else {
this.soilQualityMaterialAliasList.push(record)
}
console.log(this.soilQualityMaterialAliasList)
},
pageDelete(row) {
const $table = this.$refs['xTable']
if (this.soilQualityMaterialAliasList.length == 1) {
this.$mk.error("至少保留一行");
return;
}
if (row.id) {
this.deleteList.push({
Status: 'deleted',
id: row.id,
soil_quality_material_id:this.getDataId()
})
}
this.soilQualityMaterialAliasList.splice($table.getRowSeq(row) - 1, 1);
},
onPulldownSelected({ row, name, params }) {
if (name == 'Custom') {
this.updateToGrid(row, this.soilQualityMaterialAliasList[params.$rowIndex]);
return;
}
setTimeout(() => {
this.$refs.xTable.clearEdit();
}, 50);
},
onPopupSelected({ rows, name, params }) {
console.log(rows, name, params);
for (let i = params.$rowIndex, ri = 0; i < params.$rowIndex + rows.length; i++, ri++) {
if (i == this.detailsData.length) {
let newrow = {};
this.detailsData.push(newrow);
}
let inv = rows[ri];
this.updateToGrid(inv, this.detailsData[i]);
}
setTimeout(() => {
this.$refs.xTable.clearEdit();
}, 50);
},
updateToGrid(inv, row) {
console.log(inv)
var updateRow = {
};
updateRow.customer_id =inv.customer[0];
updateRow.customer_name =inv.customer[1];
Object.assign(row, updateRow);
},
// 保存
ok() {
let save = () => {
// 如果是新增模式，提交新增接口 如果是编辑模式，提交编辑接口
let action = !this.isEdit ? this.actions.create : this.actions.update;
// 如果是新增模式，提交的数据中加入id 如果是编辑模式，提交的数据中不加入id
let postdata = Object.assign({}, this.formOptions.data);
// 如果是编辑模式
if (this.isEdit) {
// postdata = { TrainNumber: postdata }
}
// 格式化提交的数据
this.$mk.formatFormData({data: postdata, rules: this.formOptions.items});
// 提交数据
this.$mk.post({
url: action,
loading: "保存中...",
data: postdata,
useBigInt: true,
}).then(() => { // 成功回调
let insertList = [];
let updateList = [];
let deleteList = this.deleteList;
this.soilQualityMaterialAliasList.forEach(item => {
item.customer_id = this.$mk.toBigInt(item.customer_id);
item.price = Number(item.price);
item.soil_quality_material_id = postdata.id;
if(item.id){
updateList.push(item)
}else if(item.customer_id){
insertList.push(item)
}
})
this.$mk.post({
url: this.actions.SoilQualityMaterialAliasBatchHandle,
data: {insertList,updateList,deleteList},
useBigInt: true,
}).then(() => { // 成功回调
})
this.$mk.success("保存成功");
if (!this.isEdit) { // 如果是新增模式，关闭当前页面
this.back();
this.$forceUpdate()
}
}).catch((a) => { // 失败回调
this.$mk.error(a.data.msg); // 显示错误信息
});
};
// 验证表单
this.$mk.validateForm({form: this.$refs.xForm}).then(() => { // 验证表单
save(); // 提交保存
}).catch(count => { // 验证失败
this.$mk.error(`存在${count}项错误，请检查`);
});
},
// 取消 返回
cancel() {
this.back();
},
// 返回
back() {
if (this.addPageUrl) {
// 如果是新增模式，关闭当前页面
if (!this.isEdit) {
this.$closePage({
closeRoute: this.addPageUrl
});
} else {
this.$closePage({
closeRoute: this.editPageUrl
});
}
// 打开列表页面
this.$openPage(this.listPageUrl)
} else {
this.$emit("callback", { success: true });
}
},
},
// 监听属性
watch: {}
};
</script>
<style scoped lang="less">
.Htitle{
font-weight: bold;
display: flex;
align-items: center;
width: 100%;
padding-left: 10px;
.Htitle-p{margin-bottom: 0;margin: 0 10px; color: #122ed1; font-size: 16px;}
.left-line{width: 40px;height: 1px;background-color:#122ed1;}
.right-line{flex-grow: 1;height: 1px;background-color:#122ed1;}
}
.tablebox{
padding: 10px 0;
}
</style>