Browse Source

一维表导入

pull/154/head
wangxy 3 years ago
parent
commit
83b5df2ad8
5 changed files with 604 additions and 0 deletions
  1. +6
    -0
      src/router/system.js
  2. +7
    -0
      src/server/api.js
  3. +304
    -0
      src/views/system/oneimport/addOrEdit.vue
  4. +201
    -0
      src/views/system/oneimport/index.vue
  5. +86
    -0
      src/views/system/oneimport/upload.vue

+ 6
- 0
src/router/system.js View File

@ -40,6 +40,12 @@ const stystem = {
title: "流水号定义",
component: () => import("@/views/system/serialNumber"),
},
{
icon: "el-icon-document",
path: "/system/oneimport",
title: "一维表导入",
component: () => import("@/views/system/oneimport"),
},
{
icon: "el-icon-document",
path: "/system/printer",


+ 7
- 0
src/server/api.js View File

@ -62,6 +62,13 @@ export const uploadExcel = (param, customerId, versionId) =>
headers: { "Content-Type": "multipart/form-data" },
data: param,
});
export const readexcel = (param, script) =>
service.request({
url: "/admin/base/script/readexcel?script=" + script,
method: "post",
headers: { "Content-Type": "multipart/form-data" },
data: param,
});
export const bulkimportfile = (data) =>
service.request({
url: "/admin/ap/custdemandverhead/bulkimportfile",


+ 304
- 0
src/views/system/oneimport/addOrEdit.vue View File

@ -0,0 +1,304 @@
<template>
<el-dialog
:title="isAddOrEdit=='edit'?'修改':'新增'"
model-value
width="90%"
:close-on-click-modal="false"
:before-close="cancel"
>
<el-form
ref="formData"
:model="formData"
:rules="rules"
label-width="130px"
v-loading="loading"
>
<el-row>
<el-col :span="8">
<el-form-item :label="getColumnName('Script-Script')" prop="Script-Script">
<el-input v-model="formData['Script-Script']" :disabled="isAddOrEdit==='edit'" placeholder="请输入" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item :label="getColumnName('Script-Bez')" prop="Script-Bez">
<el-input v-model="formData['Script-Bez']" placeholder="请输入" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item :label="getColumnName('Script-ScriptTable')" prop="Script-ScriptTable">
<!-- <el-input v-model="formData['Script-ScriptTable']" placeholder="请输入" /> -->
<el-input v-model="formData['Script-ScriptTable']" clearable>
<template #append>
<el-button type="primary" size="small" @click="getColumnEvent">获取表字段</el-button>
</template>
</el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item :label="getColumnName('Script-ScriptType')">
<el-input v-model="formData['Script-ScriptType']" placeholder="请输入" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item :label="getColumnName('Script-FilePath')">
<el-input v-model="formData['Script-FilePath']" placeholder="请输入" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item :label="getColumnName('Script-UseHead')">
<el-input-number v-model="formData['Script-UseHead']" placeholder="请输入" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item :label="getColumnName('Script-ClearTable')">
<el-input-number v-model="formData['Script-ClearTable']" placeholder="请输入" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item :label="getColumnName('Script-StartRow')">
<el-input-number v-model="formData['Script-StartRow']" placeholder="请输入" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item :label="getColumnName('Script-StartCol')">
<el-input-number v-model="formData['Script-StartCol']" placeholder="请输入" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item :label="getColumnName('Script-AppendNewRecord')">
<el-input-number v-model="formData['Script-AppendNewRecord']" placeholder="请输入" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item :label="getColumnName('Script-UpdateRecord')">
<el-input-number v-model="formData['Script-UpdateRecord']" placeholder="请输入" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item :label="getColumnName('Script-AppendAndUpdateRecord')">
<el-input-number v-model="formData['Script-AppendAndUpdateRecord']" placeholder="请输入" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item :label="getColumnName('Script-CallSpecFunc')">
<el-input-number v-model="formData['Script-CallSpecFunc']" placeholder="请输入" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item :label="getColumnName('Script-CallFunction')">
<el-input v-model="formData['Script-CallFunction']" placeholder="请输入" />
</el-form-item>
</el-col>
<el-col :span="24">
<el-table
style="width: 100%;margin-bottom:10px;"
height="400px"
border
size="mini"
:data="formData['Script-ScriptItem']">
<el-table-column :label="getColumnName('ScriptItem-TabMapCol')">
<template #default="scope">
<el-input v-model="scope.row['ScriptItem-TabMapCol']" clearable placeholder="请输入" />
</template>
</el-table-column>
<el-table-column :label="getColumnName('ScriptItem-ColNo')">
<template #default="scope">
<el-input-number v-model="scope.row['ScriptItem-ColNo']" clearable placeholder="请输入" />
</template>
</el-table-column>
<el-table-column :label="getColumnName('ScriptItem-ColName')">
<template #default="scope">
<el-input v-model="scope.row['ScriptItem-ColName']" clearable placeholder="请输入" />
</template>
</el-table-column>
<el-table-column :label="getColumnName('ScriptItem-RowNo')">
<template #default="scope">
<el-input-number v-model="scope.row['ScriptItem-RowNo']" clearable placeholder="请输入" />
</template>
</el-table-column>
<el-table-column :label="getColumnName('ScriptItem-RowName')">
<template #default="scope">
<el-input v-model="scope.row['ScriptItem-RowName']" clearable placeholder="请输入" />
</template>
</el-table-column>
<el-table-column :label="getColumnName('ScriptItem-ColFieldType')">
<template #default="scope">
<el-input-number v-model="scope.row['ScriptItem-ColFieldType']" clearable placeholder="请输入" />
</template>
</el-table-column>
<el-table-column :label="getColumnName('ScriptItem-ColFormat')">
<template #default="scope">
<el-input v-model="scope.row['ScriptItem-ColFormat']" clearable placeholder="请输入" />
</template>
</el-table-column>
<el-table-column :label="getColumnName('ScriptItem-DefaultValue')">
<template #default="scope">
<el-input v-model="scope.row['ScriptItem-DefaultValue']" clearable placeholder="请输入" />
</template>
</el-table-column>
<el-table-column align="center" width="100">
<template #header>
<el-button
size="mini"
class="search-button-style"
style="margin-left:0 !important;width:70px;"
@click="handleAddValst()"
>新增</el-button>
</template>
<template #default="scope">
<el-button
class="table-delete-button"
type="danger"
size="mini"
@click="handleDeleteValst(scope.$index)"
>删除</el-button>
</template>
</el-table-column>
</el-table>
</el-col>
</el-row>
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button
type="primary"
class="dialog-submit-button"
@click="submitForm"
> </el-button
>
<el-button class="dialog-cancel-button" @click="cancel"
> </el-button
>
</div>
</template>
</el-dialog>
</template>
<script>
import { get, post, put } from "@/server/api.js";
export default {
name: "editField",
props: {
item: {
default: {},
},
isAddOrEdit: {
default: "add",
},
},
mounted() {
if (this.isAddOrEdit == "edit") {
get(`/admin/base/script/selectone/${this.item['Script-Script']}`).then(res => {
this.formData = res.data
})
}
},
created() {
},
data() {
return {
loading: false,
//
formData: {
'Script-ScriptItem': []
},
uomtypeArray: [], //
//
rules: {
"Script-Script": [
{ required: true, message: "此项不能为空", trigger: "blur" },
],
"Script-Bez": [
{ required: true, message: "此项不能为空", trigger: "blur" },
],
"Script-ScriptTable": [
{ required: true, message: "此项不能为空", trigger: "blur" },
],
},
};
},
methods: {
//
getColumnEvent() {
let params = {
tablename: this.formData['Script-ScriptTable']
}
get('/admin/base/scriptitem/selecttableinfo', params).then((res) => {
if (res.code === 200) {
// let newDataArray = []
// res.data.forEach(el => {
// newDataArray.push({
// 'DataTableLst-TargetField': el.fieldName,
// 'DataTableLst-FieldType': el.fieldType
// })
// })
this.formData['Script-ScriptItem'] = res.data || []
}
})
},
/** 新增字段 */
handleAddValst() {
this.formData['Script-ScriptItem'].push({
'ScriptItem-TabMapCol': undefined,
'ScriptItem-ColNo': undefined,
'ScriptItem-ColName': undefined,
'ScriptItem-RowNo': undefined,
'ScriptItem-RowName': undefined,
'ScriptItem-ColFieldType': undefined,
'ScriptItem-ColFormat': undefined,
'ScriptItem-DefaultValue': undefined
})
},
/** 删除字段 */
handleDeleteValst(index) {
this.formData['Script-ScriptItem'].splice(index, 1)
},
//
cancel() {
this.$emit("setIsAddOrEdit", "");
},
//
submitForm() {
this.$refs["formData"].validate((valid) => {
if (valid) {
this.loading = true;
if (this.isAddOrEdit == "add") {
this.add();
} else {
this.edit();
}
}
});
},
//
add() {
post('/admin/base/script/insertone',this.formData).then(({ code }) => {
this.loading = false;
if (code == 200) {
this.msgSuccess("新增成功");
this.$emit("setIsAddOrEdit", false);
}
})
.catch(() => {
this.loading = false;
});
},
//
edit() {
put('/admin/base/script/updateone',this.formData).then(({ code }) => {
this.loading = false;
if (code == 200) {
this.msgSuccess("修改成功");
this.$emit("setIsAddOrEdit", false);
}
})
.catch(() => {
this.loading = false;
});
},
},
};
</script>

+ 201
- 0
src/views/system/oneimport/index.vue View File

@ -0,0 +1,201 @@
<template>
<div ref="tableRef" class="table-height-wrap">
<SearchTemplate>
<el-form :inline="true" class="clearfix search-content">
<el-form-item :label="getColumnName('Script-Script')">
<el-input
v-model.trim="queryParams.Script"
placeholder="请输入查询内容"
clearable
style="width: 240px"
/>
</el-form-item>
<el-form-item>
<el-button
icon="el-icon-search"
size="mini"
class="search-button-style"
@click="handleQuery"
>搜索</el-button
>
<el-button
icon="el-icon-refresh"
size="mini"
class="reset-button-style"
@click="resetQuery"
>重置</el-button
>
</el-form-item>
<el-form-item class="fr">
<el-button
icon="el-icon-plus"
class="add-button-style"
@click="setIsAddOrEdit('add')"
>新增</el-button
>
</el-form-item>
</el-form>
</SearchTemplate>
<ContentContainer>
<el-table
:data="tableData"
v-loading="loading"
size="mini"
style="width: 100%"
border
v-if="tableHeight"
:height="tableHeight"
>
<el-table-column
v-for="(item, index) in headers"
:key="index"
:label="getColumnName(item)"
:show-overflow-tooltip="true"
width="150"
>
<template #default="scope">
<span v-if="item === 'Script-PlantNr'">{{
getWorkshopName(scope.row["Script-PlantNr"])
}}</span>
<span v-else>{{ scope.row[item] }}</span>
</template>
</el-table-column>
<el-table-column align="center" label="操作" width="260" fixed="right">
<template #default="scope">
<el-button
class="edit-button-style"
@click="handleUpdate(scope.row)"
icon="el-icon-edit"
size="small"
>修改</el-button
>
<el-button
size="small"
class="edit-button-style"
@click="handleUpload(scope.row)">导入</el-button>
<el-button
class="edit-button-style"
@click="handleDelete(scope.row)"
icon="el-icon-delete"
size="small"
>删除</el-button
>
</template>
</el-table-column>
</el-table>
<!-- 分页 -->
<Pagination
v-show="pagination.total > 0"
v-model:pagination="pagination"
@change="getList"
/>
</ContentContainer>
<AddOrEdit
v-if="isAddOrEdit"
:isAddOrEdit="isAddOrEdit"
:item="item"
@setIsAddOrEdit="setIsAddOrEdit"
/>
<!-- 上传 -->
<uploadTemplate
v-if="isShowDialog === 'upload'"
:item="item"
v-model:isShowDialog="isShowDialog"
@editCallBack="completeCallBack" />
</div>
</template>
<script>
import { ListMixin } from "@/mixins/ListMixin";
import AddOrEdit from "./addOrEdit.vue";
import uploadTemplate from "./upload.vue";
export default {
components: {
AddOrEdit,
uploadTemplate
},
mixins: [ListMixin],
data() {
return {
queryTableDataUrl: "/admin/base/script/query",
isAddOrEdit: "", // /
item: {}, //
headers: [
"Script-PlantNr",
"Script-Script",
"Script-Bez",
"Script-ScriptTable",
"Script-ScriptType",
"Script-FilePath",
"Script-Separator",
"Script-UseHead",
"Script-ClearTable",
"Script-StartRow",
"Script-StartCol",
"Script-AppendNewRecord",
"Script-UpdateRecord",
"Script-AppendAndUpdateRecord",
"Script-CallSpecFunc",
"Script-CallFunction",
], //
tableHeight: 0,
isShowDialog: '',
};
},
methods: {
//
handleUpload(item) {
this.item = item;
this.isShowDialog = 'upload'
},
completeCallBack(data) {
this.isShowDialog = ''
if (data) {
this.handleUpdate(this.item.CustomerId, this.item.VersionId)
}
},
// /
setIsAddOrEdit(value) {
this.isAddOrEdit = value;
if (!value) {
this.getList();
}
},
//
handleUpdate(item) {
this.item = item;
this.setIsAddOrEdit("edit");
},
//
handleQuery() {
this.pagination.pageNumber = 1;
this.getList();
},
//
resetQuery() {
this.queryParams.Script = undefined;
this.handleQuery();
},
//
handleDelete(row) {
let keyName = row["Script-Script"];
let deteleUrl = `/admin/base/script/deleteone/${row["Script-Script"]}`;
// 12
this.delHanle(keyName, deteleUrl);
},
},
mounted() {
this.$nextTick(() => {
this.tableHeight = this.calculationTableHeight(
this.$refs.tableRef,
120
);
})
}
};
</script>
<style lang="less" scoped>
.table-height-wrap {
height: 100%;
overflow: hidden;
}
</style>

+ 86
- 0
src/views/system/oneimport/upload.vue View File

@ -0,0 +1,86 @@
<template>
<el-dialog :title="title" model-value width="50%" :close-on-click-modal="false" :before-close="cancel">
<input
type="file"
accept="application/vnd.ms-excel,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, xls, xlsx"
@change="previewUpload"
>
<el-button
type="primary"
:loading="uploadLoading"
icon="el-icon-upload"
size="mini"
@click="uploadEvent"
>上传</el-button>
</el-dialog>
</template>
<script>
import { readexcel } from "@/server/api.js";
export default {
name: 'editField',
props: {
item: {
default: null,
}
},
data() {
return {
title: '导入', //
uploadLoading: false,
excel: '',
}
},
methods: {
cancel() { //
this.$emit('update:isShowDialog','')
},
//
previewUpload(file) {
this.excle = file.target.files[0]
},
//
uploadEvent() {
this.uploadLoading = true
if (this.excle === null || this.excle === '' || this.excle === undefined) {
this.$message({
showClose: true,
duration: 2000,
message: '请选择文件',
type: 'error'
})
this.uploadLoading = false
} else {
const uploadData = new FormData()
uploadData.append('uploadfile', this.excle)
readexcel(uploadData, this.item['Script-Script']).then(res => {
this.uploadLoading = false
if (res.code === 200) {
this.$message({
showClose: true,
duration: 2000,
message: '导入成功',
type: 'success'
})
this.$emit('editCallBack', true)
} else {
this.$message({
showClose: true,
duration: 2000,
message: res.msg,
type: 'error'
})
}
}).catch((res) => {
this.uploadLoading = false
this.$message({
showClose: true,
duration: 2000,
message: res.msg,
type: 'error'
})
})
}
},
}
}
</script>

Loading…
Cancel
Save