Skip to content

9
91isoft_vue_manage
Commit 3afade40 authored by 杨硕's avatar 杨硕
Browse files
Options

字典数据添加导入

parent 0222ca62
Show whitespace changes
Inline Side-by-side
Showing with 407 additions and 362 deletions
src/api/system/dict/data.js
View file @ 3afade40
...@@ -81,3 +81,27 @@ export function exportData(query) { ...@@ -81,3 +81,27 @@ export function exportData(query) {
responseType: 'blob' responseType: 'blob'
}) })
} }
// 下载字典数据导入模板
export function importTemplate(params) {
return request({
url: '/system/dict/data/importTemplate',
method: 'get',
responseType: 'blob',
params
})
}
// 导入字典数据信息
export function importExcel(data) {
return request({
url: '/system/dict/data/importDictData',
method: 'post',
headers: {
'Content-Type': 'multipart/form-data'
},
transformRequest: [(data) => {
return data
}],
data
})
}
src/views/system/dict/data.vue
View file @ 3afade40
<template> <template>
<div class="app-container-dict"> <div class="app-container">
<el-form ref="queryForm" style="padding: 0 0 0 10px" :model="queryParams" :inline="true" label-width="68px"> <el-form v-show="showSearch" ref="queryForm" style="width: 100%" :model="queryParams" :inline="true">
<el-form-item label="字典名称" prop="dictName"> <el-form-item label="字典名称" prop="dictType">
<el-input <el-select v-model="queryParams.dictType" placeholder="请选择字典名称" clearable size="small">
v-model="queryParams.dictName" <el-option
placeholder="请输入字典名称" v-for="item in typeOptions"
clearable :key="item.businessId"
:maxlength="30" :label="item.dictName"
size="small" :value="item.dictType"
style="width: 200px"
@keyup.enter.native="handleQuery"
/> />
</el-select>
</el-form-item> </el-form-item>
<el-form-item label="字典类型" prop="dictType"> <el-form-item label="字典标签" prop="dictLabel">
<el-input <el-input
v-model.trim="queryParams.dictType" v-model="queryParams.dictLabel"
placeholder="请输入字典类型" placeholder="请输入字典标签"
clearable clearable
:maxlength="30" :maxlength="30"
size="small" size="small"
style="width: 200px"
@keyup.enter.native="handleQuery" @keyup.enter.native="handleQuery"
/> />
</el-form-item> </el-form-item>
<el-form-item label="状态" prop="flag"> <el-form-item label="状态" prop="flag">
<el-select <el-select v-model="queryParams.flag" placeholder="数据状态" clearable size="small">
v-model="queryParams.flag"
placeholder="字典状态"
clearable
size="small"
style="width: 200px"
>
<el-option <el-option
v-for="dict in statusOptions" v-for="dict in statusOptions"
:key="dict.dictValue" :key="dict.dictValue"
...@@ -39,32 +31,22 @@ ...@@ -39,32 +31,22 @@
/> />
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="创建时间">
<el-date-picker
v-model="dateRange"
size="small"
style="width: 200px"
value-format="yyyy-MM-dd"
type="daterange"
range-separator="-"
start-placeholder="开始日期"
end-placeholder="结束日期"
/>
</el-form-item>
<el-form-item> <el-form-item>
<el-button type="primary" icon="el-icon-search" size="small" @click="handleQuery">搜索</el-button> <el-button type="primary" icon="el-icon-search" size="small" @click="handleQuery">查询</el-button>
<el-button icon="el-icon-refresh" size="small" @click="resetQuery">重置</el-button> <el-button icon="el-icon-refresh" size="small" @click="resetQuery">重置</el-button>
</el-form-item> </el-form-item>
</el-form>
<el-row :gutter="10" class="mb8"> <el-row :gutter="10" class="mb8">
<el-col :span="1.5"> <el-col :span="1.5">
<!-- <el-button--> <!-- <el-button-->
<!-- v-hasPermi="['sys:dict:add']"--> <!-- v-hasPermi="['sys:dict:add']"-->
<!-- type="primary"--> <!-- type="primary"-->
<!-- icon="el-icon-plus"--> <!-- icon="el-icon-plus"-->
<!-- size="small"--> <!-- size="mini"-->
<!-- @click="handleAdd"--> <!-- @click="handleAdd"-->
<!-- >新增</el-button>--> <!-- >新增-->
<coolbutton :type="typePrimary" :name="addName" :size="smallSize" :icon="addIcon" :haspermi="addHaspermi" @btn-click="handleAdd" /> <!-- </el-button>-->
<coolbutton :type="typePrimary" :name="addName" :icon="addIcon" :size="size" :haspermi="addHaspermi" @btn-click="handleAdd" />
</el-col> </el-col>
<el-col :span="1.5"> <el-col :span="1.5">
<!-- <el-button--> <!-- <el-button-->
...@@ -79,52 +61,49 @@ ...@@ -79,52 +61,49 @@
<!-- <coolbutton :type="typeSuccess" :name="updataName" :icon="updateIcon" :size="size" :haspermi="updateHaspermi" @btn-click="handleUpdate" />--> <!-- <coolbutton :type="typeSuccess" :name="updataName" :icon="updateIcon" :size="size" :haspermi="updateHaspermi" @btn-click="handleUpdate" />-->
</el-col> </el-col>
<el-col :span="1.5"> <el-col :span="1.5">
<!-- <el-button--> <el-button
<!-- v-hasPermi="['sys:dict:delete']"--> type="warning"
<!-- type="danger"--> icon="el-icon-upload"
<!-- icon="el-icon-delete"--> size="small"
<!-- size="mini"--> @click="handleImport"
<!-- :disabled="multiple"--> >导入</el-button>
<!-- @click="handleDelete"-->
<!-- >删除-->
<!-- </el-button>-->
<!-- <coolbutton :type="typeDanger" :name="nameParent" :icon="delicon" :size="size" :haspermi="delHaspermi" @btn-click="handleDelete" />-->
</el-col> </el-col>
<el-col :span="1.5"> <el-col :span="1.5">
<!-- <el-button--> <el-button
<!-- v-hasPermi="['sys:dict:export']"--> v-has-permi="['sys:dict:export']"
<!-- type="success"--> type="success"
<!-- icon="el-icon-download"--> icon="el-icon-download"
<!-- size="small"--> size="small"
<!-- @click="handleExport"--> @click="handleExport"
<!-- >导出</el-button>--> >导出
<coolbutton :type="typeSuccess" :name="exportName" :icon="exportIcon" :size="size" :haspermi="exportHaspermi" @btn-click="handleExport" /> </el-button>
</el-col> </el-col>
<!-- <right-toolbar :show-search.sync="showSearch" @queryTable="getList" />--> <right-toolbar :show-search.sync="showSearch" @queryTable="getList" />
</el-row> </el-row>
</el-form>
<div class="placeholder" /> <div class="placeholder" />
<div style="min-height: 445px;padding:10px"> <div style="padding:10px">
<h5 style="margin: 0 0 12px 0;font-size: 14px">字典管理列表</h5> <div class="mb12 font-small-bold">字典参数列表</div>
<el-table v-loading="loading" border :data="typeList" @selection-change="handleSelectionChange"> <el-table v-loading="loading" :data="dataList" border @selection-change="handleSelectionChange">
<el-table-column type="index" label="序号" width="55" align="center" /> <el-table-column type="selection" width="55" align="center" />
<!-- <el-table-column label="字典编号" align="center" prop="businessId" />--> <!-- <el-table-column :show-overflow-tooltip="true" label="参数编码" prop="dictCode">-->
<el-table-column label="字典名称" prop="dictName" :show-overflow-tooltip="true"> <!-- <template slot-scope="scope">-->
<!-- {{ scope.row.dictCode || '-' }}-->
<!-- </template>-->
<!-- </el-table-column>-->
<el-table-column label="字典编码" align="center" prop="businessId" />
<el-table-column :show-overflow-tooltip="true" label="字典标签" prop="dictLabel">
<template slot-scope="scope"> <template slot-scope="scope">
{{ scope.row.dictName || '-' }} {{ scope.row.dictLabel || '-' }}
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="字典类型" :show-overflow-tooltip="true"> <el-table-column :show-overflow-tooltip="true" label="字典键值" prop="dictValue">
<template slot-scope="scope"> <template slot-scope="scope">
<!-- v-hasPermi="['system:dictConfig:list']"--> {{ scope.row.dictValue || '-' }}
<router-link </template>
v-if="scope.row.businessId" </el-table-column>
:to="'/dict/type/data/' + scope.row.businessId" <el-table-column :show-overflow-tooltip="true" label="字典排序" prop="dictSort">
class="link-type" <template slot-scope="scope">
> {{ isNaN(scope.row.dictSort) ? '-' : scope.row.dictSort }}
<span style="color: #20a0ff">{{ scope.row.dictType }}</span>
</router-link>
<div v-else>-</div>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="状态" align="center" prop="flag"> <el-table-column label="状态" align="center" prop="flag">
...@@ -134,16 +113,16 @@ ...@@ -134,16 +113,16 @@
class="switchDisabledStyle" class="switchDisabledStyle"
inactive-value="0" inactive-value="0"
active-value="1" active-value="1"
@click.native="handleStatusChange(scope.row)" @click.native="changeStatus(scope.row)"
/> />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="备注" prop="remarks" :show-overflow-tooltip="true"> <el-table-column :show-overflow-tooltip="true" label="备注" prop="remarks">
<template slot-scope="scope"> <template slot-scope="scope">
{{ scope.row.remarks || '-' }} {{ scope.row.remarks || '-' }}
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="创建时间" :show-overflow-tooltip="true" prop="createTime"> <el-table-column :show-overflow-tooltip="true" label="创建时间" prop="createDate">
<template slot-scope="scope"> <template slot-scope="scope">
<span>{{ scope.row.createDate | transformDateByFormat('YYYY-MM-DD HH:mm') }}</span> <span>{{ scope.row.createDate | transformDateByFormat('YYYY-MM-DD HH:mm') }}</span>
</template> </template>
...@@ -151,20 +130,29 @@ ...@@ -151,20 +130,29 @@
<el-table-column label="操作" class-name="small-padding fixed-width"> <el-table-column label="操作" class-name="small-padding fixed-width">
<template slot-scope="scope"> <template slot-scope="scope">
<!-- <el-button--> <!-- <el-button-->
<!-- v-hasPermi="['sys:dict:edit']"--> <!-- v-hasPermi="['sys:dictConfig:edit']"-->
<!-- size="mini"--> <!-- size="mini"-->
<!-- type="text"--> <!-- type="text"-->
<!-- style="color: #49cec9"--> <!-- style="color: #49cec9"-->
<!-- @click="handleUpdate(scope.row)"--> <!-- @click="handleUpdate(scope.row)"-->
<!-- >修改</el-button>--> <!-- >修改</el-button>-->
<coolbutton :type="typeParent" style="color: #49cec9" :name="updataName" :size="size" :haspermi="updateHaspermi" @btn-click="handleUpdate(scope.row)" /> <coolbutton style="color: #49cec9" :type="typeParent" :name="updataName" :size="size" :haspermi="editHaspermi" @btn-click="handleUpdate(scope.row)" />
<!-- <el-button--> <!-- <el-button-->
<!-- v-hasPermi="['sys:dict:remove']"--> <!-- v-hasPermi="['sys:dictConfig:remove']"-->
<!-- size="mini"--> <!-- size="mini"-->
<!-- type="text"--> <!-- type="text"-->
<!-- @click="handleDelete(scope.row)"--> <!-- @click="handleDelete(scope.row)"-->
<!-- >删除</el-button>--> <!-- >删除</el-button>-->
<coolbutton :type="typeParent" :name="nameParent" :size="size" :haspermi="delHaspermi" @btn-click="handleDelete(scope.row)" /> <coolbutton :type="typeParent" :icon="delicon" :name="nameParent" :size="size" :haspermi="removeHaspermi" @btn-click="handleDelete(scope.row)" />
<!-- <el-switch-->
<!-- v-model="scope.row.status"-->
<!-- v-hasPermi="['sys:dictConfig:toggle']"-->
<!-- disabled-->
<!-- class="switchDisabledStyle"-->
<!-- active-value="0"-->
<!-- inactive-value="1"-->
<!-- @click.native="changeStatus(scope.row)"-->
<!-- />-->
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
...@@ -172,123 +160,104 @@ ...@@ -172,123 +160,104 @@
<pagination <pagination
v-show="total>0" v-show="total>0"
:total="total" :total="total"
:page.sync="queryParams.page" :page.sync="queryParams.pageNum"
:limit.sync="queryParams.rows" :limit.sync="queryParams.pageSize"
@pagination="getList" @pagination="getList"
/> />
<!-- 添加或修改参数配置对话框 --> <!-- 添加或修改参数配置对话框 -->
<el-dialog title="字典信息" :visible.sync="open" width="500px" append-to-body @close="reset"> <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="100px"> <el-form ref="form" :model="form" :rules="rules" label-width="80px">
<el-form-item label="字典名称" prop="dictName"> <el-form-item label="字典类型">
<el-input v-model.trim="form.dictName" :maxlength="30" placeholder="请输入字典名称" /> <el-input v-model.trim="form.dictType" :disabled="true" show-word-limit maxlength="30" placeholder="请输入字典类型" />
</el-form-item>
<el-form-item label="参数标签" prop="dictLabel">
<el-input v-model.trim="form.dictLabel" show-word-limit maxlength="30" placeholder="请输入参数标签" />
</el-form-item> </el-form-item>
<el-form-item label="字典类型" prop="dictType"> <el-form-item label="参数键值" prop="dictValue">
<el-input v-model.trim="form.dictType" :maxlength="30" placeholder="请输入字典类型" /> <el-input v-model.trim="form.dictValue" show-word-limit maxlength="300" placeholder="请输入参数键值" />
</el-form-item> </el-form-item>
<!-- <el-form-item label="状态" prop="flag">--> <el-form-item label="参数排序" prop="dictSort">
<!-- <el-radio-group v-model="form.flag">--> <el-input-number v-model="form.dictSort" style="width: 100%" controls-position="right" :min="0" />
</el-form-item>
<!-- <el-form-item label="参数状态" prop="status">-->
<!-- <el-radio-group v-model="form.status">-->
<!-- <el-radio--> <!-- <el-radio-->
<!-- v-for="dict in statusOptions"--> <!-- v-for="dict in statusOptions.filter(item => { return item.dictValue })"-->
<!-- :key="dict.dictValue"--> <!-- :key="dict.dictValue"-->
<!-- :label="dict.dictValue"--> <!-- :label="dict.dictValue"-->
<!-- >{{ dict.dictLabel }}--> <!-- >{{ dict.dictLabel }}</el-radio>-->
<!-- </el-radio>-->
<!-- </el-radio-group>--> <!-- </el-radio-group>-->
<!-- </el-form-item>--> <!-- </el-form-item>-->
<el-form-item label="父字典名称">
<el-select v-model="form.parentId" style="width: 100%" clearable placeholder="请选择父字典类型" @change="getOptions">
<el-option
v-for="item in options"
:key="item.businessId"
:label="item.dictName"
:value="item.businessId"
/>
</el-select>
</el-form-item>
<el-form-item v-show="form.parentId">
<el-select v-model="form.dataId" style="width: 100%" clearable placeholder="请选择父字典数据" @visible-change="clearSelected">
<el-option
v-for="item in optionsDict"
:key="item.dictValue"
:label="item.dictLabel"
:disabled="item.status == 1"
:value="item.dictValue"
>
<span style="float: left">{{ item.dictLabel }}</span>
<span v-if="item.status === '1'" style="float: right; color: #8492a6; font-size: 12px;padding-left: 10px">{{ '已停用' }}</span>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="备注" prop="remarks"> <el-form-item label="备注" prop="remarks">
<el-input v-model.trim="form.remarks" maxlength="200" type="textarea" placeholder="请输入内容" /> <el-input v-model.trim="form.remarks" type="textarea" show-word-limit maxlength="200" placeholder="请输入内容" />
</el-form-item> </el-form-item>
</el-form> </el-form>
<div slot="footer" class="dialog-footer"> <div slot="footer" class="dialog-footer">
<el-button type="primary" :loading="manageLoading" :disabled="manageLoading" @click="submitForm">确 定</el-button> <el-button type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel">取 消</el-button> <el-button @click="cancel">取 消</el-button>
</div> </div>
</el-dialog> </el-dialog>
<!-- 字典数据导入对话框 -->
<el-dialog :title="upload.title" :visible.sync="upload.open" width="400px" append-to-body>
<el-upload
accept=".xlsx, .xls"
:headers="upload.headers"
:action="upload.url + '?updateSupport=' + upload.updateSupport"
:disabled="upload.isUploading"
:on-progress="handleFileUploadProgress"
:on-success="handleFileSuccess"
:auto-upload="false"
:on-change="employeeUpload"
:on-remove="handleRemove"
:before-remove="beforeRemove"
:on-preview="handlePreview"
:file-list="files"
drag
>
<i class="el-icon-upload" />
<div class="el-upload__text">
将文件拖到此处，或
<em>点击上传</em>
</div>
<div slot="tip" class="el-upload__tip">
<!-- <el-checkbox v-model="upload.updateSupport" />是否更新已经存在的用户数据-->
<el-link type="info" style="font-size:12px" @click="importTemplate">下载模板</el-link>
</div>
<div slot="tip" class="el-upload__tip" style="color:red">提示：仅允许导入“xls”或“xlsx”格式文件！</div>
</el-upload>
<div slot="footer" class="dialog-footer">
<el-button @click="upload.open = false">取 消</el-button>
<el-button :loading="importLoading" type="primary" @click="submitFileForm">确 定</el-button>
</div>
</el-dialog>
</div> </div>
</template> </template>
<script> <script>
import { listType, import { listData, getData, delData, addData, updateData, exportData, checkDictLabelUnique, importExcel, importTemplate } from '@/api/system/dict/data'
getType, import { listType, getType, updateType } from '@/api/system/dict/type'
delType,
addType,
updateType,
exportType,
clearCache,
optionselect,
selectRegionCode,
checkDictNameUnique,
selectDictType
} from '@/api/system/dict/type'
import dictCons from '@/utils/dictCons' import dictCons from '@/utils/dictCons'
// import Template from '@/views/instance/Template'
import Coolbutton from '@/components/coolbutton' import Coolbutton from '@/components/coolbutton'
import { getToken } from '@/utils/auth'
import { uploadFalseFile } from '@/api/system/user'
export default { export default {
name: 'Dict', name: 'Data',
components: { Coolbutton }, components: { Coolbutton },
data() { data() {
const verifyTypeProp = (rule, value, callback) => { const verifyIDProp = (rule, value, callback) => {
if (value === '' || value === undefined || value === null) {
callback()
} else if (!this.form.dictTypeOne || this.form.dictTypeOne !== this.form.dictType) {
// 验证编码是否重复
selectRegionCode(this.form.dictType).then(
(res) => {
if (res.code === 200) {
if (res.msg === '0') {
callback()
} else if (res.msg === '1') {
callback(new Error('字典类型已存在'))
} else {
callback()
}
} else {
callback()
}
}
).catch(err => {
callback()
})
} else {
callback()
}
}
const verifyNameProp = (rule, value, callback) => {
if (value === '' || value === undefined || value === null) { if (value === '' || value === undefined || value === null) {
callback() callback()
} else if (!this.form.dictNameOne || this.form.dictNameOne !== this.form.dictName) { } else if (!this.form.dictLabelOne || this.form.dictLabelOne !== this.form.dictLabel) {
// 验证编码是否重复 // 验证编码是否重复
checkDictNameUnique(this.form.dictName).then( checkDictLabelUnique(this.form.dictLabel).then(
(res) => { (res) => {
if (res.code === 200) { if (res.code === 200) {
if (res.msg === '0') { if (res.msg === '0') {
callback() callback()
} else if (res.msg === '1') { } else if (res.msg === '1') {
callback(new Error('字典名称已存在')) callback(new Error('字典标签已存在'))
} else { } else {
callback() callback()
} }
...@@ -304,8 +273,6 @@ export default { ...@@ -304,8 +273,6 @@ export default {
} }
} }
return { return {
test: '',
options: [],
typeParent: 'text', typeParent: 'text',
typePrimary: 'primary', typePrimary: 'primary',
typeSuccess: 'success', typeSuccess: 'success',
...@@ -316,7 +283,7 @@ export default { ...@@ -316,7 +283,7 @@ export default {
queryName: '查询', queryName: '查询',
exportName: '导出', exportName: '导出',
updataName: '修改', updataName: '修改',
size: 'mini', size: 'small',
smallSize: 'small', smallSize: 'small',
delicon: 'el-icon-delete', delicon: 'el-icon-delete',
addIcon: 'el-icon-plus', addIcon: 'el-icon-plus',
...@@ -325,135 +292,100 @@ export default { ...@@ -325,135 +292,100 @@ export default {
updateIcon: 'el-icon-edit', updateIcon: 'el-icon-edit',
resetIcon: '', resetIcon: '',
delHaspermi: ['sys:dict:delete'], delHaspermi: ['sys:dict:delete'],
removeHaspermi: ['sys:dict:remove'], removeHaspermi: ['sys:dictConfig:remove'],
resetHaspermi: ['sys:user:resetPwd'], resetHaspermi: ['sys:user:resetPwd'],
updateHaspermi: ['sys:dict:update'], updateHaspermi: ['sys:dict:update'],
editHaspermi: ['sys:dict:edit'], editHaspermi: ['sys:dictConfig:edit'],
addHaspermi: ['sys:dict:add'], addHaspermi: ['sys:dict:add'],
exportHaspermi: ['sys:dict:export'], exportHaspermi: ['sys:dict:export'],
queryHaspermi: ['sys:menu:query'], queryHaspermi: ['sys:menu:query'],
optionsDict: [], // 导入列表
files: [],
// 字典数据导入参数
upload: {
// 是否显示弹出层（字典数据导入）
open: false,
// 弹出层标题（字典数据导入）
title: '',
// 是否禁用上传
isUploading: false,
// 是否更新已经存在的用户数据
updateSupport: 0,
// 设置上传的请求头部
headers: { Authorization: 'Bearer ' + getToken() },
// 上传的地址
url: process.env.VUE_APP_BASE_API + '/system/user/importExcel'
},
// 遮罩层 // 遮罩层
loading: true, loading: false,
// 选中数组 // 选中数组
ids: [], ids: [],
// 非单个禁用 // 非单个禁用
single: true, single: true,
// 非多个禁用 // 非多个禁用
multiple: true, multiple: true,
// 显示搜索条件
showSearch: true,
// 总条数 // 总条数
total: 0, total: 0,
// 字典表格数据 // 字典表格数据
typeList: [], dataList: [],
// 默认字典类型
defaultDictType: '',
// 弹出层标题 // 弹出层标题
title: '', title: '',
// 是否显示弹出层 // 是否显示弹出层
open: false, open: false,
// 状态数据字典 // 状态数据字典
statusOptions: [ statusOptions: [],
{ // 类型数据字典
dictLabel: '启用', typeOptions: [],
dictValue: '1' importLoading: false,
},
{
dictLabel: '停用',
dictValue: '0'
}
],
// 日期范围
dateRange: [],
// 查询参数 // 查询参数
queryParams: { queryParams: {
page: 1, pageNum: 1,
rows: 10, pageSize: 10,
dictName: undefined, dictName: undefined,
dictType: undefined, dictType: undefined,
status: '',
flag: undefined flag: undefined
// status: undefined
}, },
// 表单参数 // 表单参数
form: { form: {},
parentId: '',
dataId: '',
dictTypeOne: '',
dictNameOne: ''
},
// 表单校验 // 表单校验
rules: { rules: {
dictName: [ dictLabel: [
{ required: true, message: '请输入字典名称', trigger: 'blur' } { required: true, message: '请输入参数标签', trigger: 'blur' }
// { validator: verifyNameProp, trigger: 'blur' } // { validator: verifyIDProp, trigger: 'blur' }
], ],
dictType: [ dictValue: [
{ required: true, message: '请输入字典类型', trigger: 'blur' } { required: true, message: '请输入参数键值', trigger: 'blur' }
// { validator: verifyTypeProp, trigger: 'blur' } ],
dictSort: [
{ required: true, message: '请输入参数顺序', trigger: 'blur' }
] ]
}, },
manageLoading: false manageLoading: false
} }
}, },
/** 路由离开前存储筛选条件*/
beforeRouteLeave(to, from, next) {
this.$store.dispatch('searchSave/searchParamsSet', {
path: this.$route.path,
param: {
...this.queryParams
}
})
next()
},
created() { created() {
if (this.$store.getters.searchParams[this.$route.path]) { const dictId = this.$route.params && this.$route.params.dictId
const { searchParams } = this.$store.getters; const { path } = this.$route this.getType(dictId)
const param = JSON.parse(searchParams[path]) // 保留着的查询条件 this.getTypeList()
this.queryParams = { ...param }
}
this.getList()
// this.getDicts(dictCons['NORMAL_DISABLE']).then(response => { // this.getDicts(dictCons['NORMAL_DISABLE']).then(response => {
// this.statusOptions = response.data // this.statusOptions = response.data
// }) // })
// optionselect().then(response => {
// this.options = response.data
// })
}, },
methods: { methods: {
/** 查询字典类型列表 */ // 状态
getList() { changeStatus(row) {
listType(this.addDateRange(this.queryParams, this.dateRange)).then(response => {
this.options = response.rows
this.typeList = response.rows
this.total = response.total
this.loading = false
}
)
},
// 获取当前父字典数据
getOptions(val) {
selectDictType(this.options.find(item => { return item.businessId === val }).dictType).then(response => {
this.optionsDict = response.data
})
// this.form.dataId = ''
},
clearSelected(flag) {
// flag = true 为下拉框选项展开时的标识
if (flag) {
if (this.form.dataId) {
// 如果找不到 下拉框选项中对应选中的选项 或者 下拉框选项中对应选中的选项 状态为1（停用）则将双向绑定的数据清空
if (!this.optionsDict.find(item => { return item.dictCode === this.form.dataId }) ||
this.optionsDict.find(item => { return item.dictCode === this.form.dataId }).status === 1) {
this.form.dataId = ''
}
}
}
},
handleStatusChange(row) {
const text = row.flag === '1' ? '启用' : '停用' const text = row.flag === '1' ? '启用' : '停用'
this.$confirm('确认确认操作?', '提示', { this.$confirm('确认要"' + text + '""' + row.dictLabel + '"吗?', '提示', {
confirmButtonText: '确定', confirmButtonText: '确定',
cancelButtonText: '取消', cancelButtonText: '取消',
type: 'warning' type: 'warning'
}).then(function() { }).then(function() {
return updateType(row) return updateData(row)
}).then(() => { }).then(() => {
this.$message({ this.$message({
message: text + '成功', message: text + '成功',
...@@ -463,7 +395,37 @@ export default { ...@@ -463,7 +395,37 @@ export default {
row.flag = row.flag === '0' ? '1' : '0' row.flag = row.flag === '0' ? '1' : '0'
}) })
}, },
// 字典状态字典翻译 /** 查询字典类型详细 */
getType(dictId) {
getType(dictId).then(response => {
this.queryParams.dictType = response.data.dictType
this.defaultDictType = response.data.dictType
this.getList()
})
},
/** 导入按钮操作 */
handleImport() {
this.upload.title = '字典数据导入'
this.upload.open = true
},
/** 查询字典类型列表 */
getTypeList() {
listType().then(response => {
this.typeOptions = response.rows
})
},
/** 查询字典数据列表 */
getList() {
this.loading = true
listData(this.queryParams).then(response => {
if (response.rows) {
this.dataList = response.rows
this.total = response.total
}
this.loading = false
})
},
// 数据状态字典翻译
// statusFormat(row, column) { // statusFormat(row, column) {
// return this.selectDictLabel(this.statusOptions, row.flag) // return this.selectDictLabel(this.statusOptions, row.flag)
// }, // },
...@@ -475,32 +437,34 @@ export default { ...@@ -475,32 +437,34 @@ export default {
// 表单重置 // 表单重置
reset() { reset() {
this.form = { this.form = {
dataId: '', bussinessId: undefined,
parentId: '', dictCode: undefined,
businessId: undefined, dictLabel: undefined,
dictName: undefined, dictValue: undefined,
dictType: undefined, dictSort: 0,
flag: '1',
status: '0', status: '0',
remarks: undefined, remarks: undefined
flag: '1'
} }
this.resetForm('form')
}, },
/** 搜索按钮操作 */ /** 搜索按钮操作 */
handleQuery() { handleQuery() {
this.queryParams.page = 1 this.queryParams.pageNum = 1
this.getList() this.getList()
}, },
/** 重置按钮操作 */ /** 重置按钮操作 */
resetQuery() { resetQuery() {
this.dateRange = []
this.resetForm('queryForm') this.resetForm('queryForm')
this.queryParams.dictType = this.defaultDictType
this.handleQuery() this.handleQuery()
}, },
/** 新增按钮操作 */ /** 新增按钮操作 */
handleAdd() { handleAdd() {
this.reset() this.reset()
this.open = true this.open = true
this.title = 'add' this.title = '添加字典数据'
this.form.dictType = this.queryParams.dictType
}, },
// 多选框选中数据 // 多选框选中数据
handleSelectionChange(selection) { handleSelectionChange(selection) {
...@@ -511,86 +475,65 @@ export default { ...@@ -511,86 +475,65 @@ export default {
/** 修改按钮操作 */ /** 修改按钮操作 */
handleUpdate(row) { handleUpdate(row) {
this.reset() this.reset()
const dictId = row.businessId || this.ids const dictCode = row.businessId || this.ids
getType(dictId).then(response => { getData(dictCode).then(response => {
this.form = response.data this.form = response.data
this.$nextTick(() => { this.form.dictLabelOne = response.data.dictLabel
this.form.dataId = response.data.dataId.toString()
this.$forceUpdate()
})
this.getOptions(this.form.parentId)
this.open = true this.open = true
this.title = '修改字典类型' this.title = '修改字典数据'
}) })
}, },
/** 提交按钮 */ /** 提交按钮 */
submitForm() { submitForm: function() {
this.$refs['form'].validate(valid => { this.$refs['form'].validate(valid => {
if (valid) { if (valid) {
this.manageLoading = true if (this.form.businessId !== undefined) {
const temp = Object.assign({}, this.form) updateData(this.form).then(response => {
if (!temp.parentId) { temp.dataId = '' } this.msgSuccess('修改成功')
if (this.title === '修改字典类型') {
updateType(temp).then(response => {
if (response.code === 200) {
this.$message({
message: '修改成功',
type: 'success'
})
this.open = false this.open = false
this.getList() this.getList()
}
this.manageLoading = false
}).catch(() => { this.manageLoading = false })
} else {
addType(temp).then(response => {
if (response.code === 200) {
this.$message({
message: '新增成功',
type: 'success'
}) })
} else {
addData(this.form).then(response => {
this.msgSuccess('新增成功')
this.open = false this.open = false
this.getList() this.getList()
} })
this.manageLoading = false
}).catch(() => { this.manageLoading = false })
} }
} }
}) })
}, },
/** 删除按钮操作 */ /** 删除按钮操作 */
handleDelete(row) { handleDelete(row) {
const dictIds = row.businessId || this.ids const dictCodes = row.businessId || this.ids
const that = this this.$confirm('所选择数据被删除后不可再恢复，是否继续？', '提示', {
this.$confirm('是否确认操作?', '警告', {
confirmButtonText: '确定', confirmButtonText: '确定',
cancelButtonText: '取消', cancelButtonText: '取消',
type: 'warning' type: 'warning'
}).then(function() { }).then(function() {
delType(dictIds).then(res => { return delData(dictCodes)
if (res.code === 200) { }).then(() => {
that.getList() this.getList()
that.msgSuccess('删除成功') this.$message({
} else { message: '删除成功',
that.$message.error(res.message) type: 'success'
}
})
}) })
}).catch(function() {})
}, },
/** 导出按钮操作 */ /** 导出按钮操作 */
handleExport() { handleExport() {
const queryParams = this.queryParams const queryParams = this.queryParams
this.$confirm('是否确认操作?', '警告', { this.$confirm('是否确认导出所有数据项?', '警告', {
confirmButtonText: '确定', confirmButtonText: '确定',
cancelButtonText: '取消', cancelButtonText: '取消',
type: 'warning' type: 'warning'
}).then(function() { }).then(function() {
return exportType(queryParams).then(response => { return exportData(queryParams).then(response => {
const blob = new Blob([response]) const blob = new Blob([response])
const downloadElement = document.createElement('a') const downloadElement = document.createElement('a')
const href = window.URL.createObjectURL(blob)// 创建下载的链接 const href = window.URL.createObjectURL(blob)// 创建下载的链接
downloadElement.href = href downloadElement.href = href
downloadElement.download = '字典类型信息' + '.xls' // 下载后文件名 downloadElement.download = '字典数据信息' + '.xls' // 下载后文件名
document.body.appendChild(downloadElement) document.body.appendChild(downloadElement)
downloadElement.click()// 点击下载 downloadElement.click()// 点击下载
document.body.removeChild(downloadElement)// 下载完成移除元素 document.body.removeChild(downloadElement)// 下载完成移除元素
...@@ -599,22 +542,107 @@ export default { ...@@ -599,22 +542,107 @@ export default {
}) })
}) })
}, },
/** 清理缓存按钮操作 */ // 文件上传中处理
handleClearCache() { handleFileUploadProgress(event, file, fileList) {
clearCache().then(response => { this.upload.isUploading = true
if (response.code === 200) { },
this.$message({ // 文件上传成功处理
message: '清理成功', handleFileSuccess(response) {
type: 'success' this.upload.open = false
this.upload.isUploading = false
this.$refs.upload.clearFiles()
this.$alert(response.msg, '导入结果', { dangerouslyUseHTMLString: true })
this.getList()
},
employeeUpload(file, fileList) {
if (fileList.length > 1) {
fileList.splice(0, 1)
}
this.files = fileList[0].raw
},
handleRemove(file, fileList) {
this.files = []
},
beforeRemove(file, fileList) {
this.files = []
},
/* 上传文件所需求 */
handlePreview(file) {
},
/** 下载模板操作 */
importTemplate() {
var params = {
dictType: this.queryParams.dictType
}
importTemplate(params).then(response => {
const blob = new Blob([response])
const downloadElement = document.createElement('a')
const href = window.URL.createObjectURL(blob)// 创建下载的链接
downloadElement.href = href
downloadElement.download = '字典数据导入模板' + '.xls' // 下载后文件名
document.body.appendChild(downloadElement)
downloadElement.click()// 点击下载
document.body.removeChild(downloadElement)// 下载完成移除元素
window.URL.revokeObjectURL(href)// 释放掉blob对象
// this.download(response.msg);
}) })
},
// 提交上传文件
submitFileForm() {
// this.$refs.upload.submit()
this.importLoading = true
if (this.files.length === 0) {
this.$message.warning('请上传文件')
// 导入成功后关闭弹出框
this.importLoading = false
this.upload.open = true
} else { // 根据后台需求数据格式
var formData = new FormData() // 当前为空
formData.append('file', this.files)
importExcel(formData).then(res => {
if (res.code === 200) {
if (res.data.filename === null) {
this.$message.success('导入成功')
this.files = []
// 导入成功后关闭弹出框
this.importLoading = false
this.upload.open = false
// 导入成功后刷新页面
this.getList()
} else {
uploadFalseFile({ fileName: res.data.filename }).then(res => {
const blob = new Blob([res])
const downloadElement = document.createElement('a')
const href = window.URL.createObjectURL(blob) // 创建下载的链接
downloadElement.href = href
downloadElement.download = '模板错误提示' + '.txt' // 下载后文件名
document.body.appendChild(downloadElement)
downloadElement.click() // 点击下载
document.body.removeChild(downloadElement) // 下载完成移除元素
window.URL.revokeObjectURL(href) // 释放掉blob对象
this.importLoading = false
})
}
this.importLoading = false
} else if (res.code === 41020) {
this.$message.info('上传超时,请重新上传')
this.importLoading = false
} else {
this.$message.error(res.message)
this.importLoading = false
} }
}).catch(err => {
this.$message.success(err.message)
this.importLoading = false
}) })
this.importLoading = false
}
} }
} }
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.app-container-dict { .app-container {
font-size: 18px; font-size: 18px;
padding: 0; padding: 0;
.placeholder{ .placeholder{
...@@ -622,18 +650,12 @@ export default { ...@@ -622,18 +650,12 @@ export default {
background-color: #F4F4F4; background-color: #F4F4F4;
margin-bottom:10px margin-bottom:10px
} }
} .optionsContent{
</style> box-sizing: border-box;
<style lang="scss"> width: 100%;
.app-container-dict {
.el-form {
padding: 0 0 0 10px; padding: 0 0 0 10px;
.el-form-item { display: flex;
margin-top: 0; flex-direction: row;
margin-left: 0;
margin-bottom: 15px;
margin-right: 10px;
}
} }
} }
</style> </style>
src/views/system/user/index.vue
View file @ 3afade40
...@@ -59,9 +59,8 @@ ...@@ -59,9 +59,8 @@
<!-- icon="el-icon-plus"--> <!-- icon="el-icon-plus"-->
<!-- @click="handleAdd"--> <!-- @click="handleAdd"-->
<!-- >新增</el-button>--> <!-- >新增</el-button>-->
<coolbutton style="padding: 8px 7px;" :type="typePrimary" :name="addName" :size="smallSize" :icon="addIcon" :haspermi="addHaspermi" @btn-click="handleAdd" /> <coolbutton :type="typePrimary" :name="addName" :size="smallSize" :icon="addIcon" :haspermi="addHaspermi" @btn-click="handleAdd" />
<el-button <el-button
style="padding: 8px 7px;"
type="warning" type="warning"
icon="el-icon-upload" icon="el-icon-upload"
size="small" size="small"
...@@ -75,7 +74,7 @@ ...@@ -75,7 +74,7 @@
<!-- icon="el-icon-download"--> <!-- icon="el-icon-download"-->
<!-- @click="handleExport"--> <!-- @click="handleExport"-->
<!-- >导出</el-button>--> <!-- >导出</el-button>-->
<coolbutton style="padding: 8px 7px;" :type="typeSuccess" :name="exportName" :size="smallSize" :icon="exportIcon" :haspermi="addHaspermi" @btn-click="handleExport" /> <coolbutton :type="typeSuccess" :name="exportName" :size="smallSize" :icon="exportIcon" :haspermi="addHaspermi" @btn-click="handleExport" />
</el-form-item> </el-form-item>
</el-form> </el-form>
</div> </div>
......
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