Skip to content

E
emport-web
Commit 8ddee006 by 刘泽志
Options

文档上传

parent b63a9f74
Showing with 461 additions and 101 deletions
src/api/emport/Emport.js
...@@ -145,17 +145,6 @@ export function queryDbField(dataSourceId,tableName) { ...@@ -145,17 +145,6 @@ export function queryDbField(dataSourceId,tableName) {
}) })
} }
/**
* 文件上传
* @param data
* @returns {*}
*/
export async function uploadExcel(data) {
return {
code: 200
}
}
/** /**
* 字段查询 * 字段查询
...@@ -271,4 +260,73 @@ export function deleteRule(ruleId) { ...@@ -271,4 +260,73 @@ export function deleteRule(ruleId) {
method: 'delete', method: 'delete',
params:{ruleId} params:{ruleId}
}) })
} }
\ No newline at end of file
/**
* 规则测试
* @param data
* @returns {*}
*/
export function ruleTest(data) {
return request({
url: `${prefix}/rule/test`,
method: 'post',
data
})
}
/**
* 快速绑定
* @param templateId
* @param ruleId
* @returns {AxiosPromise}
*/
export function quickBind(templateId,ruleId) {
return request({
url: `${prefix}/bind/quick`,
method: 'get',
params:{templateId,ruleId}
})
}
/**
* 查询绑定的规则
* @param fieldId
* @returns {AxiosPromise}
*/
export function queryBindRule(fieldId) {
return request({
url: `${prefix}/bind`,
method: 'get',
params:{fieldId}
})
}
/**
* 配置字段规则绑定
* @param data
* @returns {AxiosPromise}
*/
export function bindRule(data) {
return request({
url: `${prefix}/bind`,
method: 'post',
data
})
}
/**
* 上传excel
* @param data
* @returns {*}
*/
export function uploadExcel(data) {
return request({
url: `${prefix}/upload`,
method: 'post',
data,
headers: {
'Content-Type': 'multipart/form-data'
}
})
}
src/views/emport/emport/AutoUpload.vue 0 → 100644
<template>
<el-dialog :before-close="cancel" :close-on-click-modal="false"
:title="title"
:visible="open"
:width="width"
append-to-body
@close="clearFiles">
<div>
<el-upload ref="upload" :auto-upload="false" :http-request="httpRequest"
:multiple="multiple" :on-change="handleChange"
action="xxx"
drag>
<i class="el-icon-upload"></i>
<div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
<div v-if="accept.length > 0" slot="tip" class="el-upload__tip">
只能上传{{ accept.join("/") }}文件
</div>
</el-upload>
</div>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="upload">上传</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</el-dialog>
</template>
<script>
export default {
name: "AutoUpload",
props: {
title: {
type: String,
default: ''
},
width: {
type: String,
default: '400px'
},
open: {
type: Boolean,
default: false
},
accept: {
type: Array,
default: () => []
},
multiple: {
type: Boolean,
default: true
}
},
methods: {
cancel() {
this.clearFiles()
this.$emit("update:open", false);
},
upload() {
this.$refs.upload.submit();
},
handleChange(file, fileList) {
let fileType = file.name.substring(file.name.lastIndexOf('.') + 1)
if (this.accept.length > 0) {
let extension = this.accept.some(item => {
return item === fileType.toLowerCase();
})
if (!extension) {
this.$message.warning(`请选择类型为${this.accept.join("/")}的文件`)
fileList.splice(-1, 1); //移除选中
}
}
},
httpRequest({file,onError,onProgress,onSuccess}){
//let formData = new FormData()
//formData.append("file",file)
this.$emit('upload', {
file,
onSuccess
})
},
clearFiles(){
if (this.$refs.upload){
this.$refs.upload.clearFiles()
}
}
}
}
</script>
<style scoped>
</style>
src/views/emport/emport/index.vue
...@@ -28,7 +28,8 @@ ...@@ -28,7 +28,8 @@
<i class="el-icon-circle-plus-outline form_icon" @click="openOrgDialog"></i> <i class="el-icon-circle-plus-outline form_icon" @click="openOrgDialog"></i>
</el-form-item> </el-form-item>
<el-form-item label="请选择导入文件:" label-width="120px"> <el-form-item label="请选择导入文件:" label-width="120px">
<el-upload ref="upload" :auto-upload="false" :http-request="fileUpload" :on-change="fileChange" :on-remove="fileRemove" <el-upload ref="upload" :auto-upload="false" :http-request="fileUpload" :on-change="fileChange"
:on-remove="fileRemove"
action="xxx" class="upload" multiple action="xxx" class="upload" multiple
> >
<el-button size="small" plain>选择文件</el-button> <el-button size="small" plain>选择文件</el-button>
...@@ -60,15 +61,28 @@ ...@@ -60,15 +61,28 @@
/> />
<el-table-column :formatter="yearFormat" align="center" label="数据年份" prop="year" show-overflow-tooltip/> <el-table-column :formatter="yearFormat" align="center" label="数据年份" prop="year" show-overflow-tooltip/>
<el-table-column align="center" label="导入时间" prop="importTime" show-overflow-tooltip/> <el-table-column align="center" label="导入时间" prop="importTime" show-overflow-tooltip/>
<el-table-column align="center" label="操作" width="150"> <el-table-column :formatter="templateStatusFormat" align="center" label="模板状态" show-overflow-tooltip/>
<el-table-column align="center" label="操作" width="190">
<template slot-scope="scope"> <template slot-scope="scope">
<el-button plain size="small" @click.stop="openFieldDrawer(scope.row)">字段</el-button>
<el-button circle icon="el-icon-edit" plain <el-button circle icon="el-icon-edit" plain
size="small" type="primary" @click.stop="editTemplateDialog(scope.row)" size="small" type="primary" @click.stop="editTemplateDialog(scope.row)"
></el-button> ></el-button>
<el-button circle icon="el-icon-delete" plain <el-button circle icon="el-icon-delete" plain
size="small" type="danger" @click.stop="deleteTemplate(scope.row)" size="small" type="danger" @click.stop="deleteTemplate(scope.row)"
></el-button> ></el-button>
<el-dropdown size="small" style="margin-left: 10px">
<el-button plain size="small" type="primary">
更多菜单<i class="el-icon-arrow-down el-icon--right"></i>
</el-button>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item icon="el-icon-upload2" @click.native="openUploadTemplate(scope.row)">
模板上传
</el-dropdown-item>
<el-dropdown-item icon="el-icon-download">模板下载</el-dropdown-item>
<el-dropdown-item icon="el-icon-view" @click.native="openFieldDrawer(scope.row)">查看字段
</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
...@@ -141,7 +155,8 @@ ...@@ -141,7 +155,8 @@
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="数据表" prop="tableName"> <el-form-item label="数据表" prop="tableName">
<el-select v-model="templateDialog.data.tableName" v-loading="queryTableLoading" :loading="queryTableLoading" <el-select v-model="templateDialog.data.tableName" v-loading="queryTableLoading"
:loading="queryTableLoading"
:popper-append-to-body="false" filterable :popper-append-to-body="false" filterable
@change="$forceUpdate()" @change="$forceUpdate()"
> >
...@@ -196,19 +211,20 @@ ...@@ -196,19 +211,20 @@
<!-- 字段抽屉 --> <!-- 字段抽屉 -->
<el-drawer :visible.sync="fieldDrawer.show" append-to-body <el-drawer :visible.sync="fieldDrawer.show" append-to-body
destroy-on-close direction="rtl" destroy-on-close direction="rtl"
size="50%" title="字段信息"> size="50%" title="字段信息"
>
<el-form inline label-width="110px" size="small"> <el-form inline label-width="110px" size="small">
<el-form-item label="数据库字段名:"> <el-form-item label="数据库字段名:">
<el-input v-model="fieldDrawer.queryForm.field" /> <el-input v-model="fieldDrawer.queryForm.field"/>
</el-form-item> </el-form-item>
<el-form-item label="代码:"> <el-form-item label="代码:">
<el-input v-model="fieldDrawer.queryForm.code" /> <el-input v-model="fieldDrawer.queryForm.code"/>
</el-form-item> </el-form-item>
<el-form-item label="指标名称:"> <el-form-item label="指标名称:">
<el-input v-model="fieldDrawer.queryForm.title" /> <el-input v-model="fieldDrawer.queryForm.title"/>
</el-form-item> </el-form-item>
<el-form-item label="数据坐标:"> <el-form-item label="数据坐标:">
<el-input v-model="fieldDrawer.queryForm.coordinate" /> <el-input v-model="fieldDrawer.queryForm.coordinate"/>
</el-form-item> </el-form-item>
<el-form-item label=""> <el-form-item label="">
<el-button :loading="fieldDrawer.queryFieldLoading" icon="el-icon-search" plain type="primary" <el-button :loading="fieldDrawer.queryFieldLoading" icon="el-icon-search" plain type="primary"
...@@ -216,6 +232,7 @@ ...@@ -216,6 +232,7 @@
>查询 >查询
</el-button> </el-button>
<el-button plain type="primary" @click="openFieldDialog">新增</el-button> <el-button plain type="primary" @click="openFieldDialog">新增</el-button>
<el-button plain type="primary" @click="openQuicklyBind">快速绑定</el-button>
</el-form-item> </el-form-item>
</el-form> </el-form>
<el-table v-loading="fieldDrawer.queryFieldLoading" :data="fieldDrawer.fieldList" <el-table v-loading="fieldDrawer.queryFieldLoading" :data="fieldDrawer.fieldList"
...@@ -227,7 +244,7 @@ ...@@ -227,7 +244,7 @@
<el-table-column align="center" label="数据库字段名" prop="field" show-overflow-tooltip/> <el-table-column align="center" label="数据库字段名" prop="field" show-overflow-tooltip/>
<el-table-column align="center" label="操作" width="150"> <el-table-column align="center" label="操作" width="150">
<template slot-scope="scope"> <template slot-scope="scope">
<el-button plain size="small">规则</el-button> <el-button plain size="small" @click.stop="openRuleBindDialog(scope.row)">规则</el-button>
<el-button circle icon="el-icon-edit" plain <el-button circle icon="el-icon-edit" plain
size="small" type="primary" @click.stop="editFieldDialog(scope.row)" size="small" type="primary" @click.stop="editFieldDialog(scope.row)"
></el-button> ></el-button>
...@@ -237,16 +254,75 @@ ...@@ -237,16 +254,75 @@
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
<pagination v-show="fieldDrawer.queryForm.total > 0" :limit.sync="fieldDrawer.queryForm.pageSize"
:page.sync="fieldDrawer.queryForm.pageNum"
:total="fieldDrawer.queryForm.total" @pagination="queryFieldList"
/>
</el-drawer> </el-drawer>
<!-- 快速绑定 -->
<el-dialog :visible.sync="quicklyBindDialog.show" append-to-body close-on-click-modal title="快速绑定"
width="400px"
>
<el-form ref="orgForm" label-width="100px" size="small">
<el-form-item label="规则" prop="ruleId">
<el-select v-model="quicklyBindDialog.ruleId" size="small">
<el-option v-for="item in ruleDict" :key="item.value" :label="item.label" :value="item.value"/>
</el-select>
</el-form-item>
<span style="font-size: 13px;color: #F56C6C">设置后将为每一条字段添加此规则!</span>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button :loading="quicklyBindDialog.loading" type="primary" @click="submitQuickBind">确 定
</el-button>
<el-button @click="quicklyBindDialog.show = false">取 消</el-button>
</div>
</el-dialog>
<!--字段规则增删改-->
<el-dialog
:close-on-click-modal="true"
:visible.sync="bindDialog.show"
append-to-body
title="字段规则绑定"
width="700px"
>
<div>
<el-transfer
v-model="bindDialog.data"
v-loading="bindDialog.loading"
:button-texts="['移除规则', '添加规则']"
:data="ruleDict"
:props="{ key: 'value', label: 'label' }"
:titles="['全部规则', '已选规则']"
filterable
style="text-align: left; display: inline-block"
>
</el-transfer>
</div>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitBindRule">确 定</el-button>
<el-button @click="bindDialog.show = false">取 消</el-button>
</div>
</el-dialog>
<!-- 模板上传 -->
<AutoUpload
ref="initTemplateUpload"
:accept="['xls', 'xlsx']"
:multiple="false"
:open.sync="initTemplateDialog.show"
title="初始模板上传"
@upload="initTemplateUpload"
/>
</div> </div>
</template> </template>
<script> <script>
import * as Emport from '@/api/emport/Emport' import * as Emport from '@/api/emport/Emport'
import StringUtil from '@/utils/document/StringUtil' import StringUtil from '@/utils/document/StringUtil'
import AutoUpload from '@/views/emport/emport/AutoUpload.vue'
export default { export default {
name: 'Emport', name: 'Emport',
components: { AutoUpload },
data() { data() {
return { return {
// 页面查询字段 // 页面查询字段
...@@ -257,6 +333,7 @@ export default { ...@@ -257,6 +333,7 @@ export default {
}, },
yearDict: [], // 年份字典 yearDict: [], // 年份字典
orgDict: [], // 机构类型字典 orgDict: [], // 机构类型字典
ruleDict: [], // 规则字典
dataSourceList: [], // 数据源列表 dataSourceList: [], // 数据源列表
tableList: [], // 表列表 tableList: [], // 表列表
fieldDict: [], // 字段字典 fieldDict: [], // 字段字典
...@@ -280,18 +357,36 @@ export default { ...@@ -280,18 +357,36 @@ export default {
show: false, show: false,
data: {} data: {}
}, },
fieldDrawer:{ // 字段抽屉 bindDialog: {
show: false,
data: [],
loading: false,
fieldId: null
},
fieldDrawer: { // 字段抽屉
template: null, template: null,
show: false, show: false,
fieldList:[], fieldList: [],
queryForm:{ queryForm: {
templateId: '', templateId: '',
code: '', code: '',
title: '', title: '',
coordinate: '', coordinate: '',
field: '' field: '',
pageNum: 1,
pageSize: 10,
total: 0
}, },
queryFieldLoading: false, queryFieldLoading: false
},
quicklyBindDialog: { // 字段dialog
show: false,
ruleId: null,
loading: false
},
initTemplateDialog: {
template: null,
show: false
}, },
importLoading: false, // 导入数据loading importLoading: false, // 导入数据loading
queryTemplateLoading: false, // 模板查询loading queryTemplateLoading: false, // 模板查询loading
...@@ -311,6 +406,7 @@ export default { ...@@ -311,6 +406,7 @@ export default {
} }
}) })
this.initDataSource() this.initDataSource()
this.initRuleDict()
}, },
methods: { methods: {
// 初始化年份字典 // 初始化年份字典
...@@ -345,6 +441,17 @@ export default { ...@@ -345,6 +441,17 @@ export default {
} }
}) })
}, },
// 初始化规则字典
initRuleDict() {
Emport.queryRuleDict().then(res => {
this.ruleDict = res.data.map(item => {
return {
value: item.id,
label: item.name
}
})
})
},
// 初始化数据表列表 // 初始化数据表列表
initTable(datasourceId, callback) { initTable(datasourceId, callback) {
this.queryTableLoading = true this.queryTableLoading = true
...@@ -362,10 +469,10 @@ export default { ...@@ -362,10 +469,10 @@ export default {
}).finally(_ => this.queryTableLoading = false) }).finally(_ => this.queryTableLoading = false)
}, },
// 初始化数据表字段字典 // 初始化数据表字段字典
initFieldDict(){ initFieldDict() {
if (this.fieldDrawer.template&&this.fieldDrawer.template.tableName&&this.fieldDrawer.template.dataSourceId){ if (this.fieldDrawer.template && this.fieldDrawer.template.tableName && this.fieldDrawer.template.dataSourceId) {
Emport.queryDbField(this.fieldDrawer.template.dataSourceId,this.fieldDrawer.template.tableName) Emport.queryDbField(this.fieldDrawer.template.dataSourceId, this.fieldDrawer.template.tableName)
.then(res=>{ .then(res => {
if (res.code === 200) { if (res.code === 200) {
this.fieldDict = res.data.map(item => { this.fieldDict = res.data.map(item => {
return { return {
...@@ -619,7 +726,7 @@ export default { ...@@ -619,7 +726,7 @@ export default {
) )
}, },
// 提交字段dialog // 提交字段dialog
submitField(){ submitField() {
this.$refs.fieldForm.validate(valid => { this.$refs.fieldForm.validate(valid => {
if (valid) { if (valid) {
if (this.fieldDialog.title === '新增字段') { if (this.fieldDialog.title === '新增字段') {
...@@ -639,8 +746,8 @@ export default { ...@@ -639,8 +746,8 @@ export default {
}) })
}, },
// 打开字段抽屉 // 打开字段抽屉
openFieldDrawer(row){ openFieldDrawer(row) {
this.fieldDrawer.template = {...row} this.fieldDrawer.template = { ...row }
this.fieldDrawer.queryForm = { this.fieldDrawer.queryForm = {
templateId: row.id, templateId: row.id,
code: '', code: '',
...@@ -648,38 +755,40 @@ export default { ...@@ -648,38 +755,40 @@ export default {
coordinate: '', coordinate: '',
field: '', field: '',
pageNum: 1, pageNum: 1,
pageSize: 20 pageSize: 10,
}; total: 0
this.fieldDrawer.fieldList = []; }
this.fieldDrawer.show = true; this.fieldDrawer.fieldList = []
this.fieldDrawer.show = true
this.queryFieldList() this.queryFieldList()
this.initFieldDict() this.initFieldDict()
}, },
// 查询字段列表 // 查询字段列表
queryFieldList(){ queryFieldList() {
this.fieldDrawer.queryFieldLoading = true this.fieldDrawer.queryFieldLoading = true
Emport.queryField(this.fieldDrawer.queryForm) Emport.queryField(this.fieldDrawer.queryForm)
.then(res=>{ .then(res => {
this.fieldDrawer.fieldList = res.rows this.fieldDrawer.fieldList = res.rows
}).finally(_=>this.fieldDrawer.queryFieldLoading = false) this.fieldDrawer.queryForm.total = res.total
}).finally(_ => this.fieldDrawer.queryFieldLoading = false)
}, },
// 打开新增字段dialog // 打开新增字段dialog
openFieldDialog(){ openFieldDialog() {
this.fieldDialog.title='新增字段' this.fieldDialog.title = '新增字段'
this.fieldDialog.data = { this.fieldDialog.data = {
templateId: this.fieldDrawer.template.id templateId: this.fieldDrawer.template.id
} }
this.fieldDialog.show = true this.fieldDialog.show = true
}, },
// 打开修改字段的dialog // 打开修改字段的dialog
editFieldDialog(row){ editFieldDialog(row) {
this.fieldDialog.title='修改字段' this.fieldDialog.title = '修改字段'
this.fieldDialog.data = {...row} this.fieldDialog.data = { ...row }
this.fieldDialog.show = true this.fieldDialog.show = true
}, },
// 删除字段 // 删除字段
deleteField(row) { deleteField(row) {
this.$confirm(`是否删除字段 ${StringUtil.mergeStr(row.code,row.title)} ?`, '删除', this.$confirm(`是否删除字段 ${StringUtil.mergeStr(row.code, row.title)} ?`, '删除',
{ {
type: 'warning', type: 'warning',
confirmButtonText: '确定', confirmButtonText: '确定',
...@@ -697,6 +806,80 @@ export default { ...@@ -697,6 +806,80 @@ export default {
} }
) )
}, },
// 打开快速绑定dialog
openQuicklyBind() {
this.quicklyBindDialog.show = true
this.quicklyBindDialog.ruleId = null
},
// 提交快速绑定
submitQuickBind() {
if (this.quicklyBindDialog.ruleId) {
this.quicklyBindDialog.loading = true
Emport.quickBind(this.fieldDrawer.template.id, this.quicklyBindDialog.ruleId)
.then(res => {
if (res.code === 200) {
this.$message.success('绑定成功')
this.quicklyBindDialog.show = false
this.queryFieldList()
}
}).finally(_ => this.quicklyBindDialog.loading = false)
}
},
// 打开字段规则绑定弹出框
openRuleBindDialog(row) {
this.bindDialog.loading = true
this.bindDialog.show = true
this.bindDialog.fieldId = row.id
Emport.queryBindRule(row.id).then(res => {
if (res.code === 200) {
this.bindDialog.data = res.data.map(item => item.id)
}
}).finally(_ => this.bindDialog.loading = false)
},
// 提交规则绑定数据
submitBindRule() {
this.bindDialog.loading = true
Emport.bindRule({
fieldId: this.bindDialog.fieldId,
ruleIdList: this.bindDialog.data
}).then(res => {
if (res.code === 200) {
this.$message.success('绑定成功')
this.bindDialog.show = false
}
}).finally(_ => this.bindDialog.loading = false)
},
// 模板状态格式化
templateStatusFormat(row) {
if (row.excelId) {
return '已上传'
} else {
return '未上传'
}
},
// 打开上传初始模板
openUploadTemplate(row) {
this.initTemplateDialog.template = row
this.initTemplateDialog.show = true
},
// 初始化模板上上传方法
initTemplateUpload({ file, onSuccess }) {
let formData = new FormData()
formData.append('file', file)
formData.append('type', '2')
formData.append('templateId', this.initTemplateDialog.template.id)
formData.append('year', this.initTemplateDialog.template.year)
formData.append('orgName', this.initTemplateDialog.template.orgName)
Emport.uploadExcel(formData).then(res => {
if (res.code === 200) {
onSuccess()
this.$message.success('上传成功')
this.initTemplateDialog.show = false
this.initTemplate()
}
})
}
} }
} }
</script> </script>
......
src/views/emport/rule/index.vue
...@@ -3,19 +3,21 @@ ...@@ -3,19 +3,21 @@
<div class="header-operator"> <div class="header-operator">
<el-form label-width="40px" inline> <el-form label-width="40px" inline>
<el-form-item> <el-form-item>
<el-input placeholder="输入名称搜索" clearable size="small" prefix-icon="el-icon-search" class="mr input" <el-input v-model="queryParam.name" class="mr input" clearable placeholder="输入名称搜索"
v-model="queryParam.ruleName" /> prefix-icon="el-icon-search"
size="small"
/>
</el-form-item> </el-form-item>
<el-form-item label="类型"> <el-form-item label="类型">
<el-select size="small" v-model="queryParam.ruleType" style="width: 160px"> <el-select v-model="queryParam.type" size="small" style="width: 160px">
<el-option value="" label="全部" /> <el-option label="全部" value=""/>
<el-option v-for="item in queryTypeList" :key="item.value" :value="item.value" <el-option v-for="item in typeDict" :key="item" :label="item" :value="item"/>
:label="item.label" />
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-button type="primary" class="mr" icon="el-icon-search" size="mini" :loading="queryLoading" <el-button type="primary" class="mr" icon="el-icon-search" size="mini" :loading="queryLoading"
@click="queryRuleList"> @click="queryRuleList"
>
查询 查询
</el-button> </el-button>
<el-button type="success" class="mr" size="mini" @click="openAddruleDialog"> <el-button type="success" class="mr" size="mini" @click="openAddruleDialog">
...@@ -25,64 +27,74 @@ ...@@ -25,64 +27,74 @@
</el-form> </el-form>
</div> </div>
<el-table v-loading="queryLoading" :data="ruleList" stripe border> <el-table v-loading="queryLoading" :data="ruleList" stripe border>
<el-table-column label="规则名称" align="center" prop="name" :show-overflow-tooltip="true" /> <el-table-column :show-overflow-tooltip="true" align="center" label="规则名称" prop="name"/>
<el-table-column label="规则类型" align="center" prop="type" :show-overflow-tooltip="true" /> <el-table-column :show-overflow-tooltip="true" align="center" label="规则类型" prop="type"/>
<el-table-column label="验证模式" align="center" prop="mode" :show-overflow-tooltip="true" /> <el-table-column :show-overflow-tooltip="true" align="center" label="验证模式" prop="mode"/>
<el-table-column label="验证内容" align="center" prop="content" :formatter="ruleContentFormatter" <el-table-column :formatter="contentFormat" :show-overflow-tooltip="true" align="center" label="验证内容"
:show-overflow-tooltip="true" /> prop="content"
<el-table-column label="备注" align="center" prop="remarks" :show-overflow-tooltip="true" /> />
<el-table-column :show-overflow-tooltip="true" align="center" label="备注" prop="remarks"/>
<el-table-column label="操作" align="center" width="150" show-overflow-tooltip> <el-table-column label="操作" align="center" width="150" show-overflow-tooltip>
<template slot-scope="scope"> <template slot-scope="scope">
<el-button plain size="small" @click="testRule(scope.row)">测试</el-button> <el-button plain size="small" @click="testRule(scope.row)">测试</el-button>
<el-button circle icon="el-icon-edit" plain size="small" type="primary" <el-button circle icon="el-icon-edit" plain size="small" type="primary"
@click.stop="editRuleDialog(scope.row)"></el-button> @click.stop="editRuleDialog(scope.row)"
></el-button>
<el-button circle icon="el-icon-delete" plain size="small" type="danger" <el-button circle icon="el-icon-delete" plain size="small" type="danger"
@click.stop="deleteRule(scope.row)"></el-button> @click.stop="deleteRule(scope.row)"
></el-button>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
<pagination v-show="queryParam.total > 0" :total="queryParam.total" :page.sync="queryParam.pageNum" <pagination v-show="queryParam.total > 0" :total="queryParam.total" :page.sync="queryParam.pageNum"
:limit.sync="queryParam.pageSize" @pagination="queryRuleList" /> :limit.sync="queryParam.pageSize" @pagination="queryRuleList"
/>
<!--规则增改--> <!--规则增改-->
<el-dialog :title="dialogData.title" @open="openDialog" :visible.sync="dialogData.show" width="400px" <el-dialog :title="dialogData.title" @open="openDialog" :visible.sync="dialogData.show" width="400px"
:close-on-click-modal="false" append-to-body> :close-on-click-modal="false" append-to-body
>
<el-form ref="ruleForm" :model="dialogData.data" label-width="80px"> <el-form ref="ruleForm" :model="dialogData.data" label-width="80px">
<el-form-item required prop="name" label="规则名称"> <el-form-item required prop="name" label="规则名称">
<el-input v-model="dialogData.data.name" size="small" /> <el-input v-model="dialogData.data.name" size="small"/>
</el-form-item> </el-form-item>
<el-form-item required label="规则类型" prop="type"> <el-form-item required label="规则类型" prop="type">
<el-select @change="typeChange" size="small" v-model="dialogData.data.type" style="width: 160px"> <el-select @change="typeChange" size="small" v-model="dialogData.data.type" style="width: 160px">
<el-option v-for="item in typeDict" :key="item" :value="item" :label="item" /> <el-option v-for="item in typeDict" :key="item" :label="item" :value="item"/>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item required label="验证模式" prop="mode"> <el-form-item required label="验证模式" prop="mode">
<el-select @change="modeChange" size="small" v-model="dialogData.data.mode" style="width: 160px"> <el-select @change="modeChange" size="small" v-model="dialogData.data.mode" style="width: 160px">
<el-option v-for="item in modeDict" :key="item" :value="item" :label="item" /> <el-option v-for="item in modeDict" :key="item" :label="item" :value="item"/>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item required prop="content"> <el-form-item required prop="content">
<!--正则1--> <!--正则1-->
<el-input v-model="dialogData.data.content" type="textarea" placeholder="请输入需要验证的正则表达式" <el-input v-model="dialogData.data.content" type="textarea" placeholder="请输入需要验证的正则表达式"
v-if="dialogData.data.mode === '正则'" /> v-if="dialogData.data.mode === '正则'"
/>
<!--非空数组2--> <!--非空数组2-->
<ArrayInput v-model="dialogData.data.content" placeholder="请输入视为空的值" <ArrayInput v-model="dialogData.data.content" placeholder="请输入视为空的值"
v-if="dialogData.data.mode === '非空'" /> v-if="dialogData.data.mode === '非空'"
/>
<!--区间配置3--> <!--区间配置3-->
<SectionInput v-model="dialogData.data.content" v-if="dialogData.data.mode === '区间'" /> <SectionInput v-if="dialogData.data.mode === '区间'" v-model="dialogData.data.content"/>
<!--比较4--> <!--比较4-->
<el-input v-model="dialogData.data.content" placeholder="输入表达式,例如 >4 , <=4" <el-input v-model="dialogData.data.content" placeholder="输入表达式,例如 >4 , <=4"
v-if="dialogData.data.mode === '比较'" /> v-if="dialogData.data.mode === '比较'"
/>
<!--值域6--> <!--值域6-->
<ArrayInput v-model="dialogData.data.content" placeholder="请输入值域" <ArrayInput v-model="dialogData.data.content" placeholder="请输入值域"
v-if="dialogData.data.mode === '值域'" /> v-if="dialogData.data.mode === '值域'"
/>
<!--逻辑与11--> <!--逻辑与11-->
<!--逻辑或12--> <!--逻辑或12-->
<SectionSelect v-model="dialogData.data.content" :arr="ruleDict" <SectionSelect v-model="dialogData.data.content" :arr="ruleDict"
:config="{ value: 'value', label: 'label' }" v-if="['逻辑与', '逻辑或'].includes(dialogData.data.mode)"
v-if="['逻辑与', '逻辑或'].includes(dialogData.data.mode)" /> :config="{ value: 'value', label: 'label' }"
/>
</el-form-item> </el-form-item>
<el-form-item prop="remarks" label="备注"> <el-form-item prop="remarks" label="备注">
<el-input v-model="dialogData.data.remarks" type="textarea" placeholder="备注" /> <el-input v-model="dialogData.data.remarks" placeholder="备注" type="textarea"/>
</el-form-item> </el-form-item>
</el-form> </el-form>
<div slot="footer" class="dialog-footer"> <div slot="footer" class="dialog-footer">
...@@ -96,9 +108,10 @@ ...@@ -96,9 +108,10 @@
<script> <script>
import * as Emport from '@/api/emport/Emport' import * as Emport from '@/api/emport/Emport'
import ArrayInput from "@/views/emport/rule/ArrayInput.vue"; import ArrayInput from '@/views/emport/rule/ArrayInput.vue'
import SectionInput from "@/views/emport/rule/SectionInput.vue"; import SectionInput from '@/views/emport/rule/SectionInput.vue'
import SectionSelect from "@/views/emport/rule/SectionSelect.vue"; import SectionSelect from '@/views/emport/rule/SectionSelect.vue'
export default { export default {
name: 'Rule', name: 'Rule',
components: { ArrayInput, SectionInput, SectionSelect }, components: { ArrayInput, SectionInput, SectionSelect },
...@@ -110,8 +123,8 @@ export default { ...@@ -110,8 +123,8 @@ export default {
pageNum: 1, pageNum: 1,
pageSize: 20, pageSize: 20,
total: 0, total: 0,
name: "", name: '',
type: "" type: ''
}, },
queryLoading: false, queryLoading: false,
ruleList: [], ruleList: [],
...@@ -120,7 +133,7 @@ export default { ...@@ -120,7 +133,7 @@ export default {
show: false, show: false,
data: {} data: {}
}, },
ruleDict: [], // 规则下拉字典 ruleDict: [] // 规则下拉字典
} }
}, },
created() { created() {
...@@ -145,7 +158,7 @@ export default { ...@@ -145,7 +158,7 @@ export default {
}, },
// 查询规则列表 // 查询规则列表
queryRuleList() { queryRuleList() {
this.queryLoading = true; this.queryLoading = true
Emport.queryRule(this.queryParam).then(res => { Emport.queryRule(this.queryParam).then(res => {
if (res.code === 200) { if (res.code === 200) {
this.queryParam.total = res.total this.queryParam.total = res.total
...@@ -157,13 +170,13 @@ export default { ...@@ -157,13 +170,13 @@ export default {
}, },
// 打开添加规则dialog // 打开添加规则dialog
openAddruleDialog() { openAddruleDialog() {
this.dialogData.title = "添加规则" this.dialogData.title = '添加规则'
this.dialogData.data = {} this.dialogData.data = {}
this.dialogData.show = true this.dialogData.show = true
}, },
// 打开编辑规则dialog // 打开编辑规则dialog
editRuleDialog(row) { editRuleDialog(row) {
this.dialogData.title = "编辑规则" this.dialogData.title = '编辑规则'
this.dialogData.data = { ...row } this.dialogData.data = { ...row }
this.dialogData.show = true this.dialogData.show = true
}, },
...@@ -220,27 +233,42 @@ export default { ...@@ -220,27 +233,42 @@ export default {
}, },
// 规则测试 // 规则测试
testRule(data) { testRule(data) {
if(data){ if (data) {
this.$prompt('请输入测试数据', '测试', this.$prompt('请输入测试数据', '测试',
{ {
confirmButtonText: '确定', confirmButtonText: '确定',
cancelButtonText: '取消', cancelButtonText: '取消',
beforeClose: (action, instance, done) => { beforeClose: (action, instance, done) => {
if (action === 'confirm') { if (action === 'confirm') {
Emport.queryRuleDict(data).then(res => { instance.confirmButtonLoading = true
if (res.code === 200) { Emport.ruleTest({
this.$message.success("校验通过"); ...data,
} value: instance.inputValue
}) }).then(res => {
} else { if (res.code === 200) {
done() this.$message.success('校验通过')
} }
}).finally(_ => instance.confirmButtonLoading = false)
} else {
done()
} }
} }
) }
)
} }
}, },
}, // 验证内容合并
contentFormat(row){
if (row.type === '基础规则'){
return row.content
}else {
let idArr = row.content.split(',')
return this.ruleDict.filter(item=>idArr.includes(item.value))
.map(item=>item.label)
.join(",")
}
},
}
} }
</script> </script>
......
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