<template>
|
<div class="add-common">
|
<el-dialog
|
:title="editCommonConfig.title + '业务类型'"
|
:visible.sync="editConfig.visible"
|
:width="dialogWidth"
|
:before-close="handleClose"
|
>
|
<!-- 头 -->
|
<div slot="title" class="dialog-header">
|
<span>{{ editCommonConfig.title + "业务类型" }}</span>
|
<div class="header_btns">
|
<span class="btn">
|
<i class="el-icon-printer"></i>
|
<span>打印</span>
|
</span>
|
<span class="btn" style="margin-left: 15px">
|
<i class="el-icon-s-tools"></i>
|
<span>动作</span>
|
<!-- <el-button plain size="mini" style="margin-left: 15px" @click="deleteClick">删除</el-button> -->
|
</span>
|
<el-button v-if="showEdit" plain size="mini" style="margin-left: 15px" @click="editClick">编辑</el-button>
|
</div>
|
</div>
|
<!-- 内容 -->
|
<el-form
|
ref="form"
|
:model="editConfig.infomation"
|
:rules="rules"
|
label-position="right"
|
label-width="120px"
|
size="mini"
|
>
|
<div class="basic-info">
|
<!-- <FormBtnsView :showProduct="true" @productClick="productClick" /> -->
|
<div class="basic-info-view">
|
<div class="purchase-view">
|
<div class="left">
|
<el-form-item label="单据类型" prop="name">
|
<el-input
|
v-model="editConfig.infomation.name"
|
placeholder="请填写"
|
:disabled="!showFooter"
|
style="width: 100%"
|
></el-input>
|
</el-form-item>
|
<el-form-item label="作业类型" prop="baseOperationType">
|
<el-select
|
v-model="editConfig.infomation.baseOperationType"
|
placeholder="请选择"
|
size="mini"
|
style="width: 100%"
|
:disabled="!showFooter"
|
>
|
<el-option v-for="item in baseOperationTypeList" :key="item.id" :label="item.name" :value="item.id">
|
</el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="默认源位置" prop="defaultLocationSrcId">
|
<el-select
|
v-model="editConfig.infomation.defaultLocationSrcId"
|
placeholder="请选择"
|
size="mini"
|
style="width: 100%"
|
:disabled="!showFooter"
|
>
|
<el-option v-for="item in positionlist" :key="item.id" :label="item.name" :value="item.id">
|
</el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item
|
v-if="editConfig.infomation.baseOperationType !== 1"
|
label="默认目的位置"
|
prop="defaultLocationDestId"
|
>
|
<el-select
|
v-model="editConfig.infomation.defaultLocationDestId"
|
placeholder="请选择"
|
size="mini"
|
style="width: 100%"
|
:disabled="!showFooter"
|
>
|
<el-option v-for="item in positionlist" :key="item.id" :label="item.name" :value="item.id">
|
</el-option>
|
</el-select>
|
</el-form-item>
|
<!-- <el-form-item
|
v-if="editConfig.infomation.resource == '在预定日期之前'"
|
label="在预定日期前预定"
|
prop="client_name"
|
:label-width="labelWidth"
|
>
|
<el-input
|
v-model="editConfig.infomation.client_name"
|
placeholder=""
|
:disabled="!showFooter"
|
style="width: 85%"
|
></el-input>
|
</el-form-item> -->
|
</div>
|
<div class="right">
|
<el-form-item label="序号前缀" prop="prefix">
|
<el-input
|
v-model="editConfig.infomation.prefix"
|
placeholder=""
|
:disabled="!showFooter"
|
style="width: 100%"
|
></el-input>
|
</el-form-item>
|
<el-form-item
|
v-if="editConfig.infomation.baseOperationType !== 1"
|
label="保留方式"
|
prop="reservationMethod"
|
>
|
<el-radio-group v-model="editConfig.infomation.reservationMethod" :disabled="!showFooter">
|
<el-radio v-for="item in reservationMethodList" :key="item.id" :value="item.id" :label="item.id"
|
>{{ item.name }}
|
</el-radio>
|
</el-radio-group>
|
</el-form-item>
|
<el-form-item label="仓库" prop="warehouseId">
|
<el-select
|
v-model="editConfig.infomation.warehouseId"
|
placeholder="请选择"
|
size="mini"
|
style="width: 100%"
|
:disabled="!showFooter"
|
>
|
<el-option v-for="item in warehouseList" :key="item.id" :label="item.name" :value="item.id">
|
</el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item
|
v-if="editConfig.infomation.baseOperationType === 1"
|
label="默认目的位置"
|
prop="defaultLocationDestId"
|
>
|
<el-select
|
v-model="editConfig.infomation.defaultLocationDestId"
|
placeholder="请选择"
|
size="mini"
|
style="width: 100%"
|
:disabled="!showFooter"
|
>
|
<el-option v-for="item in positionlist" :key="item.id" :label="item.name" :value="item.id">
|
</el-option>
|
</el-select>
|
</el-form-item>
|
<!-- <el-form-item
|
v-if="editConfig.infomation.baseOperationType"
|
label="退货类型"
|
prop="returnOperationTypeID"
|
>
|
<el-select
|
v-model="editConfig.infomation.returnOperationTypeID"
|
placeholder="请选择"
|
size="mini"
|
style="width: 100%"
|
:disabled="!showFooter"
|
>
|
<el-option
|
v-for="item in returnOperationTypeList"
|
:key="item.id"
|
:label="item.username"
|
:value="item.id"
|
>
|
</el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="创建欠单" prop="createBackorder">
|
<el-select
|
v-model="editConfig.infomation.createBackorder"
|
placeholder="请选择"
|
size="mini"
|
style="width: 100%"
|
:disabled="!showFooter"
|
>
|
<el-option v-for="item in createBackorderList" :key="item.id" :label="item.name" :value="item.id">
|
</el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="显示作业详情" prop="showOperations">
|
<el-checkbox v-model="editConfig.infomation.showOperations" :disabled="!showFooter"></el-checkbox>
|
</el-form-item>
|
<el-form-item
|
v-if="editConfig.infomation.baseOperationType === 1"
|
label="预填写作业详情"
|
prop="earlyOperations"
|
>
|
<el-checkbox v-model="editConfig.infomation.earlyOperations" :disabled="!showFooter"></el-checkbox>
|
</el-form-item> -->
|
</div>
|
</div>
|
</div>
|
</div>
|
</el-form>
|
<!-- 尾 -->
|
<div slot="footer" class="dialog-footer">
|
<el-button type="primary" size="small" @click="saveClick('form')" :disabled="!showFooter">保存</el-button>
|
<el-button size="small" @click="editConfig.visible = false">取消</el-button>
|
</div>
|
</el-dialog>
|
</div>
|
</template>
|
|
<script>
|
import {
|
addOperationType,
|
updateOperationType,
|
getWarehouseList,
|
deleteOperationType,
|
getLocationList
|
} from "@/api/warehouseManage/warehouse"
|
import { getDataByType } from "@/api/data"
|
export default {
|
name: "AddBussinessType",
|
props: {
|
editCommonConfig: {
|
type: Object,
|
default: () => {
|
return {
|
visible: false,
|
title: "新建",
|
infomation: { type: [] }
|
}
|
}
|
}
|
},
|
components: {},
|
computed: {},
|
data() {
|
return {
|
dialogWidth: "50%",
|
editConfig: this.editCommonConfig,
|
rules: {
|
// 业务类型
|
name: [{ required: true, message: "请输入", trigger: "change" }],
|
// 前缀
|
prefix: [{ required: true, message: "请输入", trigger: "change" }],
|
baseOperationType: [{ required: true, message: "请选择", trigger: "change" }]
|
},
|
// 位置
|
locationList: [],
|
warehouseList: [],
|
// 退货类型
|
returnOperationTypeList: [],
|
// 作业类型
|
baseOperationTypeList: getDataByType("baseOperationType"),
|
// 创建欠单
|
createBackorderList: getDataByType("createBackorder"),
|
// 保留方式
|
reservationMethodList: getDataByType("reservationMethod"),
|
showButton: true,
|
showEdit: false, // 是否显示编辑按钮
|
isDelClick: false, // 删除按钮是否可点击
|
showFooter: false, // 是否显示取消保存
|
labelWidth: "90px",
|
positionlist: []
|
}
|
},
|
created() {
|
this.getList()
|
this.setBottonView()
|
},
|
methods: {
|
// 仓库
|
async getWarehouse() {
|
await getLocationList({
|
keyword: "",
|
page: 0,
|
pageSize: 0
|
}).then((res) => {
|
if (res.code === 200) {
|
this.positionlist = res.data ? res.data : []
|
this.$forceUpdate()
|
}
|
})
|
await getWarehouseList({
|
keyword: "",
|
page: 0,
|
pageSize: 0
|
}).then((res) => {
|
if (res.code == 200) {
|
this.warehouseList = res.data ? res.data : []
|
}
|
})
|
},
|
getList() {
|
this.getWarehouse()
|
},
|
// 设置删除/打印/编辑是否显示
|
setBottonView() {
|
if (this.editConfig.title === "新建") {
|
this.showButton = false
|
this.showEdit = false
|
this.showFooter = true
|
} else if (this.editConfig.title === "编辑") {
|
this.showEdit = false
|
this.showFooter = true
|
} else {
|
this.showEdit = true
|
this.showFooter = false
|
}
|
},
|
// 关闭
|
handleClose() {
|
this.editConfig.visible = false
|
},
|
// 刪除
|
deleteClick() {
|
let data = JSON.parse(JSON.stringify(this.editConfig.infomation))
|
deleteOperationType({ id: data.id }).then((res) => {
|
if (res.code === 200) {
|
this.editConfig.visible = false
|
this.$message.success("刪除成功!")
|
this.$emit("refresh")
|
} else {
|
this.$message.warning(res.msg ? res.msg : "删除失败!")
|
}
|
})
|
},
|
// 编辑
|
editClick() {
|
this.showEdit = false
|
this.showButton = false
|
this.showFooter = true
|
},
|
saveParams() {
|
let data = JSON.parse(JSON.stringify(this.editConfig.infomation))
|
|
let params = {
|
// 业务类型
|
name: data.name,
|
// 前缀
|
prefix: data.prefix,
|
// 作业类型
|
baseOperationType: data.baseOperationType,
|
// 退货类型
|
returnOperationTypeID: data.returnOperationTypeID,
|
// 创建欠单
|
createBackorder: data.createBackorder,
|
// 仓库
|
warehouseId: data.warehouseId,
|
// 显示作业详情
|
showOperations: data.showOperations ? data.showOperations : false,
|
earlyOperations: data.earlyOperations,
|
// 保留方式
|
reservationMethod: data.reservationMethod ? data.reservationMethod : 0,
|
// 默认原位置
|
defaultLocationSrcId: data.defaultLocationSrcId,
|
// 默认目标位置
|
defaultLocationDestId: data.defaultLocationDestId
|
}
|
if (data.id) {
|
params.id = data.id
|
}
|
return params
|
},
|
// 保存
|
saveClick(formName) {
|
this.$refs[formName].validate((valid) => {
|
if (valid) {
|
const params = this.saveParams()
|
if (this.editConfig.title === "新建") {
|
addOperationType(params).then((res) => {
|
if (res.code === 200) {
|
this.editConfig.visible = false
|
this.$message.success("添加成功!")
|
this.$emit("refresh")
|
} else {
|
this.$message.warning(res.msg ? res.msg : "添加失败!")
|
}
|
})
|
} else {
|
updateOperationType(params).then((res) => {
|
if (res.code === 200) {
|
this.editConfig.visible = false
|
this.$message.success("编辑成功!")
|
this.$emit("refresh")
|
} else {
|
this.$message.warning(res.msg ? res.msg : "编辑失败!")
|
}
|
})
|
}
|
} else {
|
console.log("error submit")
|
return false
|
}
|
})
|
},
|
// 删除
|
delClick() {},
|
// 产品
|
productClick() {
|
this.$router.push({ path: "/productManage/productList", query: { name: "产品" } })
|
}
|
// 保留方式
|
// reserveMethodClick(val) {
|
// if (val === "在预定日期之前") {
|
// this.labelWidth = "140px"
|
// } else {
|
// this.labelWidth = "80px"
|
// }
|
// }
|
}
|
}
|
</script>
|
|
<!-- Add "scoped" attribute to limit CSS to this component only -->
|
<style lang="scss" scoped>
|
.dialog-header {
|
display: flex;
|
align-items: center;
|
font-size: 14px;
|
color: #333;
|
.header_btns {
|
margin-left: auto;
|
margin-right: 60px;
|
.btn {
|
cursor: no-drop;
|
}
|
}
|
}
|
.content-btn {
|
height: 37px;
|
line-height: 37px;
|
padding-left: 20px;
|
border-bottom: 1px solid #e9e9e9;
|
}
|
.basic-info {
|
// height: 350px;
|
// overflow-y: auto;
|
// overflow-x: hidden;
|
width: calc(100% - 60px);
|
margin: 30px;
|
// border: 1px solid #dcdfe6;
|
// box-shadow: inset 0 0 2px #dee2e6;
|
// -moz-box-shadow: inset 0 0 2px #dee2e6;
|
// -webkit-box-shadow: inset 0 0 2px #dee2e6;
|
.content-number {
|
display: flex;
|
justify-content: right;
|
height: 44px;
|
border-bottom: 1px solid #e9e9e9;
|
font-size: 13px;
|
.sub-number {
|
width: 12.5%;
|
border-right: 1px solid #e9e9e9;
|
display: flex;
|
padding: 3px 9px;
|
.left {
|
margin-top: 3px;
|
font-size: 22px;
|
font-weight: 600;
|
}
|
.icon-view {
|
transform: rotate(270deg);
|
}
|
.right {
|
margin-left: 6px;
|
.right-label {
|
color: #495057;
|
}
|
.right-one {
|
height: 38px;
|
line-height: 38px;
|
}
|
}
|
}
|
}
|
.basic-info-view {
|
margin-top: 20px;
|
.upload {
|
position: relative;
|
width: 90px;
|
height: 90px;
|
margin-left: 40px;
|
border: 1px dotted #d9d9d9;
|
border-radius: 4px;
|
.upload-icon {
|
position: absolute;
|
top: 40%;
|
right: 43%;
|
}
|
}
|
}
|
.purchase-view {
|
display: flex;
|
.left {
|
width: 50%;
|
}
|
.right {
|
width: 50%;
|
}
|
}
|
.second-label {
|
margin-left: 20px;
|
border-bottom: 1px solid #d9d9d9;
|
margin-bottom: 10px;
|
}
|
.list-item {
|
width: 300px;
|
}
|
.avatar-uploader .el-upload {
|
border: 1px dashed #d9d9d9;
|
border-radius: 6px;
|
cursor: pointer;
|
position: relative;
|
overflow: hidden;
|
}
|
.avatar-uploader .el-upload:hover {
|
border-color: #409eff;
|
}
|
.avatar-uploader-icon {
|
font-size: 28px;
|
color: #8c939d;
|
width: 178px;
|
height: 178px;
|
line-height: 178px;
|
text-align: center;
|
}
|
.avatar {
|
width: 178px;
|
height: 178px;
|
display: block;
|
}
|
}
|
::v-deep {
|
.el-dialog__headerbtn {
|
position: absolute;
|
top: 18px;
|
}
|
.el-button {
|
&:hover {
|
border: 1px solid #dcdfe6;
|
color: #333;
|
}
|
}
|
.el-tabs--card > .el-tabs__header .el-tabs__nav {
|
margin-left: 20px;
|
}
|
.el-tabs__item {
|
height: 30px;
|
line-height: 30px;
|
font-size: 13px;
|
}
|
}
|
</style>
|