|
@@ -1,87 +1,123 @@
|
|
|
<template>
|
|
|
<div class="mainContentBox">
|
|
|
<avue-crud
|
|
|
- ref="crudRef"
|
|
|
- v-model:search="search"
|
|
|
- v-model="form"
|
|
|
- :data="data"
|
|
|
- :option="option"
|
|
|
- v-model:page="page"
|
|
|
- @row-save="createRow"
|
|
|
- @row-update="updateRow"
|
|
|
- @row-del="deleteRow"
|
|
|
- @search-change="searchChange"
|
|
|
- @search-reset="resetChange"
|
|
|
- @size-change="dataList"
|
|
|
- @current-change="dataList"
|
|
|
- @selection-change="selectionChange"
|
|
|
+ ref="crudRef"
|
|
|
+ v-model:search="search"
|
|
|
+ v-model="form"
|
|
|
+ :data="data"
|
|
|
+ :option="option"
|
|
|
+ v-model:page="page"
|
|
|
+ @row-save="createRow"
|
|
|
+ @row-update="updateRow"
|
|
|
+ @row-del="deleteRow"
|
|
|
+ @search-change="searchChange"
|
|
|
+ @search-reset="resetChange"
|
|
|
+ @size-change="dataList"
|
|
|
+ @current-change="dataList"
|
|
|
+ @selection-change="selectionChange"
|
|
|
>
|
|
|
-
|
|
|
<template #state="scope">
|
|
|
<el-switch
|
|
|
- active-value="1"
|
|
|
- inactive-value="0"
|
|
|
- inline-prompt
|
|
|
- active-text="是"
|
|
|
- inactive-text="否"
|
|
|
- v-model="scope.row.state"
|
|
|
- @click="changeItem($event,scope.row)"
|
|
|
- class="ml-2"
|
|
|
- style="--el-switch-on-color: #13ce66; --el-switch-off-color: #ff4949"
|
|
|
+ active-value="1"
|
|
|
+ inactive-value="0"
|
|
|
+ inline-prompt
|
|
|
+ active-text="是"
|
|
|
+ inactive-text="否"
|
|
|
+ v-model="scope.row.state"
|
|
|
+ @click="changeItem($event, scope.row)"
|
|
|
+ class="ml-2"
|
|
|
+ style="--el-switch-on-color: #13ce66; --el-switch-off-color: #ff4949"
|
|
|
/>
|
|
|
</template>
|
|
|
<template #menu-left="{ size }">
|
|
|
<el-button
|
|
|
- type="primary"
|
|
|
- icon="el-icon-plus"
|
|
|
- :size="size"
|
|
|
- @click="openDialog(0, null)"
|
|
|
- >新增</el-button>
|
|
|
+ type="primary"
|
|
|
+ icon="el-icon-plus"
|
|
|
+ :size="size"
|
|
|
+ @click="openDialog(0, null)"
|
|
|
+ >新增</el-button
|
|
|
+ >
|
|
|
</template>
|
|
|
|
|
|
<template #menu="{ size, row, index }">
|
|
|
- <el-button
|
|
|
- type="primary"
|
|
|
- link
|
|
|
- size="small"
|
|
|
- @click="openDialog(1, row)"
|
|
|
- ><i-ep-edit />编辑
|
|
|
+ <el-button type="primary" link size="small" @click="openDialog(1, row)"
|
|
|
+ ><i-ep-edit />编辑
|
|
|
</el-button>
|
|
|
</template>
|
|
|
+ <template #menu-right="{}">
|
|
|
+ <el-dropdown split-button
|
|
|
+ >准备模板导入
|
|
|
+ <template #dropdown>
|
|
|
+ <el-dropdown-menu>
|
|
|
+ <el-dropdown-item
|
|
|
+ @click="downloadTemplate('/api/v1/prepareTemplate/template')"
|
|
|
+ >
|
|
|
+ <i-ep-download />下载模板
|
|
|
+ </el-dropdown-item>
|
|
|
+ <el-dropdown-item @click="importExcelData">
|
|
|
+ <i-ep-top />导入数据
|
|
|
+ </el-dropdown-item>
|
|
|
+ </el-dropdown-menu>
|
|
|
+ </template>
|
|
|
+ </el-dropdown>
|
|
|
+ </template>
|
|
|
</avue-crud>
|
|
|
<el-dialog
|
|
|
- v-model="dialog1.visible"
|
|
|
- :title="dialog1.title"
|
|
|
- width="45%"
|
|
|
- @close="dialog1.visible = false"
|
|
|
+ v-model="dialog1.visible"
|
|
|
+ :title="dialog1.title"
|
|
|
+ width="45%"
|
|
|
+ @close="dialog1.visible = false"
|
|
|
>
|
|
|
- <el-form ref="dataFormRef" :model="form" label-width="90px" :rules="rules">
|
|
|
+ <el-form
|
|
|
+ ref="dataFormRef"
|
|
|
+ :model="form"
|
|
|
+ label-width="90px"
|
|
|
+ :rules="rules"
|
|
|
+ >
|
|
|
<el-row :gutter="24">
|
|
|
<el-col :span="8">
|
|
|
- <el-form-item label="物料编码" prop="materialCode">
|
|
|
- <el-input v-model="form.materialCode" @click="openDialog" readOnly placeholder="请选择物料" />
|
|
|
- </el-form-item>
|
|
|
+ <el-form-item label="物料编码" prop="materialCode">
|
|
|
+ <el-input
|
|
|
+ v-model="form.materialCode"
|
|
|
+ @click="openDialog"
|
|
|
+ readOnly
|
|
|
+ placeholder="请选择物料"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
</el-col>
|
|
|
<el-col :span="8">
|
|
|
- <el-form-item label="物料名称" prop="materialName">
|
|
|
- <el-input v-model="form.materialName" disabled placeholder="请选择物料" />
|
|
|
- </el-form-item>
|
|
|
+ <el-form-item label="物料名称" prop="materialName">
|
|
|
+ <el-input
|
|
|
+ v-model="form.materialName"
|
|
|
+ disabled
|
|
|
+ placeholder="请选择物料"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
</el-col>
|
|
|
<el-col :span="8">
|
|
|
<el-form-item label="物料型号" prop="materialModel">
|
|
|
- <el-input v-model="form.materialModel" disabled placeholder="请选择物料" />
|
|
|
+ <el-input
|
|
|
+ v-model="form.materialModel"
|
|
|
+ disabled
|
|
|
+ placeholder="请选择物料"
|
|
|
+ />
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
|
<el-row :gutter="24">
|
|
|
<el-col :span="24">
|
|
|
<el-form-item label="物料模板" prop="template">
|
|
|
- <el-select v-model="form.template" multiple placeholder="请选择模板" @change="changeTemplate">
|
|
|
+ <el-select
|
|
|
+ v-model="form.template"
|
|
|
+ multiple
|
|
|
+ placeholder="请选择模板"
|
|
|
+ @change="changeTemplate"
|
|
|
+ >
|
|
|
<el-option
|
|
|
- v-for="item in templates"
|
|
|
- :label="item.dictLabel"
|
|
|
- :value="item.dictValue"
|
|
|
- :key="item.dictLabel"
|
|
|
+ v-for="item in templates"
|
|
|
+ :label="item.dictLabel"
|
|
|
+ :value="item.dictValue"
|
|
|
+ :key="item.dictLabel"
|
|
|
/>
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
@@ -90,14 +126,17 @@
|
|
|
<el-row :gutter="24" v-for="item in clickTemplates">
|
|
|
<el-col :span="24">
|
|
|
<el-form-item :label="item.name">
|
|
|
- <el-switch
|
|
|
+ <el-switch
|
|
|
class="mb-2"
|
|
|
- style="--el-switch-on-color: #13ce66; --el-switch-off-color: #ff4949"
|
|
|
+ style="
|
|
|
+ --el-switch-on-color: #13ce66;
|
|
|
+ --el-switch-off-color: #ff4949;
|
|
|
+ "
|
|
|
active-text="完成"
|
|
|
inactive-text="未完成"
|
|
|
active-value="1"
|
|
|
inactive-value="0"
|
|
|
- />
|
|
|
+ />
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
@@ -110,13 +149,14 @@
|
|
|
</template>
|
|
|
</el-dialog>
|
|
|
<el-dialog
|
|
|
- v-model="dialog.visible"
|
|
|
- :title="dialog.title"
|
|
|
- width="80%"
|
|
|
- @close="dialog.visible = false"
|
|
|
+ v-model="dialog.visible"
|
|
|
+ :title="dialog.title"
|
|
|
+ width="80%"
|
|
|
+ @close="dialog.visible = false"
|
|
|
>
|
|
|
<choice-item-page @material-info="materialInfo" />
|
|
|
</el-dialog>
|
|
|
+ <ExcelUpload ref="uploadRef" @finished="uploadFinished" />
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
@@ -133,7 +173,8 @@ const { form, data, option, search, page, toDeleteIds, Methords, Utils } =
|
|
|
useCrud({
|
|
|
src: "/api/v1/prepareTemplate",
|
|
|
});
|
|
|
-const { dataList, createRow, updateRow, deleteRow, searchChange, resetChange } = Methords; //增删改查
|
|
|
+const { dataList, createRow, updateRow, deleteRow, searchChange, resetChange } =
|
|
|
+ Methords; //增删改查
|
|
|
const { selectionChange, multipleDelete } = Methords; //选中和批量删除事件
|
|
|
const { checkBtnPerm, downloadTemplate, exportData } = Utils; //按钮权限等工具
|
|
|
const dataFormRef = ref(ElForm);
|
|
@@ -146,54 +187,74 @@ const dialog1 = reactive({
|
|
|
title: "模板保存",
|
|
|
visible: false,
|
|
|
});
|
|
|
+const uploadRef = ref(null);
|
|
|
+const importExcelData = () => {
|
|
|
+ if (uploadRef.value) {
|
|
|
+ uploadRef.value.show("/api/v1/prepareTemplate/importExcel");
|
|
|
+ }
|
|
|
+};
|
|
|
+const uploadFinished = () => {
|
|
|
+ // 上传完成后的刷新操作
|
|
|
+ page.currentPage = 1;
|
|
|
+ dataList();
|
|
|
+};
|
|
|
const openDialog = (type, row) => {
|
|
|
- if(type === 0 ){
|
|
|
+ if (type === 0) {
|
|
|
form.value.materialCode = "";
|
|
|
- form.value.materialName = ""
|
|
|
- form.value.materialModel = ""
|
|
|
- form.value.template = []
|
|
|
- clickTemplates.value = []
|
|
|
+ form.value.materialName = "";
|
|
|
+ form.value.materialModel = "";
|
|
|
+ form.value.template = [];
|
|
|
+ templates.value.forEach((item)=>{
|
|
|
+ form.value.template.push(item.dictValue)
|
|
|
+ })
|
|
|
+ clickTemplates.value = [];
|
|
|
dialog1.visible = true;
|
|
|
- }else if(type === 1){
|
|
|
- form.value = row
|
|
|
- if(!Array.isArray(row.template)){
|
|
|
- form.value.template = eval("(" +row.template + ")")
|
|
|
+ } else if (type === 1) {
|
|
|
+ form.value = row;
|
|
|
+ if (!Array.isArray(row.template)) {
|
|
|
+ form.value.template = eval("(" + row.template + ")");
|
|
|
}
|
|
|
//form.value.templateList = row.template.split(",")
|
|
|
- changeTemplate()
|
|
|
+ changeTemplate();
|
|
|
dialog1.visible = true;
|
|
|
- }else{
|
|
|
+ } else {
|
|
|
dialog.visible = true;
|
|
|
}
|
|
|
};
|
|
|
-const changeItem =(obj,row) => {
|
|
|
- form.value = {id: row.id,state: row.state}
|
|
|
- updateRow()
|
|
|
- form.value = null
|
|
|
-}
|
|
|
-const templates = ref([])
|
|
|
-const clickTemplates = ref([])
|
|
|
-const changeTemplate = ()=>{
|
|
|
- clickTemplates.value = []
|
|
|
- if(form.value.template){
|
|
|
- for(let i = 0 ; i< form.value.template.length; i ++){
|
|
|
- clickTemplates.value.push({value: form.value.template[i],name: templates.value.find(option => option.dictValue === form.value.template[i]).dictLabel});
|
|
|
+const changeItem = (obj, row) => {
|
|
|
+ form.value = { id: row.id, state: row.state };
|
|
|
+ updateRow();
|
|
|
+ form.value = null;
|
|
|
+ dataList();
|
|
|
+};
|
|
|
+const templates = ref([]);
|
|
|
+const clickTemplates = ref([]);
|
|
|
+const changeTemplate = () => {
|
|
|
+ clickTemplates.value = [];
|
|
|
+ if (form.value.template) {
|
|
|
+ for (let i = 0; i < form.value.template.length; i++) {
|
|
|
+ clickTemplates.value.push({
|
|
|
+ value: form.value.template[i],
|
|
|
+ name: templates.value.find(
|
|
|
+ (option) => option.dictValue === form.value.template[i]
|
|
|
+ ).dictLabel,
|
|
|
+ });
|
|
|
}
|
|
|
}
|
|
|
-}
|
|
|
-const onSubmit = (done,loading) => {
|
|
|
+};
|
|
|
+const onSubmit = (done, loading) => {
|
|
|
dataFormRef.value.validate((isValid) => {
|
|
|
if (isValid) {
|
|
|
- if(!form.value.id){
|
|
|
- createRow(done,loading)
|
|
|
- }else{
|
|
|
- updateRow(done,loading)
|
|
|
+ if (!form.value.id) {
|
|
|
+ createRow(done, loading);
|
|
|
+ } else {
|
|
|
+ updateRow(done, loading);
|
|
|
}
|
|
|
- dialog1.visible = false
|
|
|
+ dialog1.visible = false;
|
|
|
}
|
|
|
});
|
|
|
- console.log('submit!')
|
|
|
-}
|
|
|
+ console.log("submit!");
|
|
|
+};
|
|
|
const materialInfo = (value) => {
|
|
|
form.value.materialCode = value.materialCode;
|
|
|
form.value.materialName = value.materialName;
|
|
@@ -209,7 +270,7 @@ option.value = Object.assign(option.value, {
|
|
|
menuBtn: true,
|
|
|
menuWidth: 150,
|
|
|
addBtn: false,
|
|
|
- dialogWidth: '45%', // 设置编辑弹窗的宽度为50%
|
|
|
+ dialogWidth: "45%", // 设置编辑弹窗的宽度为50%
|
|
|
column: [
|
|
|
{
|
|
|
label: "物料编码",
|
|
@@ -265,13 +326,13 @@ option.value = Object.assign(option.value, {
|
|
|
label: "创建时间",
|
|
|
prop: "created",
|
|
|
width: 200,
|
|
|
- display: false
|
|
|
+ display: false,
|
|
|
},
|
|
|
{
|
|
|
label: "创建人",
|
|
|
width: 200,
|
|
|
prop: "creator",
|
|
|
- display: false
|
|
|
+ display: false,
|
|
|
},
|
|
|
],
|
|
|
});
|
|
@@ -282,11 +343,10 @@ const rules = reactive({
|
|
|
|
|
|
onMounted(() => {
|
|
|
dataList();
|
|
|
- queryDictDataByType("prepare_template").then((res)=>{
|
|
|
- templates.value = res.data
|
|
|
- })
|
|
|
+ queryDictDataByType("prepare_template").then((res) => {
|
|
|
+ templates.value = res.data;
|
|
|
+ });
|
|
|
});
|
|
|
-
|
|
|
</script>
|
|
|
<style scoped>
|
|
|
:deep(.el-progress-bar__innerText) {
|