wms_client_kate_suzhou/src/layout/wmsConfig.vue
liangzhou 0841251bdd 代码更新:
1. 增加工站配置的导入功能。
2. 修复userName字段设定不正确的问题。
2024-08-12 16:38:52 +08:00

266 lines
11 KiB
Vue

<template>
<div style="margin-bottom: 10px">
<el-config-provider :locale="zhCn">
<el-row>
<el-input v-model="configNameQuery" style="width: 256px; margin-right: 10px;" placeholder="配置名称"
:suffix-icon="Search" />
<el-button type="primary" @click="search()">搜索</el-button>
<el-button type="warning" @click="reset()">重置</el-button>
</el-row>
<br />
<el-table :data="configList" stripe border v-loading="loading" class="table-class" max-height="550px"
highlight-current-row @row-click="getCurrentRow" :header-cell-style="{ 'text-align': 'center' }"
:cell-style="{ 'text-align': 'center' }">
<el-table-column width="65px" fixed="left">
<template v-slot="scope">
<el-radio :label="scope.row.configId" v-model="configId">&nbsp;</el-radio>
</template>
</el-table-column>
<el-table-column prop="configId" label="配置id" fixed="left" min-width="80px" show-overflow-tooltip />
<el-table-column prop="configName" label="配置名称" fixed="left" min-width="120px" show-overflow-tooltip />
<el-table-column prop="configKey" label="配置键" show-overflow-tooltip min-width="120px" />
<el-table-column prop="configValue" label="配置值" show-overflow-tooltip min-width="140px" />
<el-table-column prop="configType" label="配置类型" :formatter="configTypeFormat" min-width="100px"
show-overflow-tooltip />
<el-table-column fixed="right" label="操作" width="120px">
<template v-slot="scope">
<el-button plain type="primary" @click="editCurrentRow(scope.row)">编辑</el-button>
</template>
</el-table-column>
</el-table>
<br />
<el-pagination v-model:current-page="currentPage" v-model:page-size="pageSize" :page-sizes="[10, 25, 50]"
:small="false" :disabled="false" :background="false" :default-page-size="10" @size-change="search"
@current-change="search" layout="total, sizes, prev, pager, next, jumper" :total="total" />
<el-dialog v-model="dialogVisible" title="库存信息" width="40%" draggable :show-close="false">
<el-form ref="configFormRef" :model="configFormEntity" :label-position="labelPosition"
label-width="100px" style="max-width: 100%" :rules="rules" status-icon>
<el-row :gutter="16">
<el-col :span="12" :offset="0">
<el-form-item label="配置名称" prop="configName">
<el-input v-model="configFormEntity.configName" disabled />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="配置类型" prop="configType">
<el-select-v2 v-model="configFormEntity.configType" placeholder="请选择配置类型"
:options="configTypeOptions" disabled></el-select-v2>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="16">
<el-col :span="12" :offset="0">
<el-form-item label="配置键" prop="configKey">
<el-input v-model="configFormEntity.configKey" disabled />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="配置值" prop="configValue">
<el-input v-if="configFormEntity.configType == '1'" type="textarea" :rows="1"
v-model="configFormEntity.configValue" placeholder="" :maxlength="-1"
:show-word-limit="false" :autosize="{ minRows: 1, maxRows: 4 }">
</el-input>
<el-select v-if="configFormEntity.configType == '2'"
v-model="configFormEntity.configValue" multiple collapse-tags collapse-tags-tooltip
:placeholder="'请选择' + configFormEntity.configName">
<el-option v-for="(value, index) in mails" :key="index" :label="value"
:value="value" />
</el-select>
<el-switch v-if="configFormEntity.configType == '3'" style="margin-left: 5px;"
v-model="configFormEntity.configValue" active-value="1" inactive-value="0" />
</el-form-item>
</el-col>
</el-row>
</el-form>
<template #footer>
<span class="dialog-footer">
<el-button @click="dialogVisible = false">取消</el-button>
<el-button type="primary" @click="submitChange()">
确定
</el-button>
</span>
</template>
</el-dialog>
</el-config-provider>
</div>
</template>
<script setup>
import { getConfigsByPage, updateConfig } from '@/api/config.js'
import { configTypeFormatter } from '@/utils/formatter.js'
import zhCn from 'element-plus/dist/locale/zh-cn.mjs'
import { Search } from '@element-plus/icons-vue'
import { ref, reactive } from 'vue'
import { ElMessage } from 'element-plus'
import store from '@/store'
</script>
<script>
export default {
name: 'wmsConfig',
data() {
return {
pageInfo: {},
configList: [],
currentPage: 1,
pageSize: 10,
total: 0,
configNameQuery: '',
loading: false,
configId: '',
configFormRef: ref(),
configFormEntity: reactive({}),
rules: reactive({
configId: [
{ required: true, message: '请输入配置id' }
],
configName: [
{ required: true, message: '请输入配置名称' }
],
configKey: [
{ required: true, message: '请输入配置键' }
],
configValue: [
{ required: true, message: '请输入配置值' }
],
configType: [
{ required: true, message: '请输入配置类型' }
]
}),
labelPosition: 'top',
dialogVisible: false,
configTypeOptions: [
{
value: '1',
label: '输入框'
},
{
value: '2',
label: '下拉多选'
},
{
value: '3',
label: '开关'
}
],
mails: []
}
},
mounted() {
this.search()
},
methods: {
configTypeFormat: (row, column, cellValue, index) => {
return configTypeFormatter(cellValue)
},
search() {
this.loading = true
const request = {
pageNo: this.currentPage,
pageSize: this.pageSize,
configName: this.configNameQuery.trim(),
userName: store.getters.getUserName
}
getConfigsByPage(request).then(res => {
const tableResponse = res.data
if (tableResponse.code == 0) {
this.configList = tableResponse.returnData.lists
this.configList.forEach((config) => {
if (config.configType == '2') {
const tempArray = config.configValue.split(';')
config.configValue = tempArray
}
if (config.configKey == 'MAIL_ADDRESS') {
const tempArray = config.configValue.split(';')
this.mails = tempArray
}
})
this.total = tableResponse.returnData.total
} else {
ElMessage.error(tableResponse.message)
}
}).catch(err => {
console.log(err)
ElMessage.error('查询配置错误')
})
this.loading = false
},
reset() {
this.configNameQuery = ''
this.search()
},
getCurrentRow(row) {
this.configId = row.configId
},
editCurrentRow(row) {
this.configFormEntity = reactive({
configId: row.configId,
configName: row.configName,
configKey: row.configKey,
configValue: row.configValue,
configType: row.configType
})
this.dialogVisible = true
},
submitChange() {
const request = {
configId: this.configFormEntity.configId,
configName: this.configFormEntity.configName,
configKey: this.configFormEntity.configKey,
configValue: this.configFormEntity.configValue,
configType: this.configFormEntity.configType,
userName: store.getters.getUserName
}
updateConfig(request).then(res => {
if (res.data.code == 0) {
this.dialogVisible = false
ElMessage({
message: '更新系统配置成功',
type: 'success'
})
this.search()
} else {
ElMessage.error(res.data.message)
}
}).catch(err => {
ElMessage({
message: '更新系统配置失败: ' + err,
type: 'error',
showClose: true
})
})
}
},
}
</script>
<style scoped>
.el-pagination {
padding-left: 5px;
}
.el-row .el-button {
width: 72px;
margin-left: 0px;
margin-right: 5px;
}
.table-class {
width: 100%;
}
.el-row .el-form-item .el-select-v2 {
width: 100% !important;
}
.el-row .el-form-item .el-input-number {
width: 100% !important;
}
.el-row .el-form-item .el-select {
width: 100% !important;
}
.el-row .el-form-item .el-input {
width: 100% !important;
}
</style>