329 lines
10 KiB
Vue
329 lines
10 KiB
Vue
<!--
|
|
* @Author: zwq
|
|
* @Date: 2020-12-29 16:37:56
|
|
* @LastEditors: zwq
|
|
* @LastEditTime: 2022-01-11 16:26:29
|
|
* @enName:
|
|
-->
|
|
<template>
|
|
<div style="margin:20px">
|
|
<el-row :gutter="15">
|
|
<el-form
|
|
ref="dataForm"
|
|
:model="dataForm"
|
|
:rules="rules"
|
|
size="medium"
|
|
label-width="140px"
|
|
>
|
|
<el-col :span="8">
|
|
<el-form-item :label="$t('module.basicData.cache.CacheName')" prop="tareaName">
|
|
<el-input v-model="dataForm.tareaName" :disabled="isdetail" :placeholder="$i18nForm(['placeholder.input', $t('module.basicData.cache.CacheName')])" clearable :style="{width: '100%'}" />
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item :label="$t('module.basicData.cache.CacheCode')" prop="code">
|
|
<el-input v-model="dataForm.code" :disabled="isdetail" :label="$t('module.basicData.cache.CacheCode')" clearable :style="{width: '100%'}" />
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item :label="$t('module.basicData.visual.EnglishName')" prop="enName">
|
|
<el-input v-model="dataForm.enName" :disabled="isdetail" :placeholder="$i18nForm(['placeholder.input', $t('module.basicData.visual.EnglishName')])" clearable :style="{width: '100%'}" />
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item :label="$t('module.basicData.visual.Abbreviation')" prop="abbr">
|
|
<el-input v-model="dataForm.abbr" :disabled="isdetail" :placeholder="$i18nForm(['placeholder.input', $t('module.basicData.visual.Abbreviation')])" clearable :style="{width: '100%'}" />
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item :label="$t('module.basicData.visual.Specs')" prop="spec">
|
|
<el-input v-model="dataForm.spec" :disabled="isdetail" :placeholder="$i18nForm(['placeholder.input', $t('module.basicData.visual.Specs')])" clearable :style="{width: '100%'}" />
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item :label="$t('module.basicData.visual.CurrentState')" prop="status">
|
|
<el-select
|
|
v-model="dataForm.status"
|
|
:disabled="isdetail"
|
|
:placeholder="$i18nForm(['placeholder.input', $t('module.basicData.visual.CurrentState')])"
|
|
clearable
|
|
:style="{width: '100%'}"
|
|
>
|
|
<el-option
|
|
v-for="(item, index) in currentStatusOptions"
|
|
:key="index"
|
|
:label="item.label"
|
|
:value="item.value"
|
|
:disabled="item.disabled"
|
|
/>
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item :label="$t('module.basicData.cache.StockNumber')" prop="locationNum">
|
|
<el-input-number v-model="dataForm.locationNum" :disabled="isdetail" :placeholder="$i18nForm(['placeholder.input', $t('module.basicData.cache.StockNumber')])" :step="1" />
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item :label="$t('module.basicData.cache.AreaNumber')" prop="shelfNum">
|
|
<el-input-number v-model="dataForm.shelfNum" :disabled="isdetail" :placeholder="$i18nForm(['placeholder.input', $t('module.basicData.cache.AreaNumber')])" :step="1" />
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item :label="$t('module.basicData.visual.Remarks')" prop="note">
|
|
<el-input v-model="dataForm.note" :disabled="isdetail" :placeholder="$i18nForm(['placeholder.input', $t('module.basicData.visual.Remarks')])" clearable :style="{width: '100%'}" />
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-form>
|
|
</el-row>
|
|
<div style="margin:20px">
|
|
<el-button type="success" @click="goback()">{{ 'btn.back' | i18nFilter }}</el-button>
|
|
<span v-if="!isdetail">
|
|
<el-button type="primary" @click="dataFormSubmit()">{{ 'btn.save' | i18nFilter }}</el-button>
|
|
<el-button v-if="listQuery.id" type="primary" @click="addNew()">{{ $t('module.basicData.cache.addCacheArea') }}</el-button>
|
|
</span>
|
|
</div>
|
|
<div style="height:380px;overflow:auto">
|
|
<base-table
|
|
:page="listQuery.current"
|
|
:limit="listQuery.size"
|
|
:table-config="tableProps"
|
|
:table-data="list"
|
|
>
|
|
<method-btn
|
|
v-if="!isdetail"
|
|
slot="handleBtn"
|
|
:method-list="tableBtn"
|
|
@clickBtn="handleClick"
|
|
/>
|
|
</base-table>
|
|
</div>
|
|
<cacheArea-add v-if="addOrUpdateVisible" ref="addOrUpdate" :cache-id="listQuery.id" @refreshDataList="getList" />
|
|
</div>
|
|
</template>
|
|
|
|
<script>import i18n from '@/lang'
|
|
import { cacheDetail, cacheUpdate, cacheAdd, cacheCode } from '@/api/basicData/Cache/cache'
|
|
import { areaList, areaDelete } from '@/api/basicData/Cache/area'
|
|
import BaseTable from '@/components/BaseTable'
|
|
import MethodBtn from '@/components/BaseTable/subcomponents/MethodBtn'
|
|
import cacheAreaAdd from './cacheArea-add.vue'
|
|
import shelfBtn from './shelfBtn.vue'
|
|
const tableBtn = [
|
|
{
|
|
type: 'edit',
|
|
btnName: 'btn.edit'
|
|
},
|
|
{
|
|
type: 'delete',
|
|
btnName: 'btn.delete'
|
|
}
|
|
]
|
|
const tableProps = [
|
|
{
|
|
prop: 'name',
|
|
label: i18n.t('module.basicData.cache.AreaName'),
|
|
align: 'center'
|
|
},
|
|
{
|
|
prop: 'code',
|
|
label: i18n.t('module.basicData.cache.AreaCode'),
|
|
align: 'center'
|
|
},
|
|
{
|
|
prop: 'shelfNum',
|
|
label: i18n.t('module.basicData.cache.StorageQuantity'),
|
|
align: 'center'
|
|
},
|
|
{
|
|
prop: 'rowNum',
|
|
label: i18n.t('module.basicData.cache.rowNum'),
|
|
align: 'center'
|
|
},
|
|
{
|
|
prop: 'columnNum',
|
|
label: i18n.t('module.basicData.cache.columnNum'),
|
|
align: 'center'
|
|
},
|
|
{
|
|
prop: 'shelf',
|
|
label: i18n.t('module.basicData.cache.Location'),
|
|
subcomponent: shelfBtn,
|
|
align: 'center'
|
|
}
|
|
]
|
|
|
|
export default {
|
|
components: { BaseTable, MethodBtn, cacheAreaAdd },
|
|
data() {
|
|
return {
|
|
addOrUpdateVisible: false,
|
|
tableBtn,
|
|
trueWidth: 200,
|
|
tableProps,
|
|
list: [],
|
|
dataForm: {
|
|
tareaName: '',
|
|
code: '',
|
|
enName: '',
|
|
abbr: '',
|
|
spec: '',
|
|
status: '',
|
|
locationNum: '',
|
|
shelfNum: '',
|
|
note: ''
|
|
},
|
|
listQuery: {
|
|
current: 1,
|
|
size: 990,
|
|
id: ''
|
|
},
|
|
rules: {
|
|
tareaName: [{
|
|
required: true,
|
|
message: this.$i18nForm(['placeholder.input', this.$t('module.basicData.cache.CacheName')]),
|
|
trigger: 'blur'
|
|
}],
|
|
code: [{
|
|
required: true,
|
|
message: this.$i18nForm(['placeholder.input', this.$t('module.basicData.cache.CacheCode')]),
|
|
trigger: 'blur'
|
|
}]
|
|
},
|
|
currentStatusOptions: [{
|
|
'label': '正常',
|
|
'value': 0
|
|
}, {
|
|
'label': '暂停',
|
|
'value': 1
|
|
}, {
|
|
'label': '维修',
|
|
'value': 2
|
|
}],
|
|
id: '', // 缓存区id
|
|
isdetail: false
|
|
}
|
|
},
|
|
created() {
|
|
this.id = this.$route.query.id
|
|
this.init()
|
|
},
|
|
methods: {
|
|
init() {
|
|
this.isdetail = false
|
|
this.isdetail = Boolean(this.$route.query.isdetail)
|
|
this.listQuery.id = ''
|
|
this.list.splice(0, this.list.length)
|
|
this.$nextTick(() => {
|
|
this.$refs['dataForm'].resetFields()
|
|
if (this.id) {
|
|
cacheDetail(this.id).then(res => {
|
|
this.dataForm = res.data
|
|
})
|
|
this.listQuery.id = this.id
|
|
areaList(this.listQuery).then(response => {
|
|
if (response.data.records) {
|
|
this.list = response.data.records
|
|
} else {
|
|
this.list.splice(0, this.list.length)
|
|
}
|
|
})
|
|
} else {
|
|
cacheCode().then(res => {
|
|
this.dataForm.code = res.data
|
|
})
|
|
}
|
|
})
|
|
},
|
|
getList() {
|
|
areaList(this.listQuery).then(response => {
|
|
if (response.data.records) {
|
|
this.list = response.data.records
|
|
}
|
|
})
|
|
},
|
|
handleClick(raw) {
|
|
if (raw.type === 'delete') {
|
|
this.$confirm(`${this.$t('module.basicData.visual.TipsBefore')}[${raw.data.name}]?`, this.$t('module.basicData.visual.Tips'), {
|
|
confirmButtonText: this.$t('module.basicData.visual.confirmButtonText'),
|
|
cancelButtonText: this.$t('module.basicData.visual.cancelButtonText'),
|
|
type: 'warning'
|
|
}).then(() => {
|
|
areaDelete(raw.data.id).then(response => {
|
|
this.$message({
|
|
message: this.$t('module.basicData.visual.success'),
|
|
type: 'success',
|
|
duration: 1500,
|
|
onClose: () => {
|
|
this.getList()
|
|
}
|
|
})
|
|
})
|
|
}).catch(() => {})
|
|
} else {
|
|
this.addNew(raw.data.id)
|
|
}
|
|
},
|
|
// 表单提交
|
|
dataFormSubmit() {
|
|
this.$refs['dataForm'].validate((valid) => {
|
|
if (valid) {
|
|
const data = {
|
|
'abbr': this.dataForm.abbr,
|
|
'code': this.dataForm.code,
|
|
'status': this.dataForm.status,
|
|
'enName': this.dataForm.enName,
|
|
'tareaName': this.dataForm.tareaName,
|
|
'note': this.dataForm.note,
|
|
'spec': this.dataForm.spec,
|
|
'locationNum': this.dataForm.locationNum,
|
|
'shelfNum': this.dataForm.shelfNum,
|
|
'id': this.id
|
|
}
|
|
if (this.id) {
|
|
cacheUpdate(data).then(res => {
|
|
this.$message({
|
|
message: this.$t('module.basicData.visual.success'),
|
|
type: 'success',
|
|
duration: 1500
|
|
})
|
|
})
|
|
} else {
|
|
cacheAdd(data).then(res => {
|
|
this.$message({
|
|
message: this.$t('module.basicData.visual.success'),
|
|
type: 'success',
|
|
duration: 1500
|
|
})
|
|
this.listQuery.id = res.data.id
|
|
})
|
|
}
|
|
}
|
|
})
|
|
},
|
|
// 新增 / 修改
|
|
addNew(id) {
|
|
this.addOrUpdateVisible = true
|
|
this.$nextTick(() => {
|
|
this.$refs.addOrUpdate.init(id)
|
|
})
|
|
},
|
|
goback() {
|
|
this.$router.go(-1)
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
.drawer-footer {
|
|
width: 100%;
|
|
margin-top: 50px;
|
|
border-top: 1px solid #e8e8e8;
|
|
border-bottom: 1px solid #e8e8e8;
|
|
padding: 10px 50px;
|
|
text-align: left;
|
|
background: #fff;
|
|
}
|
|
</style>
|