Commit d0909569 authored by Mr.Tang's avatar Mr.Tang

角色管理 制造商信息

parent 1181abe5
// utils/factoryFormatter.js
export function formatFactories(factoryJson) {
if (!factoryJson) return '';
try {
const factoryObj = JSON.parse(factoryJson);
return Object.values(factoryObj).join('、');
} catch (e) {
console.error('解析制造工厂JSON失败:', e);
return factoryJson; // 如果解析失败,返回原始数据
}
}
......@@ -4,15 +4,16 @@
<el-form-item label="工厂编号" prop="factoryCode">
<el-input
v-model="queryParams.factoryCode"
placeholder="请输入工厂编号"
placeholder="请输入"
clearable
@keyup.enter="handleQuery"
style="width: 120px"
/>
</el-form-item>
<el-form-item label="制造商" prop="manufacturer">
<el-input
v-model="queryParams.manufacturer"
placeholder="请输入制造商"
placeholder="请选择"
clearable
@keyup.enter="handleQuery"
/>
......@@ -20,7 +21,7 @@
<el-form-item label="生产厂" prop="productionFactory">
<el-input
v-model="queryParams.productionFactory"
placeholder="请输入生产厂"
placeholder="请选择"
clearable
@keyup.enter="handleQuery"
/>
......@@ -28,47 +29,65 @@
<el-form-item label="生产地址" prop="productionAddress">
<el-input
v-model="queryParams.productionAddress"
placeholder="请输入生产地址"
placeholder="请输入"
clearable
@keyup.enter="handleQuery"
style="width: 120px"
/>
</el-form-item>
<el-form-item label="制造工厂" prop="manufacturingFactory">
<el-input
v-model="queryParams.manufacturingFactory"
placeholder="请输入"
clearable
@keyup.enter="handleQuery"
style="width: 120px"
/>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
<el-button type="primary" @click="handleQuery">搜索</el-button>
<el-button @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
<el-form-item>
<el-button
type="primary"
plain
icon="Plus"
@click="handleAdd"
v-hasPermi="['control:manufacturer:add']"
>新增</el-button>
</el-form-item>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button
type="primary"
plain
icon="Plus"
@click="handleAdd"
v-hasPermi="['control:manufacturer:add']"
>新增</el-button>
</el-col>
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
<el-table
v-loading="loading"
:data="manufacturerList"
@selection-change="handleSelectionChange"
style="width: 100%">
<!-- 固定左侧列 -->
<el-table-column label="序号" align="center" prop="id" width="80" fixed="left" />
<el-table-column label="工厂编号" align="center" prop="factoryCode" width="180" fixed="left" />
<el-table-column label="制造商" align="center" prop="manufacturer" width="210" fixed="left" />
<el-table-column label="生产厂" align="center" prop="productionFactory" width="300" fixed="left" />
<el-table-column label="生产地址" align="center" prop="productionAddress" width="300" fixed="left" />
<el-table v-loading="loading" :data="manufacturerList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="序号" align="center" prop="id" />
<el-table-column label="工厂编号" align="center" prop="factoryCode" />
<el-table-column label="制造商" align="center" prop="manufacturer" />
<el-table-column label="生产厂" align="center" prop="productionFactory" />
<el-table-column label="生产地址" align="center" prop="productionAddress" />
<el-table-column label="制造工厂" align="center" prop="manufacturingFactory" />
<el-table-column label="制造商名称(英文)" align="center" prop="manufacturerEn" />
<el-table-column label="生产厂名称(英文)" align="center" prop="productionFactoryEn" />
<el-table-column label="生产地址(英文)" align="center" prop="productionAddressEn" />
<el-table-column label="更新时间" align="center" prop="updateTime" />
<el-table-column label="更新人" align="center" prop="updateBy" />
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<!-- 可滚动部分 -->
<el-table-column prop="manufacturingFactory" label="制造工厂" width="150">
<template #default="{ row }">
{{ formatFactoryDisplay(row.manufacturingFactory) }}
</template>
</el-table-column>
<el-table-column label="制造商名称(英文)" align="center" prop="manufacturerEn" width="250" />
<el-table-column label="生产厂名称(英文)" align="center" prop="productionFactoryEn" width="200" />
<el-table-column label="生产地址(英文)" align="center" prop="productionAddressEn" width="250" />
<el-table-column label="更新时间" align="center" prop="updateTime" width="180" />
<el-table-column label="更新人" align="center" prop="updateBy" width="120" />
<!-- 固定右侧操作列 -->
<el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="150" fixed="right">
<template #default="scope">
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['control:manufacturer:edit']">编辑</el-button>
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['control:manufacturer:remove']">删除</el-button>
<el-button link type="primary" @click="handleUpdate(scope.row)" v-hasPermi="['control:manufacturer:edit']">编辑</el-button>
<el-button link type="primary" @click="handleDelete(scope.row)" v-hasPermi="['control:manufacturer:remove']" style='color: red'>删除</el-button>
</template>
</el-table-column>
</el-table>
......@@ -83,18 +102,18 @@
<!-- 添加或修改制造商管理对话框 -->
<el-dialog :title="title" v-model="open" width="500px" append-to-body>
<el-form ref="manufacturerRef" :model="form" :rules="rules" label-width="80px">
<el-form ref="manufacturerRef" :model="form" :rules="rules" label-width="130px">
<el-form-item label="工厂编号" prop="factoryCode">
<el-input v-model="form.factoryCode" placeholder="请输入工厂编号" />
<el-input v-model="form.factoryCode" placeholder="请输入工厂编号" :disabled="isEditMode"/>
</el-form-item>
<el-form-item label="制造商" prop="manufacturer">
<el-input v-model="form.manufacturer" placeholder="请输入制造商" />
<el-input v-model="form.manufacturer" placeholder="请输入制造商" :disabled="isEditMode"/>
</el-form-item>
<el-form-item label="生产厂" prop="productionFactory">
<el-input v-model="form.productionFactory" placeholder="请输入生产厂" />
<el-input v-model="form.productionFactory" placeholder="请输入生产厂" :disabled="isEditMode"/>
</el-form-item>
<el-form-item label="生产地址" prop="productionAddress">
<el-input v-model="form.productionAddress" placeholder="请输入生产地址" />
<el-input v-model="form.productionAddress" placeholder="请输入生产地址" :disabled="isEditMode"/>
</el-form-item>
<el-form-item label="制造商(英文)" prop="manufacturerEn">
<el-input v-model="form.manufacturerEn" placeholder="请输入制造商英文" />
......@@ -105,13 +124,15 @@
<el-form-item label="生产地址(英文)" prop="productionAddressEn">
<el-input v-model="form.productionAddressEn" placeholder="请输入生产地址英文" />
</el-form-item>
<div>
<FactorySelector
:initialData="initialFactoryData"
@update-success="handleUpdateSuccess"
@cancel="handleCancel"
/>
</div>
<el-form-item label="制造工厂" prop="manufacturingFactory">
<el-checkbox-group v-model="selectedFactories">
<div style="display: flex; flex-wrap: wrap;">
<div v-for="(factory, index) in allFactories" :key="index" style="width: 33%; margin-bottom: 10px;">
<el-checkbox :label="factory">{{ factory }}</el-checkbox>
</div>
</div>
</el-checkbox-group>
</el-form-item>
</el-form>
<template #footer>
<div class="dialog-footer">
......@@ -124,12 +145,11 @@
</template>
<script setup name="Manufacturer">
import { ref } from 'vue'
import { reactive,ref,computed, watch,toRefs} from 'vue'
import { listManufacturer, getManufacturer, delManufacturer, addManufacturer, updateManufacturer,getfactory } from "@/api/system/basicdata/manufacturer";
import { formatFactories } from '@/utils/factoryFormatter';
const { proxy } = getCurrentInstance();
const manufacturerList = ref([]);
const open = ref(false);
const loading = ref(true);
const showSearch = ref(true);
......@@ -140,26 +160,47 @@ const total = ref(0);
const title = ref("");
const initialFactoryData = ref({}) // 从API获取的初始数据
const manufacturerList = ref([
]);
const currentManufacturer = ref(null);
const formatFactoryDisplay = (factoryJson) => {
return formatFactories(factoryJson);
};
// 选中的工厂列表
const selectedFactories = ref([]);
// 监听表单数据变化,初始化选中的工厂
const loadInitialData=function getFactoryList() {
getfactory().then(response => {
initialFactoryData.value = response.rows;
});
}
const data = reactive({
form: {},
// 表单数据
form: {
factoryCode: '',
manufacturer: '',
productionFactory: '',
productionAddress: '',
manufacturerEn: '',
productionFactoryEn: '',
productionAddressEn: '',
manufacturingFactory: {}, // 或 '{}'(根据后端需求)
},
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 10,
factoryCode: null,
manufacturer: null,
productionFactory: null,
productionAddress: null,
manufacturerEn: null,
productionFactoryEn: null,
productionAddressEn: null,
manufacturingFactory: null,
factoryCode: undefined, // 或 ''
manufacturer: undefined,
productionFactory: undefined,
productionAddress: undefined,
manufacturerEn: undefined,
productionFactoryEn: undefined,
productionAddressEn: undefined,
manufacturingFactory: undefined,
},
// 验证规则(仅保留用户需输入的字段)
rules: {
factoryCode: [
{ required: true, message: "工厂编号不能为空", trigger: "blur" }
......@@ -173,38 +214,39 @@ const data = reactive({
productionAddress: [
{ required: true, message: "生产地址不能为空", trigger: "blur" }
],
manufacturerEn: [
{ required: true, message: "制造商英文不能为空", trigger: "blur" }
],
productionFactoryEn: [
{ required: true, message: "生产厂英文不能为空", trigger: "blur" }
],
productionAddressEn: [
{ required: true, message: "生产地址英文不能为空", trigger: "blur" }
],
// 英文字段可选是否必填
manufacturingFactory: [
{ required: true, message: "制造工厂不能为空", trigger: "blur" }
],
createBy: [
{ required: true, message: "创建人不能为空", trigger: "blur" }
],
createTime: [
{ required: true, message: "创建时间不能为空", trigger: "blur" }
],
updateBy: [
{ required: true, message: "更新人不能为空", trigger: "blur" }
],
updateTime: [
{ required: true, message: "更新时间不能为空", trigger: "blur" }
],
delFlag: [
{ required: true, message: "删除状态不能为空", trigger: "blur" }
{ required: true, message: "请至少选择一个制造工厂", trigger: "change" }
]
}
});
const { queryParams, form, rules } = toRefs(data);
// 所有可选的工厂列表
const allFactories = ref([
'整车二工厂', '整车三工厂', '整车四工厂',
'智造一工厂', '智造二工厂', '大连工厂',
'青岛工厂', '鄂尔多斯工厂', '开封工厂',
'城南工厂', '城北工厂', '齐河工厂',
'石家庄工厂'
]);
watch(() => form.value.manufacturingFactory, (newVal) => {
try {
const factoryObj = JSON.parse(newVal || '{}');
selectedFactories.value = Object.values(factoryObj);
} catch (e) {
selectedFactories.value = [];
}
}, { immediate: true });
// 监听选中的工厂变化,更新表单数据
watch(selectedFactories, (newVal) => {
const factoryObj = {};
newVal.forEach((item, index) => {
factoryObj[index] = item;
});
form.value.manufacturingFactory = JSON.stringify(factoryObj);
}, { deep: true });
/** 查询制造商管理列表 */
function getList() {
loading.value = true;
......@@ -247,7 +289,6 @@ function reset() {
function handleQuery() {
queryParams.value.pageNum = 1;
getList();
loadInitialData();
}
/** 重置按钮操作 */
......@@ -269,7 +310,9 @@ function handleAdd() {
open.value = true;
title.value = "添加制造商管理";
}
const isEditMode = computed(() => {
return title.value === "编辑";
});
/** 修改按钮操作 */
function handleUpdate(row) {
reset();
......@@ -290,14 +333,12 @@ function submitForm() {
proxy.$modal.msgSuccess("修改成功");
open.value = false;
getList();
loadInitialData();
});
} else {
addManufacturer(form.value).then(response => {
proxy.$modal.msgSuccess("新增成功");
open.value = false;
getList();
loadInitialData();
});
}
}
......
......@@ -10,7 +10,7 @@
<el-form-item label="角色名称" prop="roleName">
<el-input
v-model="queryParams.roleName"
placeholder="请输入角色名称"
placeholder="角色名称"
clearable
style="width: 240px"
@keyup.enter="handleQuery"
......@@ -43,11 +43,7 @@
@click="handleAdd"
>新建角色</el-button>
</el-form-item>
</el-form>
<el-row :gutter="10" class="mb8">
</el-row>
<!-- 表格数据 -->
<el-table
......@@ -55,22 +51,24 @@
:data="roleList"
@selection-change="handleSelectionChange"
>
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="序号" prop="roleId" width="120" />
<!-- <el-table-column type="selection" width="55" align="center" />-->
<el-table-column label="序号" prop="roleId" width="120" align="center"/>
<el-table-column
label="角色名称"
prop="roleName"
:show-overflow-tooltip="true"
width="150"
align="center"
/>
<el-table-column
label="权限字符"
prop="roleKey"
:show-overflow-tooltip="true"
width="150"
align="center"
/>
<el-table-column label="显示顺序" prop="roleSort" width="100" />
<el-table-column label="角色状态" align="center" width="100">
<el-table-column label="显示顺序" prop="roleSort" width="100" align="center"/>
<el-table-column label="角色状态" align="center" width="100" >
<template #default="scope">
<el-switch
v-model="scope.row.status"
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment