|
|
@@ -1,13 +1,6 @@
|
|
|
<template>
|
|
|
- <el-dialog
|
|
|
- class="import-columns-dialog"
|
|
|
- :visible.sync="dialogTableVisible"
|
|
|
- append-to-body
|
|
|
- width="70%"
|
|
|
- title="导入数据"
|
|
|
- @close="closeDialog"
|
|
|
- @open="openDialog"
|
|
|
- >
|
|
|
+ <el-dialog class="import-columns-dialog" :visible.sync="dialogTableVisible" append-to-body width="70%" title="导入数据"
|
|
|
+ @close="closeDialog" @open="openDialog">
|
|
|
<!-- <span slot="title">
|
|
|
<label style="font-size:18px;">导入数据</label>
|
|
|
<i class="el-icon-warning" style="font-size:12px;margin-left:5px;color:#E6A23C;">数据库元数据的格式,否则针对key-vue存储的数据会有误!</i>
|
|
|
@@ -19,19 +12,14 @@
|
|
|
<el-step title="导入数据" />
|
|
|
</el-steps>
|
|
|
<el-row class="manual-operation">
|
|
|
- <el-col v-if="active===1||active===2" :span="24" class="buttonGround">
|
|
|
+ <el-col v-if="active === 1 || active === 2" :span="24" class="buttonGround">
|
|
|
<el-button style="margin-top: 12px;" @click="before">上一步</el-button>
|
|
|
<el-button style="margin-top: 12px;" @click="after">下一步</el-button>
|
|
|
</el-col>
|
|
|
<!-- 上传Excel -->
|
|
|
- <el-col v-if="active===0" :span="24" class="upload-the-excel">
|
|
|
+ <el-col v-if="active === 0" :span="24" class="upload-the-excel">
|
|
|
<div class="upload-the-excel-detail">您可以便捷地将Excel中的数据导入到该表单中。</div>
|
|
|
- <el-upload
|
|
|
- drag
|
|
|
- :before-upload="beforeUpload"
|
|
|
- action="https://www.bpmhome.cn/post"
|
|
|
- accept=".xls,.xlsx"
|
|
|
- >
|
|
|
+ <el-upload drag :before-upload="beforeUpload" action="https://www.bpmhome.cn/post" accept=".xls,.xlsx">
|
|
|
<i class="el-icon-upload" />
|
|
|
<div class="el-upload__text">将文件拖到此处,或<em>点击上传</em></div>
|
|
|
<div slot="tip" class="el-upload__tip">
|
|
|
@@ -47,58 +35,42 @@
|
|
|
</el-upload>
|
|
|
</el-col>
|
|
|
<!-- 预览数据 -->
|
|
|
- <el-col v-if="active===1" :span="24" class="preview-the-data">
|
|
|
- <el-table ref="table" v-bind="tableData" border :height="tableHeight-tableHeight/9" style="width: 100%">
|
|
|
+ <el-col v-if="active === 1" :span="24" class="preview-the-data">
|
|
|
+ <el-table ref="table" v-bind="tableData" border :height="tableHeight - tableHeight / 9" style="width: 100%">
|
|
|
<el-table-column>
|
|
|
<template slot="header">
|
|
|
<div class="cell">1</div>
|
|
|
</template>
|
|
|
<template slot-scope="scope">
|
|
|
- <div class="cell">{{ scope.$index+2 }}</div>
|
|
|
+ <div class="cell">{{ scope.$index + 2 }}</div>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
- <el-table-column
|
|
|
- v-for="(item, index) in tableData.columns"
|
|
|
- :key="index"
|
|
|
- :prop="item.prop"
|
|
|
- :label="item.label"
|
|
|
- />
|
|
|
+ <el-table-column v-for="(item, index) in tableData.columns" :key="index" :prop="item.prop"
|
|
|
+ :label="item.label" />
|
|
|
</el-table>
|
|
|
<div class="form-control">
|
|
|
以第 <el-input-number v-model="input" :min="1" />行作为表单各字段的名称
|
|
|
</div>
|
|
|
</el-col>
|
|
|
<!-- 选择字段 -->
|
|
|
- <el-col v-if="active===2" :span="24" class="select-fields">
|
|
|
- <el-table
|
|
|
- ref="selectFieldsTable"
|
|
|
- border
|
|
|
- :height="tableHeight-tableHeight/9"
|
|
|
- row-key="title"
|
|
|
- :data="selectFieldsTableData"
|
|
|
- style="width: 100%"
|
|
|
- >
|
|
|
+ <el-col v-if="active === 2" :span="24" class="select-fields">
|
|
|
+ <el-table ref="selectFieldsTable" border :height="tableHeight - tableHeight / 9" row-key="title"
|
|
|
+ :data="selectFieldsTableData" style="width: 100%">
|
|
|
<el-table-column>
|
|
|
<template slot="header">
|
|
|
<div class="cell">导入</div>
|
|
|
</template>
|
|
|
<template slot-scope="scope">
|
|
|
- <el-checkbox :disabled="scope.row.disabled" :checked="scope.row.checked" @change="handleChange(scope.$index,scope.row)" />
|
|
|
+ <el-checkbox :disabled="scope.row.disabled" :checked="scope.row.checked"
|
|
|
+ @change="handleChange(scope.$index, scope.row)" />
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="title"
|
|
|
- label="标题"
|
|
|
- width="180"
|
|
|
- />
|
|
|
- <el-table-column
|
|
|
- prop="dataType"
|
|
|
- label="数据类型"
|
|
|
- />
|
|
|
+ <el-table-column prop="title" label="标题" width="180" />
|
|
|
+ <el-table-column prop="dataType" label="数据类型" />
|
|
|
</el-table>
|
|
|
</el-col>
|
|
|
<!-- 导入数据 -->
|
|
|
- <el-col v-if="active===4" :span="24" class="import-data">
|
|
|
+ <el-col v-if="active === 4" :span="24" class="import-data">
|
|
|
<div style="display: flex; margin-top: 20px; height: 100px;">
|
|
|
<div v-if="!show" class="transition-box importing" style="color:white;">导入中...</div>
|
|
|
<div v-if="show" class="transition-box imported">导入成功!只导入数据库元数据的格式,否则针对key-vue存储的数据会有误!</div>
|
|
|
@@ -110,6 +82,8 @@
|
|
|
<script>
|
|
|
import { saveUpload } from '@/api/platform/data/dataTemplate'
|
|
|
import IbpsImport from '@/plugins/import'
|
|
|
+import curdPost from '@/business/platform/form/utils/custom/joinCURD.js'
|
|
|
+
|
|
|
export default {
|
|
|
props: {
|
|
|
data: {
|
|
|
@@ -147,7 +121,7 @@ export default {
|
|
|
},
|
|
|
watch: {
|
|
|
visible: {
|
|
|
- handler: function(val, oldVal) {
|
|
|
+ handler: function (val, oldVal) {
|
|
|
this.dialogTableVisible = this.visible
|
|
|
},
|
|
|
immediate: true
|
|
|
@@ -223,13 +197,13 @@ export default {
|
|
|
checkExcel(fileName) {
|
|
|
const fileNameAry = fileName.split('.')
|
|
|
return (fileNameAry[fileNameAry.length - 1] === 'xlsx' ||
|
|
|
- fileNameAry[fileNameAry.length - 1] === 'xls' ||
|
|
|
- fileNameAry[fileNameAry.length - 1] === 'xltx' ||
|
|
|
- fileNameAry[fileNameAry.length - 1] === 'xlt' ||
|
|
|
- fileNameAry[fileNameAry.length - 1] === 'xlsm' ||
|
|
|
- fileNameAry[fileNameAry.length - 1] === 'xlsb' ||
|
|
|
- fileNameAry[fileNameAry.length - 1] === 'xltm' ||
|
|
|
- fileNameAry[fileNameAry.length - 1] === 'csv')
|
|
|
+ fileNameAry[fileNameAry.length - 1] === 'xls' ||
|
|
|
+ fileNameAry[fileNameAry.length - 1] === 'xltx' ||
|
|
|
+ fileNameAry[fileNameAry.length - 1] === 'xlt' ||
|
|
|
+ fileNameAry[fileNameAry.length - 1] === 'xlsm' ||
|
|
|
+ fileNameAry[fileNameAry.length - 1] === 'xlsb' ||
|
|
|
+ fileNameAry[fileNameAry.length - 1] === 'xltm' ||
|
|
|
+ fileNameAry[fileNameAry.length - 1] === 'csv')
|
|
|
},
|
|
|
beforeUpload(file) {
|
|
|
if (!this.checkExcel(file.name)) {
|
|
|
@@ -287,31 +261,98 @@ export default {
|
|
|
// }
|
|
|
// return target
|
|
|
// },
|
|
|
- handleSaveUpload() {
|
|
|
+ async handleSaveUpload() {
|
|
|
// 获取勾选字段
|
|
|
var fields = {}
|
|
|
+ var formKey = this.dataTemplate.attrs.form_key
|
|
|
this.importData.forEach(i => {
|
|
|
fields[this.fields[i.key].form_field_name] = i.title
|
|
|
})
|
|
|
// 列表数据处理
|
|
|
const tableData = JSON.parse(JSON.stringify(this.tableData.data))
|
|
|
const saveData = []
|
|
|
- tableData.forEach(data => {
|
|
|
- const obj = {}
|
|
|
- for (var d in data) {
|
|
|
- for (var f in fields) {
|
|
|
- if (d === fields[f]) {
|
|
|
- obj[f] = data[d]
|
|
|
- }
|
|
|
- }
|
|
|
+ let gysmlSql = "select * FROM t_gysml"
|
|
|
+ // 去除字符串里的空格
|
|
|
+ function trim(str) {
|
|
|
+ var reg = /\s+/g;
|
|
|
+ if (typeof str === 'string') {
|
|
|
+ var trimStr = str.replace(reg, '');
|
|
|
}
|
|
|
- saveData.push(obj)
|
|
|
- })
|
|
|
+ return trimStr
|
|
|
+ }
|
|
|
+ switch (formKey) {
|
|
|
+ case 'lhwljbxx':
|
|
|
+ await curdPost('sql', gysmlSql).then(gysmlRes => {
|
|
|
+ let gysmlDatas = gysmlRes.variables.data
|
|
|
+ tableData.forEach(data => {
|
|
|
+ const obj = {}
|
|
|
+ for (var d in data) {
|
|
|
+ for (var f in fields) {
|
|
|
+ if (d === fields[f]) {
|
|
|
+ if (fields[f] == '供应商') {
|
|
|
+ var gysID = gysmlDatas.filter((v) => {
|
|
|
+ return trim(v.gong_ying_shang_m) == trim(data[d])
|
|
|
+ }) ? gysmlDatas.filter((v) => {
|
|
|
+ return trim(v.gong_ying_shang_m) == trim(data[d])
|
|
|
+ })[0].id_ : ''
|
|
|
+ obj[f] = gysID
|
|
|
+ } else {
|
|
|
+ obj[f] = trim(data[d])
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ saveData.push(obj)
|
|
|
+ })
|
|
|
+ })
|
|
|
+ break;
|
|
|
+ case 'lhkcglxq':
|
|
|
+ await curdPost('sql', gysmlSql).then(gysmlRes => {
|
|
|
+ let gysmlDatas = gysmlRes.variables.data
|
|
|
+ tableData.forEach(data => {
|
|
|
+ const obj = {}
|
|
|
+ for (var d in data) {
|
|
|
+ for (var f in fields) {
|
|
|
+ if (d === fields[f]) {
|
|
|
+ if (fields[f] == '供应商') {
|
|
|
+ var gysID = gysmlDatas.filter((v) => {
|
|
|
+ return trim(v.gong_ying_shang_m) == trim(data[d])
|
|
|
+ }) ? gysmlDatas.filter((v) => {
|
|
|
+ return trim(v.gong_ying_shang_m) == trim(data[d])
|
|
|
+ })[0].id_ : ''
|
|
|
+ obj[f] = gysID
|
|
|
+ } else {
|
|
|
+ obj[f] = trim(data[d])
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ obj['shiFouJiangGuoQiJ'] = '0'
|
|
|
+ obj['shiFouYiBaoFei'] = '0'
|
|
|
+ obj['shiFouYiGuoQi'] = '0'
|
|
|
+ saveData.push(obj)
|
|
|
+ })
|
|
|
+ })
|
|
|
+ break;
|
|
|
+ default:
|
|
|
+ tableData.forEach(data => {
|
|
|
+ const obj = {}
|
|
|
+ for (var d in data) {
|
|
|
+ for (var f in fields) {
|
|
|
+ if (d === fields[f]) {
|
|
|
+ obj[f] = data[d]
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ saveData.push(obj)
|
|
|
+ })
|
|
|
+ }
|
|
|
+
|
|
|
// 提交
|
|
|
this.active = this.active + 1
|
|
|
saveUpload({
|
|
|
data: JSON.stringify(saveData),
|
|
|
- formKey: this.dataTemplate.attrs.form_key
|
|
|
+ formKey
|
|
|
}).then(res => {
|
|
|
this.show = true
|
|
|
this.$emit('saveUpload')
|
|
|
@@ -333,64 +374,78 @@ export default {
|
|
|
}
|
|
|
</script>
|
|
|
<style lang="scss">
|
|
|
-.import-columns-dialog{
|
|
|
- height:calc(80vh) !important;
|
|
|
-.steps{
|
|
|
- padding-bottom: 6px;
|
|
|
- border-bottom:1px solid #eeeeee;
|
|
|
-}
|
|
|
-.manual-operation{
|
|
|
- .buttonGround{
|
|
|
- text-align:center;
|
|
|
+.import-columns-dialog {
|
|
|
+ height: calc(80vh) !important;
|
|
|
+
|
|
|
+ .steps {
|
|
|
+ padding-bottom: 6px;
|
|
|
+ border-bottom: 1px solid #eeeeee;
|
|
|
}
|
|
|
- .upload-the-excel{
|
|
|
- .el-upload-dragger,
|
|
|
- .el-upload{
|
|
|
- width:100%;
|
|
|
+
|
|
|
+ .manual-operation {
|
|
|
+ .buttonGround {
|
|
|
+ text-align: center;
|
|
|
}
|
|
|
- .upload-the-excel-detail{
|
|
|
- padding:5px 0;
|
|
|
- }
|
|
|
- .el-upload__tip{
|
|
|
- line-height:18px;
|
|
|
- }
|
|
|
- .el-upload-list{
|
|
|
- display:none;
|
|
|
+
|
|
|
+ .upload-the-excel {
|
|
|
+
|
|
|
+ .el-upload-dragger,
|
|
|
+ .el-upload {
|
|
|
+ width: 100%;
|
|
|
+ }
|
|
|
+
|
|
|
+ .upload-the-excel-detail {
|
|
|
+ padding: 5px 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ .el-upload__tip {
|
|
|
+ line-height: 18px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .el-upload-list {
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
-}
|
|
|
-.preview-the-data{
|
|
|
- margin-top:10px;
|
|
|
- .form-control{
|
|
|
- margin-top:5px;
|
|
|
- .el-input{
|
|
|
- input{
|
|
|
- padding:0 2px;
|
|
|
+
|
|
|
+ .preview-the-data {
|
|
|
+ margin-top: 10px;
|
|
|
+
|
|
|
+ .form-control {
|
|
|
+ margin-top: 5px;
|
|
|
+
|
|
|
+ .el-input {
|
|
|
+ input {
|
|
|
+ padding: 0 2px;
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
-}
|
|
|
-.select-fields{
|
|
|
- margin-top:10px;
|
|
|
-}
|
|
|
-.import-data{
|
|
|
- .transition-box {
|
|
|
- margin-bottom: 10px;
|
|
|
- width: 100%;
|
|
|
- height: 100px;
|
|
|
- border-radius: 4px;
|
|
|
- text-align: center;
|
|
|
- color: #fff;
|
|
|
- padding: 40px 20px;
|
|
|
- box-sizing: border-box;
|
|
|
- margin-right: 20px;
|
|
|
- }
|
|
|
- .importing{
|
|
|
- background-color: #777777 ;
|
|
|
+
|
|
|
+ .select-fields {
|
|
|
+ margin-top: 10px;
|
|
|
}
|
|
|
- .imported{
|
|
|
- background-color: #69aa46 ;
|
|
|
+
|
|
|
+ .import-data {
|
|
|
+ .transition-box {
|
|
|
+ margin-bottom: 10px;
|
|
|
+ width: 100%;
|
|
|
+ height: 100px;
|
|
|
+ border-radius: 4px;
|
|
|
+ text-align: center;
|
|
|
+ color: #fff;
|
|
|
+ padding: 40px 20px;
|
|
|
+ box-sizing: border-box;
|
|
|
+ margin-right: 20px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .importing {
|
|
|
+ background-color: #777777;
|
|
|
+ }
|
|
|
+
|
|
|
+ .imported {
|
|
|
+ background-color: #69aa46;
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
-}
|
|
|
</style>
|