irc_web/src/views/dictionary/checkConfig/index.vue

1226 lines
54 KiB
Vue

<template>
<div class="app-container my_menu">
<el-form :inline="true">
<!-- 模块 -->
<el-form-item :label="$t('audit:label:moduleType')">
<el-select v-model="queryParams.ModuleTypeId" clearable>
<el-option v-for="item of dict.type.ModuleType" :key="`ModuleTypeId${item.value}`" :value="item.value"
:label="item.raw.ValueCN" />
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" @click="handleQuery">
{{ $t('common:button:search') }}
</el-button>
<el-button type="primary" icon="el-icon-plus" @click="handleAdd">
{{ $t('common:button:new') }}
</el-button>
</el-form-item>
</el-form>
<div>
<!-- 展开/折叠 -->
<el-button type="info" plain icon="el-icon-sort" size="mini" @click="toggleExpandAll">
{{ $t('audit:button:fold') }}
</el-button>
</div>
<el-table v-if="refreshTable" v-adaptive="{ bottomOffset: 45 }" v-loading="loading" height="100" :data="menuList"
:default-expand-all="isExpandAll" row-key="Id" :tree-props="{ children: 'Children', hasChildren: 'hasChildren' }">
<!-- 模块 -->
<el-table-column v-if="language === 'en'" prop="ModuleTypeValue" :label="$t('audit:label:moduleType')" show-overflow-tooltip align="left" min-width="230px">
</el-table-column>
<el-table-column v-else prop="ModuleTypeValueCN" :label="$t('audit:label:moduleType')" show-overflow-tooltip align="left" min-width="230px">
</el-table-column>
<!-- 操作名称 -->
<el-table-column v-if="language === 'en'" prop="Description" :label="$t('audit:label:desc')" :show-overflow-tooltip="true" min-width="200px">
<template slot-scope="scope">
<span>{{ scope.row.Description }}</span>
</template>
</el-table-column>
<el-table-column v-else prop="DescriptionCN" :label="$t('audit:label:desc')" :show-overflow-tooltip="true" min-width="200px">
<template slot-scope="scope">
<span>{{ scope.row.DescriptionCN }}</span>
</template>
</el-table-column>
<!-- 其他 -->
<el-table-column prop="DescriptionCN" :label="$t('audit:label:descCN')" :show-overflow-tooltip="true" min-width="140px">
<template slot-scope="scope">
<!-- 被禁用 -->
<!-- 禁 -->
<span v-if="!scope.row.IsEnable"
style="cursor:pointer;line-height:20px;text-align:center;font-size: 12px;display: inline-block;width: 20px;height: 20px;border-radius: 50%;background: #DC143C;color: #fff;"
:title="$t('audit:label:disable')">{{ $t('audit:label:disable1') }}</span>
<!-- 需要电签 签 -->
<span v-if="scope.row.IsHaveSign"
style="cursor:pointer;line-height:20px;text-align:center;font-size: 12px;display: inline-block;width: 20px;height: 20px;border-radius: 50%;background: #428bca;color: #fff;"
:title="$t('audit:label:needSign')">{{ $t('audit:label:needSign1') }}</span>
<!-- 需要原因 因 -->
<span v-if="scope.row.IsHaveReason"
style="cursor:pointer;line-height:20px;text-align:center;font-size: 12px;display: inline-block;width: 20px;height: 20px;border-radius: 50%;background: #fab6b6;color: #fff;"
:title="$t('audit:label:needReason')">{{ $t('audit:label:needReason1') }}</span>
<!-- 已经记录 记 -->
<span v-if="scope.row.IsFinish"
style="cursor:pointer;line-height:20px;text-align:center;font-size: 12px;display: inline-block;width: 20px;height: 20px;border-radius: 50%;background:#3CB371;color: #fff;"
:title="$t('audit:label:isFinish')">{{ $t('audit:label:isFinish1') }}</span>
<!-- 核对完 核 -->
<span v-if="scope.row.IsJoinPlan"
style="cursor:pointer;line-height:20px;text-align:center;font-size: 12px;display: inline-block;width: 20px;height: 20px;border-radius: 50%;background: #FFA500;color: #fff;"
:title="$t('audit:label:isJoinPlan')">{{ $t('audit:label:isJoinPlan1') }}</span>
</template>
</el-table-column>
<!-- 标识 -->
<el-table-column prop="Identification" :label="$t('audit:label:identification')" :show-overflow-tooltip="true" min-width="120px" />
<!-- 操作类型 -->
<el-table-column v-if="language === 'en'" prop="OptTypeValue" :label="$t('audit:label:optType')" show-overflow-tooltip min-width="110px" />
<el-table-column v-else prop="OptTypeValueCN" :label="$t('audit:label:optType')" show-overflow-tooltip min-width="110px" />
<!-- 对象类型 -->
<el-table-column v-if="language === 'en'" prop="ObjectTypeValue" :label="$t('audit:label:objectType')" show-overflow-tooltip width="100px" />
<el-table-column v-else prop="ObjectTypeValueCN" :label="$t('audit:label:objectType')" show-overflow-tooltip min-width="100px" />
<!-- 数据类型 -->
<el-table-column v-if="language === 'en'" prop="ChildrenTypeValue" :label="$t('audit:label:dataType')" show-overflow-tooltip min-width="100px" />
<el-table-column v-else prop="ChildrenTypeValueCN" :label="$t('audit:label:dataType')" show-overflow-tooltip min-width="100px" />
<!-- 显示顺序 -->
<el-table-column prop="Sort" :label="$t('audit:label:sort')" min-width="100" show-overflow-tooltip />
<!-- 启用 -->
<el-table-column :label="$t('audit:label:isEnable')" align="center" prop="CreateTime" min-width="90">
<!-- 启用/禁用 -->
<template slot-scope="scope">
<!-- <el-tag v-if="scope.row.IsEnable" size="success">启用</el-tag>
<el-tag v-else size="danger">禁用</el-tag> -->
<el-tag :type="!scope.row.IsEnable ? 'info' : ''">
{{ $fd('IsEnable', scope.row.IsEnable) }}
</el-tag>
</template>
</el-table-column>
<el-table-column :label="$t('common:action:action')" align="center" fixed="right" min-width="200" class-name="small-padding fixed-width">
<template slot-scope="scope">
<!-- 上移 -->
<el-button
v-if="scope.row.ModuleTypeValueCN && scope.row.ObjectTypeValueCN && scope.row.OptTypeValueCN && scope.row.ChildrenTypeValueCN"
type="text" @click="handleUpMove(scope.row)"
>
{{ $t('audit:button:upward') }}
</el-button>
<!-- 修改 -->
<el-button type="text" @click="handleUpdate(scope.row)">
{{ $t('audit:button:modify') }}
</el-button>
<!-- 新增 -->
<el-button
v-if="!(scope.row.ModuleTypeValueCN && scope.row.ObjectTypeValueCN && scope.row.OptTypeValueCN && scope.row.ChildrenTypeValueCN)"
type="text" @click="handleAdd(scope.row)">{{ $t('common:button:new') }}</el-button>
<!-- Children -->
<el-button
v-if="scope.row.ModuleTypeValueCN && scope.row.ObjectTypeValueCN && scope.row.OptTypeValueCN && scope.row.ChildrenTypeValueCN"
type="text" @click="handleChildren(scope.row)"
>
{{ $t('audit:button:children') }}
</el-button>
<!-- 复制到 -->
<el-button
v-if="scope.row.ModuleTypeValueCN && scope.row.ObjectTypeValueCN && scope.row.OptTypeValueCN && scope.row.ChildrenTypeValueCN"
type="text" @click="handleCopy(scope.row)">
{{ $t('audit:button:copyTo') }}
</el-button>
<!-- 删除 -->
<el-button type="text" @click="handleDelete(scope.row)">{{ $t('common:button:delete') }}</el-button>
</template>
</el-table-column>
</el-table>
<!-- 添加或修改菜单对话框 -->
<el-dialog :title="title" top="100px" :close-on-click-modal="false" id="check_config" :visible.sync="open"
:width="form.DataType === 'Table' ? '1280px' : '680px'" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="120px">
<el-row>
<el-col v-show="title !== '复制'" :span="24">
<el-divider content-position="left">基本信息</el-divider>
</el-col>
<el-col :span="24">
<el-form-item :label="form.ConfigType == 'M' ? title !== '复制' ? '选择父节点' : '复制到' : '操作名称'">
<treeselect :disabled="form.ConfigType === 'C'" v-model="form.ParentId" :options="menuOptions"
:normalizer="normalizer" :show-count="true" placeholder="选择上级操作" />
</el-form-item>
</el-col>
<el-col v-show="form.ConfigType == 'M' && title !== '复制'" :span="12">
<el-form-item label="操作名称" prop="Description">
<el-input v-model="form.Description" placeholder="请输入名称" />
</el-form-item>
</el-col>
<el-col v-show="form.ConfigType == 'M' && title !== '复制'" :span="12">
<el-form-item label="操作名称(CN)" prop="Description">
<el-input v-model="form.DescriptionCN" placeholder="请输入操作名称(CN)" />
</el-form-item>
</el-col>
<el-col v-show="form.ConfigType == 'M' && title !== '复制'" :span="12">
<el-form-item label="标识" prop="Identification">
<el-input v-model="form.Identification" placeholder="请输入标识" />
</el-form-item>
</el-col>
<el-col v-show="form.ConfigType === 'C' && title !== '复制'" :span="12">
<el-form-item label="字段key">
<el-input v-model="form.Code" placeholder="请输入字段key" />
</el-form-item>
</el-col>
<el-col v-show="form.ConfigType === 'C' && title !== '复制'" :span="12">
<el-form-item label="字段key英文">
<el-input v-model="form.CodeEn" placeholder="请输入字段key英文" />
</el-form-item>
</el-col>
<el-col v-show="form.ConfigType === 'C' && title !== '复制'" :span="12">
<el-form-item label="字段英文">
<el-input v-model="form.Value" placeholder="请输入字段英文" />
</el-form-item>
</el-col>
<el-col v-show="form.ConfigType === 'C' && title !== '复制'" :span="12">
<el-form-item label="字段中文">
<el-input v-model="form.ValueCN" placeholder="请输入字段中文" />
</el-form-item>
</el-col>
<el-col v-show="title !== '复制'" :span="24">
<el-divider content-position="left">属性</el-divider>
</el-col>
<!--分割线-->
<el-col v-show="form.ConfigType === 'M' && title !== '复制'" :span="12">
<el-form-item label="功能模块" prop="menuType">
<el-select v-model="form.ModuleTypeId" placeholder="模块" clearable size="small" @change="changeModule">
<el-option v-for="item of dict.type.ModuleType" :key="`ModuleType${item.value}`" :value="item.value"
:label="item.raw.ValueCN" />
</el-select>
</el-form-item>
</el-col>
<el-col v-show="form.ConfigType === 'M' && title !== '复制'" :span="12">
<el-form-item label="操作类型" prop="menuType">
<el-select v-model="form.OptTypeId" placeholder="操作类型" clearable size="small" @change="changeDescription">
<el-option v-for="item of dict.type.OptType" :key="`OptTypeId${item.value}`" :value="item.value"
:label="item.raw.ValueCN" />
</el-select>
</el-form-item>
</el-col>
<el-col v-show="form.ConfigType === 'M' && title !== '复制'" :span="12">
<el-form-item label="对象类型" prop="menuType">
<el-select v-model="form.ObjectTypeId" placeholder="对象类型" clearable size="small"
@change="changeDescription">
<template v-for="item of dict.type.ObjectType">
<el-option :key="`ObjectType${item.value}`" v-if="ChildGroup === item.raw.ChildGroup"
:value="item.value" :label="item.raw.ValueCN" />
</template>
</el-select>
</el-form-item>
</el-col>
<el-col v-show="form.ConfigType === 'M' && title !== '复制'" :span="12">
<el-form-item label="数据类型" prop="menuType">
<el-select v-model="form.ChildrenTypeId" placeholder="操作子类" clearable size="small"
@change="changeDescription">
<el-option v-for="item of dict.type.ChildrenType" :key="`ChildrenType${item.value}`" :value="item.value"
:label="item.raw.ValueCN" />
</el-select>
</el-form-item>
</el-col>
<el-col v-show="form.ConfigType == 'M' && title !== '复制'" :span="12">
<el-form-item>
<span slot="label">
是否电签
</span>
<el-switch v-model="form.IsHaveSign" :active-value="true" :inactive-value="false" />
</el-form-item>
</el-col>
<el-col v-show="form.ConfigType == 'M' && title !== '复制'" :span="12">
<el-form-item>
<span slot="label">
是否有原因
</span>
<el-switch v-model="form.IsHaveReason" :active-value="true" :inactive-value="false" />
</el-form-item>
</el-col>
<el-col v-show="form.ConfigType === 'C' && title !== '复制'" :span="24">
<el-form-item>
<span slot="label">
数据来源
</span>
<el-radio-group v-model="form.IsShowParent">
<el-radio :label="0">业务数据</el-radio>
<el-radio :label="1">通用数据</el-radio>
<el-radio :label="2">列表数据</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item>
<span slot="label">
适用的标准
</span>
<el-select v-model="form.ApplyCriterionList" placeholder="" clearable multiple>
<el-option v-for="item in $d.CriterionType" :key="item.id" :label="item.label" :value="item.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col v-show="form.ConfigType === 'C' && title !== '复制'" :span="12">
<el-form-item>
<span slot="label">
依赖父数据
</span>
<el-switch v-model="form.IsShowByTrialConfig" :active-value="true" :inactive-value="false" />
</el-form-item>
</el-col>
<el-col v-show="form.ConfigType === 'C' && title !== '复制' && form.IsShowByTrialConfig" :span="12">
<el-form-item>
<span slot="label">
依赖字段
</span>
<el-input v-model="form.TrialConfigRelyFieldName" placeholder="请输入依赖字段" />
</el-form-item>
</el-col>
<el-col :span="24" style="margin-bottom: 10px;">
<el-row style="background: #f8f8f8;padding: 0 20px;border-radius: 10px;">
<el-col v-show="form.ConfigType === 'C' && title !== '复制'" :span="24">
<el-form-item label="前端展示类型">
<el-radio-group v-model="form.DataType" style="line-height: 30px;padding-top: 10px;"
@change="(v) => { if (v === 'Table') { rowDrop2() } }">
<el-radio :label="''">字符串</el-radio>
<el-radio :label="item.value" v-for="item in $d.AuditDataType" :key="item.id">{{ item.label
}}</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="24">
<el-row v-show="form.DataType === 'Router'" v-if="form.UrlConfig">
<el-col :span="12">
<el-form-item>
<span slot="label">
路由地址
</span>
<el-input v-model="form.UrlConfig.RoutePath" placeholder="路由地址" />
</el-form-item>
</el-col>
<el-col :span="8" style="display: flex;align-items: center;justify-content: flex-end">
<el-form-item>
<span slot="label">
是否有参数
</span>
<el-switch v-model="form.UrlConfig.IsHaveParameters">
</el-switch>
</el-form-item>
</el-col>
<el-col :span="4" v-if="form.UrlConfig.IsHaveParameters"
style="display: flex;align-items: center;justify-content: flex-end;">
<el-button type="primary" size="mini" style="position: relative;top: 5px;" @click="addParameter">
增加参数
</el-button>
</el-col>
</el-row>
<template v-for="(item, index) of form.UrlConfig ? form.UrlConfig.ParameterList : []">
<el-row v-show="form.DataType === 'Router'" v-if="form.UrlConfig && form.UrlConfig.IsHaveParameters"
:key="`Router${index}`">
<el-col :span="10">
<el-form-item>
<span slot="label">
参数名{{ index + 1 }}
</span>
<el-input style="width: 150px;" v-model="form.UrlConfig.ParameterList[index].UrlParameterName"
placeholder="参数名" />
</el-form-item>
</el-col>
<el-col :span="10">
<el-form-item>
<span slot="label">
参数值{{ index + 1 }}
</span>
<el-input style="width: 150px;"
v-model="form.UrlConfig.ParameterList[index].UrlParameterValueName" placeholder="参数值" />
</el-form-item>
</el-col>
<el-col :span="4">
<el-button size="mini" type="text" icon="el-icon-delete"
@click="handleParameterListDelete(index)">删除</el-button>
</el-col>
</el-row>
</template>
</el-col>
<el-button v-show="form.DataType === 'Table'" type="primary" size="mini"
style="position: relative;top: -15px" @click="addCol">
增加列
</el-button>
<el-row v-show="form.DataType === 'Table'" v-if="rowDrop2TableIsShow">
<el-table :data="form.TableConfigList" stripe height="280">
<el-table-column prop="IsList" min-width="120" label="是否是数组" show-overflow-tooltip>
<template slot-scope="scope">
<el-switch v-model="scope.row.IsList">
</el-switch>
</template>
</el-table-column>
<el-table-column prop="ListName" min-width="120" label="数组" show-overflow-tooltip>
<template slot-scope="scope">
<el-input :disabled="!scope.row.IsList" v-model="scope.row.ListName" placeholder="数组" />
</template>
</el-table-column>
<el-table-column prop="IsFixedColumn" min-width="140" label="是否固定列名" show-overflow-tooltip>
<template slot-scope="scope">
<el-switch v-model="scope.row.IsFixedColumn">
</el-switch>
</template>
</el-table-column>
<el-table-column prop="FixedColumnName" min-width="120" label="固定列名" show-overflow-tooltip>
<template slot-scope="scope">
<el-input :disabled="!scope.row.IsFixedColumn" v-model="scope.row.FixedColumnName"
placeholder="固定列名" />
</template>
</el-table-column>
<el-table-column prop="FixedColumnEnName" min-width="120" label="固定列名EN" show-overflow-tooltip>
<template slot-scope="scope">
<el-input :disabled="!scope.row.IsFixedColumn" v-model="scope.row.FixedColumnEnName"
placeholder="固定列名EN" />
</template>
</el-table-column>
<el-table-column prop="ColumnName" min-width="120" label="列字段名" show-overflow-tooltip>
<template slot-scope="scope">
<el-input :disabled="scope.row.IsFixedColumn" v-model="scope.row.ColumnName" placeholder="列字段名" />
</template>
</el-table-column>
<el-table-column prop="ColumnEnName" min-width="120" label="列字段名En" show-overflow-tooltip>
<template slot-scope="scope">
<el-input :disabled="scope.row.IsFixedColumn" v-model="scope.row.ColumnEnName"
placeholder="列字段名En" />
</template>
</el-table-column>
<el-table-column prop="ColumnValue" min-width="120" label="列显示值" show-overflow-tooltip>
<template slot-scope="scope">
<el-input v-model="scope.row.ColumnValue" placeholder="列显示值" />
</template>
</el-table-column>
<el-table-column prop="IsMerge" min-width="80" label="是否合并" show-overflow-tooltip>
<template slot-scope="scope">
<el-switch v-model="scope.row.IsMerge">
</el-switch>
</template>
</el-table-column>
<el-table-column prop="MergeColumnName" min-width="120" label="合并组" show-overflow-tooltip>
<template slot-scope="scope">
<el-input :disabled="!scope.row.IsMerge" v-model="scope.row.MergeColumnName" placeholder="合并组" />
</template>
</el-table-column>
<el-table-column prop="MergeColumnEnName" min-width="120" label="合并组EN" show-overflow-tooltip>
<template slot-scope="scope">
<el-input :disabled="!scope.row.IsMerge" v-model="scope.row.MergeColumnEnName"
placeholder="合并组EN" />
</template>
</el-table-column>
<el-table-column prop="IsPicture" min-width="120" label="是否图片" show-overflow-tooltip>
<template slot-scope="scope">
<el-switch v-model="scope.row.IsPicture">
</el-switch>
</template>
</el-table-column>
<el-table-column prop="IsDynamicTranslate" min-width="140" label="是否动态翻译" show-overflow-tooltip>
<template slot-scope="scope">
<el-switch v-model="scope.row.IsDynamicTranslate">
</el-switch>
</template>
</el-table-column>
<el-table-column prop="IsNeedTransalate" min-width="120" label="是否翻译" show-overflow-tooltip>
<template slot-scope="scope">
<el-switch v-model="scope.row.IsNeedTransalate">
</el-switch>
</template>
</el-table-column>
<el-table-column prop="TranslateDictionaryName" min-width="120" label="翻译字典" show-overflow-tooltip>
<template slot-scope="scope">
<el-input :disabled="!scope.row.IsNeedTransalate" v-model="scope.row.TranslateDictionaryName"
placeholder="合并组" />
</template>
</el-table-column>
<el-table-column prop="MergeColumnName" min-width="80" label="操作" show-overflow-tooltip>
<template slot-scope="scope">
<el-button size="mini" type="text" icon="el-icon-delete"
@click="handleTableConfigListDelete(scope.row, scope.$index)">删除</el-button>
</template>
</el-table-column>
</el-table>
</el-row>
<el-col v-show="form.ConfigType === 'C' && title !== '复制' && form.DataType === ''" :span="12">
<el-form-item>
<span slot="label">
是否修改前展示
</span>
<el-switch v-model="form.IsBeforeModifyView" :active-value="true" :inactive-value="false" />
</el-form-item>
</el-col>
<el-col v-show="form.ConfigType === 'C' && title !== '复制' && form.DataType === 'Array'" :span="12">
<el-form-item>
<span slot="label">
子数据Lable
</span>
<el-input v-model="form.ChildDataLabel" placeholder="请输入子数据Lable" />
</el-form-item>
</el-col>
<el-col v-show="form.ConfigType === 'C' && title !== '复制' && form.DataType === 'Array'" :span="12">
<el-form-item>
<span slot="label">
子数据LableEN
</span>
<el-input v-model="form.ChildDataEnLabel" placeholder="请输入子数据LableEN" />
</el-form-item>
</el-col>
<el-col
v-show="form.ConfigType === 'C' && title !== '复制' && (form.DataType === 'Array' || form.DataType === 'ArrayImage')"
:span="12">
<el-form-item>
<span slot="label">
子数据Value
</span>
<el-input v-model="form.ChildDataValue" placeholder="请输入子数据Value" />
</el-form-item>
</el-col>
</el-row>
</el-col>
<el-col :span="24" style="margin-bottom: 10px;">
<el-row style="background: #f8f8f8;padding: 0 20px;border-radius: 10px;">
<el-col v-show="form.ConfigType === 'C' && title !== '复制'" :span="24">
<el-form-item label="后端翻译类型">
<el-radio-group v-model="form.EnumType">
<el-radio :label="''">字符串</el-radio>
<el-radio label="Date">时间类型</el-radio>
<el-radio label="Dictionary">字典或枚举</el-radio>
<el-radio label="Foreign">系统数据</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col v-show="form.ConfigType === 'C' && title !== '复制' && form.EnumType === 'Dictionary'" :span="12">
<el-form-item label="字典表名">
<!-- <el-input v-model="form.DictionaryCode" placeholder="请输入字典表名" /> -->
<el-autocomplete clearable class="inline-input" v-model="form.DictionaryCode"
:fetch-suggestions="querySearch" placeholder="请输入字典表名"></el-autocomplete>
</el-form-item>
</el-col>
<el-col v-show="form.ConfigType === 'C' && title !== '复制' && form.EnumType === 'Dictionary'" :span="12">
<el-form-item label="翻译字段">
<!-- <el-input v-model="form.DictionaryType" placeholder="请输入翻译字段" /> -->
<el-select v-model="form.DictionaryType" clearable placeholder="请选择翻译字段">
<el-option v-for="item in $d.DictionaryType" :key="item.id" :label="item.label" :value="item.label">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col v-show="form.ConfigType === 'C' && title !== '复制' && form.EnumType === 'Date'" :span="24">
<el-form-item label="时间格式化">
<el-select v-model="form.DateType" placeholder="时间格式化" clearable size="small"
@change="changeDescription">
<el-option value="Date" label="日期" />
<el-option value="DateTime" label="日期时间" />
</el-select>
</el-form-item>
</el-col>
<el-col v-show="form.ConfigType === 'C' && title !== '复制' && form.EnumType === 'Foreign'" :span="12">
<el-form-item label="数据库表">
<el-input v-model="form.ForeignKeyTableName" placeholder="请输入数据库表" />
</el-form-item>
</el-col>
<el-col v-show="form.ConfigType === 'C' && title !== '复制' && form.EnumType === 'Foreign'" :span="12">
<el-form-item label="字段form">
<el-input v-model="form.ForeignKeyValue" placeholder="请输入数据库字段form" />
</el-form-item>
</el-col>
<el-col v-show="form.ConfigType === 'C' && title !== '复制' && form.EnumType === 'Foreign'" :span="12">
<el-form-item label="字段to">
<el-input v-model="form.ForeignKeyText" placeholder="请输入数据库字段to" />
</el-form-item>
</el-col>
<el-col v-show="form.ConfigType === 'C' && title !== '复制' && form.EnumType === 'Foreign'" :span="12">
<el-form-item label="字段toEN">
<el-input v-model="form.ForeignKeyEnText" placeholder="请输入数据库字段toEN" />
</el-form-item>
</el-col>
</el-row>
</el-col>
<el-col v-show="title !== '复制'" :span="24">
<el-form-item label="显示排序" prop="ShowOrder">
<el-input-number v-model="form.Sort" controls-position="right" :min="0" />
</el-form-item>
</el-col>
<el-col v-show="title !== '复制'" :span="24">
<el-form-item>
<span slot="label">
是否启用
</span>
<el-switch v-model="form.IsEnable" :active-value="true" :inactive-value="false" />
</el-form-item>
</el-col>
<el-col v-show="title !== '复制'" :span="24">
<el-form-item>
<span slot="label">
是否默认
</span>
<el-switch v-model="form.IsDefaultChoice" :active-value="true" :inactive-value="false" />
</el-form-item>
</el-col>
<!--分割线-->
<el-col v-show="title !== '复制' && form.ConfigType == 'M'" :span="24">
<el-divider content-position="left">其他信息</el-divider>
</el-col>
<el-col v-show="form.ConfigType == 'M' && title !== '复制'" :span="12">
<el-form-item>
<span slot="label">
是否核对
</span>
<el-switch v-model="form.IsJoinPlan" :active-value="true" :inactive-value="false" />
</el-form-item>
</el-col>
<el-col v-show="form.ConfigType == 'M' && title !== '复制'" :span="12">
<el-form-item>
<span slot="label">
是否记录
</span>
<el-switch v-model="form.IsFinish" :active-value="true" :inactive-value="false" />
</el-form-item>
</el-col>
</el-row>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button v-if="title !== '复制'" type="primary" @click="submitForm">确 定</el-button>
<el-button v-else type="primary" @click="submitCopy">复 制</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</el-dialog>
<el-drawer :title="drawer_cfg.title" :visible.sync="drawer_cfg.drawerChild" direction="rtl" size="80%">
<div style="padding: 0 40px;display: flex;flex-direction: column">
<div style="text-align: right;height: 50px;">
<el-select v-model="copeParams.FromItemId" collapse-tags filterable placeholder="完全拷贝对象" clearable
size="small">
<template v-for="item of list">
<el-option :key="item.Id"
v-if="drawer_cfg.drawerChild && item.ConfigType === 'M' && item.ObjectTypeId === selectRow.ObjectTypeId && item.OptTypeId && item.ChildrenTypeId"
:value="item.Id" :label="item.DescriptionCN" />
</template>
</el-select>
<el-button type="primary" size="mini" style="margin-right: 10px"
@click="handleOverCope(selectRow)">完全拷贝</el-button>
<el-select v-model="copeParams.DataSourceGuids" multiple collapse-tags filterable placeholder="拷贝对象" clearable
size="small">
<template v-for="item of list">
<el-option :key="item.Id"
v-if="drawer_cfg.drawerChild && item.ConfigType === 'M' && item.ObjectTypeId === selectRow.ObjectTypeId && item.OptTypeId && item.ChildrenTypeId"
:value="item.Id" :label="item.DescriptionCN" />
</template>
</el-select>
<el-button type="primary" size="mini" @click="handleCope(selectRow)">拷贝</el-button>
<el-button type="primary" size="mini" @click="handleAdd(selectRow)">新建</el-button>
</div>
<div style="flex: 1">
<el-table v-if="tableShow" v-adaptive="{ bottomOffset: 0 }" v-loading="loading" :data="childrenList"
:row-key="selectRow ? selectRow.Id : '1'" class="singleTable" height="100">
<el-table-column prop="Code" label="字段名" min-width="120px" :show-overflow-tooltip="true" />
<el-table-column prop="CodeEn" label="字段名英文" min-width="120px" :show-overflow-tooltip="true" />
<el-table-column prop="Value" label="字段英文" min-width="120px" :show-overflow-tooltip="true" />
<el-table-column prop="ValueCN" label="字段中文" min-width="120px" :show-overflow-tooltip="true" />
<el-table-column prop="Sort" label="显示顺序" min-width="80" show-overflow-tooltip />
<el-table-column label="启用" align="center" prop="CreateTime" min-width="80">
<template slot-scope="scope">
<el-tag v-if="scope.row.IsEnable" size="success">启用</el-tag>
<el-tag v-else size="danger">禁用</el-tag>
</template>
</el-table-column>
<el-table-column label="是否使用父数据" align="center" prop="CreateTime" min-width="130">
<template slot-scope="scope">
<el-tag v-if="scope.row.IsShowParent === 1" size="success">通用数据</el-tag>
<el-tag v-if="scope.row.IsShowParent === 0" size="danger">业务数据</el-tag>
<el-tag v-if="scope.row.IsShowParent === 2" size="warning">列表数据</el-tag>
</template>
</el-table-column>
<el-table-column label="是否依赖父数据" align="center" prop="CreateTime" min-width="130">
<template slot-scope="scope">
<el-tag v-if="scope.row.IsShowByTrialConfig" size="success">依赖</el-tag>
<el-tag v-else size="danger">不依赖</el-tag>
</template>
</el-table-column>
<el-table-column label="字典依赖" align="center" prop="CreateTime" min-width="130">
<template slot-scope="scope">
<span v-if="scope.row.EnumType && scope.row.DictionaryCode">
{{ scope.row.DictionaryCode }}[{{ scope.row.DictionaryType }}]
</span>
<span v-else>
不依赖
</span>
</template>
</el-table-column>
<el-table-column prop="TrialConfigRelyFieldName" label="依赖字段" min-width="120px"
:show-overflow-tooltip="true" />
<el-table-column label="操作" align="center" min-width="260" class-name="small-padding fixed-width"
fixed="right">
<template slot-scope="scope">
<el-button size="mini" type="text" @click="handleUpMove(scope.row, true, true)">上移</el-button>
<el-button size="mini" type="text" @click="handleUpMove(scope.row, true, false)">下移</el-button>
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleCopyData(scope.row)">复制</el-button>
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)">修改</el-button>
<el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)">删除</el-button>
</template>
</el-table-column>
</el-table>
</div>
</div>
</el-drawer>
</div>
</template>
<script>
import { fullyReplicated, changeFrontAuditSort, copyFrontAuditConfigItem, getFrontAuditConfigList, addOrUpdateFrontAuditConfig, deleteFrontAuditConfig, copyOtherToThisItem, getAuditConfigChildList, getDictionaryCodeList } from '@/api/dictionary/checkConfig'
import Treeselect from '@riophae/vue-treeselect'
import '@riophae/vue-treeselect/dist/vue-treeselect.css'
import Sortable from 'sortablejs'
import BaseModel from "@/components/BaseModel";
import { mapGetters } from 'vuex'
export default {
name: 'CheckConfig',
dicts: ['OptType', 'ObjectType', 'ModuleType', 'ChildrenType'],
components: { Treeselect, BaseModel },
data() {
return {
// 遮罩层
loading: true,
// 菜单表格树数据
menuList: [],
list: [],
// 菜单树选项
menuOptions: [],
// 弹出层标题
title: '',
// 是否显示弹出层
open: false,
// 菜单状态数据字典
visibleOptions: [],
// 查询参数
queryParams: {
ModuleTypeId: null,
ConfigType: 'M'
},
copeParams: {
DataSourceGuids: [],
AddItemGuid: null,
FromItemId: null,
ToItemId: null
},
// 是否展开,默认全部折叠
isExpandAll: false,
// 重新渲染表格状态
refreshTable: true,
childrenList: [],
// 表单参数
form: {
},
selectRow: null,
model_cfg: { visible: false, showClose: true, width: '680px', title: '', appendToBody: true },
drawer_cfg: { drawerChild: false, parentId: '', title: '' },
// 表单校验
rules: {
},
ChildGroup: null,
tableShow: false,
rowDrop2TableIsShow: true,
DictionaryCodeList: []
}
},
created() {
this.getList();
this.getDictionaryCodeList();
},
computed: {
...mapGetters(['language'])
},
methods: {
querySearch(queryString, cb) {
var DictionaryCodeList = this.DictionaryCodeList;
var results = queryString ? DictionaryCodeList.filter(this.createFilter(queryString)) : DictionaryCodeList;
// 调用 callback 返回建议列表的数据
cb(results);
},
createFilter(queryString) {
return (DictionaryCodeList) => {
return (DictionaryCodeList.value.toLowerCase().indexOf(queryString.toLowerCase()) === 0);
};
},
// 获取字典表名
async getDictionaryCodeList() {
try {
let res = await getDictionaryCodeList();
if (res.IsSuccess) {
this.DictionaryCodeList = res.Result.map(item => {
return {
value: item
}
});
}
} catch (err) {
console.log(err);
}
},
addParameter() {
this.form.UrlConfig.ParameterList.push({
UrlParameterName: null,
UrlParameterValueName: null
})
},
handleParameterListDelete(index) {
this.$confirm('确定删除该项路由参数吗?保存配置后生效。').then(() => {
this.form.UrlConfig.ParameterList.splice(index, 1)
})
},
handleTableConfigListDelete(row, index) {
this.$confirm('确定删除该项表格配置吗?保存配置后生效。').then(() => {
this.form.TableConfigList.splice(index, 1)
})
},
addCol() {
this.form.TableConfigList.push({
IsList: false,
ListName: null,
IsFixedColumn: false,
FixedColumnName: null,
FixedColumnEnName: null,
ColumnName: null,
ColumnEnName: null,
ColumnValue: null,
IsMerge: false,
MergeColumnName: null,
MergeColumnEnName: null,
IsPicture: false,
IsDynamicTranslate: false,
IsNeedTransalate: false,
TranslateDictionaryName: null
})
},
submitCopy() {
copyFrontAuditConfigItem({
ParentId: this.form.ParentId,
ChildId: this.form.Id
}).then(res => {
this.$message.success('复制成功')
this.open = false
this.getList()
})
},
handleCopy(row) {
this.reset()
this.getTreeselect()
this.form = Object.assign({}, row)
this.open = true
this.title = '复制'
},
findNearestNumber(arr, target) {
return arr.reduce((pre, curr) => {
console.log(pre, curr)
return pre - target > curr - target ? curr : pre
})
},
handleUpMove(row, isChildren = false, isLast = true) {
var index
var target
var list = this.list.filter((v, i) => {
return row.ModuleTypeId === v.ModuleTypeId && v.ModuleTypeValueCN && v.ObjectTypeValueCN && v.OptTypeValueCN && v.ChildrenTypeValueCN
})
if (isChildren) {
list = this.childrenList
}
list.forEach((v, i) => {
if (row.Id === v.Id) {
index = i
}
})
console.log(index)
if (isLast) {
if (index === 0) {
this.$alert('该行排序已是最高')
return
} else {
target = list[index - 1]
}
} else {
if (index === this.list.length) {
this.$alert('该行排序已是最底')
return
} else {
target = list[index + 1]
}
}
console.log(list)
var params = [
{ Id: target.Id, Sort: row.Sort },
{ Id: row.Id, Sort: target.Sort }
];
// var params = list.map((v, i) => {
// // console.log(index, i)
// // if (i === index) {
// // return {
// // Id: v.Id,
// // Sort: index - 1
// // }
// // }
// // if (index - 1 === i) {
// // return {
// // Id: v.Id,
// // Sort: index
// // }
// // }
// return {
// Id: v.Id,
// Sort: i
// }
// })
this.loading = true
changeFrontAuditSort(params).then(res => {
this.loading = false
this.getList()
}).catch(() => { this.loading = false })
},
rowDrop2() {
this.$nextTick(() => {
const tbody = document.querySelector('.el-dialog__body .el-table__body-wrapper tbody')
const _this = this
Sortable.create(tbody, {
animation: 500,
forceFallback: true,
delay: 500,
onEnd({ newIndex, oldIndex }) {
var list = Object.assign([], _this.form.TableConfigList)
const currRow = list.splice(oldIndex, 1)[0]
list.splice(newIndex, 0, currRow)
var params = list.map((v, i) => {
return v
})
_this.rowDrop2TableIsShow = false
_this.$nextTick(() => {
_this.$set(_this.form, 'TableConfigList', params)
_this.rowDrop2TableIsShow = true
_this.rowDrop2()
})
_this.loading = true
}
})
})
},
rowDrop() {
const tbody = document.querySelector('.singleTable .el-table__body-wrapper tbody')
const _this = this
Sortable.create(tbody, {
animation: 500,
forceFallback: true,
delay: 500,
onEnd({ newIndex, oldIndex }) {
var list = Object.assign([], _this.childrenList)
const currRow = list.splice(oldIndex, 1)[0]
list.splice(newIndex, 0, currRow)
var params = list.map((v, i) => {
return {
Id: v.Id,
Sort: i
}
})
_this.loading = true
changeFrontAuditSort(params).then(res => {
_this.loading = false
_this.getList()
}).catch(() => { _this.loading = false })
}
})
},
handleOverCope(row) {
if (!this.copeParams.FromItemId) {
this.$alert('请选择完全拷贝对象')
return
}
this.copeParams.ToItemId = row.Id
this.loading = true
fullyReplicated(this.copeParams).then(res => {
this.loading = false
this.$message.success('完全Copy成功')
this.copeParams.FromItemId = null
if (this.selectRow) {
this.handleChildren(this.selectRow, true)
}
}).catch(() => { this.loading = false })
},
handleCope(row) {
if (this.copeParams.DataSourceGuids.length === 0) {
this.$alert('请选择拷贝对象')
return
}
this.copeParams.AddItemGuid = row.Id
this.loading = true
copyOtherToThisItem(this.copeParams).then(res => {
this.loading = false
this.$message.success('Copy成功')
this.copeParams.DataSourceGuids = []
if (this.selectRow) {
this.handleChildren(this.selectRow, true)
}
}).catch(() => { this.loading = false })
},
changeModule(v1) {
this.ChildGroup = this.dict.type.ModuleType.find(v => {
return v.value == v1
}).raw.ChildGroup
this.form.ObjectTypeId = null
},
handleChildren(row, v, v1) {
this.selectRow = row
this.tableShow = false
getAuditConfigChildList(row.Id).then(res => {
this.$set(this, 'childrenList', res.Result)
this.tableShow = true
if (!v) {
this.drawer_cfg = { drawerChild: true, parentId: row.Id, title: row.Description, parent: row }
}
this.$nextTick(() => {
this.rowDrop()
})
})
},
toggleExpandAll() {
this.refreshTable = false
this.isExpandAll = !this.isExpandAll
this.$nextTick(() => {
this.refreshTable = true
})
},
normalizer(node) {
if (node.Children && !node.Children.length) {
delete node.Children
}
return {
id: node.Id,
label: node.Description,
children: node.Children
}
},
toTree(arr, ParentId) {
function loop(ParentId) {
const res = []
for (let i = 0; i < arr.length; i++) {
const item = arr[i]
item.hasChildren = false
if (item.ParentId !== ParentId) {
continue
}
item.Children = loop(item.Id)
res.push(item)
}
return res
}
return loop(ParentId)
},
// 选择图标
selected(name) {
this.form.MenuIcon = name
},
/** 查询菜单列表 */
getList() {
this.loading = true
getFrontAuditConfigList(this.queryParams).then(res => {
this.list = res.Result
// var old = res.Result.filter((v) => {return v.ConfigType === 'M'})
this.menuList = this.toTree(this.list, '00000000-0000-0000-0000-000000000000')
if (this.selectRow) {
this.handleChildren(this.selectRow, true)
}
const menu = { Id: '00000000-0000-0000-0000-000000000000', Description: '根节点', Children: [] }
menu.Children = this.menuList
this.menuOptions = Object.assign([], [menu])
this.loading = false
}).catch(function () { })
},
/** 查询菜单下拉树结构 */
getTreeselect() {
this.loading = true
getFrontAuditConfigList({}).then(res => {
const menu = { Id: '00000000-0000-0000-0000-000000000000', Description: '根节点', Children: [] }
menu.Children = this.toTree(res.Result, '00000000-0000-0000-0000-000000000000')
this.menuOptions = Object.assign([], [menu])
this.loading = false
}).catch(function () { })
},
// 菜单显示状态字典翻译
visibleFormat(row, column) {
if (row.MenuType === 'F') {
return ''
}
return this.selectDictLabel(this.visibleOptions, row.visible)
},
// 取消按钮
cancel() {
this.open = false
this.reset()
},
// 表单重置
reset() {
this.form = {
Id: null,
ParentId: '00000000-0000-0000-0000-000000000000',
ConfigType: 'M',
Description: null,
DescriptionCN: null,
InterfaceName: null,
IsEnable: true,
IsDefaultChoice: true,
ModuleTypeId: null,
OptTypeId: null,
ChildrenTypeId: null,
ObjectTypeId: null,
IsShowParent: 0,
Sort: 0,
Code: null,
CodeEn: null,
Value: null,
ValueCN: null,
EnumType: '',
IsShowByTrialConfig: false,
ApplyCriterionList: [],
TrialConfigRelyFieldName: null,
Identification: null,
IsForwardPosition: false,
IsHaveSign: false,
IsHaveReason: false,
IsJoinPlan: false,
IsFinish: false,
IsSpecialType: false,
DataType: '',
ChildDataLabel: null,
IsBeforeModifyView: true,
ChildDataEnLabel: null,
ChildDataValue: null,
DateType: null,
DictionaryCode: null,
DictionaryType: null,
ForeignKeyTableName: null,
ForeignKeyValue: null,
ForeignKeyText: null,
ForeignKeyEnText: null,
TableConfigList: [],
UrlConfig: {
RoutePath: null,
IsHaveParameters: false,
ParameterList: []
},
IsTableFiled: null,
TableFiledName: null
}
this.resetForm('form')
},
findName(id, dict, type) {
if (id) {
return this.dict.type[dict].find(v => {
return v.value === id
}).raw[type]
}
return ''
},
changeDescription() {
},
/** 搜索按钮操作 */
handleQuery() {
this.getList()
},
/** 新增按钮操作 */
handleAdd(row) {
this.reset()
this.getTreeselect()
if (row) {
try {
var max = Math.max.apply(Math, row.Children.map(i => { return i.Sort }))
} catch (e) {
var max = Math.max.apply(Math, this.childrenList.map(i => { return i.Sort }))
}
this.form.Sort = max + 1
this.form.ParentId = row.Id
this.form.ModuleTypeId = row.ModuleTypeId
this.form.OptTypeId = row.OptTypeId
this.form.ChildrenTypeId = row.ChildrenTypeId
if (row.ModuleTypeId && row.OptTypeId && row.ChildrenTypeId && row.ObjectTypeId) {
this.form.ConfigType = 'C'
}
}
if (this.form.ModuleTypeId && this.form.ConfigType === 'M') {
// this.form.Identification = row.OptType + row.ModuleType + row.ChildrenType + row.ObjectType
this.ChildGroup = this.dict.type.ModuleType.find(v => {
return v.value == this.form.ModuleTypeId
}) ? this.dict.type.ModuleType.find(v => {
return v.value == this.form.ModuleTypeId
}).raw.ChildGroup : ''
}
console.log(this.form.ParentId)
this.open = true
this.title = '添加'
},
/** 修改按钮操作 */
handleUpdate(row) {
this.reset()
this.getTreeselect()
this.form = Object.assign({}, row)
if (this.form.ModuleTypeId) {
if (this.form.ConfigType === 'M') {
if (!this.form.Identification) {
// this.form.Identification = `${row.OptTypeValue}|${row.ObjectTypeValue}|${row.ChildrenTypeValue}|${row.ModuleTypeValue}`
}
}
this.ChildGroup = this.dict.type.ModuleType.find(v => {
return v.value == this.form.ModuleTypeId
}) ? this.dict.type.ModuleType.find(v => {
return v.value == this.form.ModuleTypeId
}).raw.ChildGroup : ''
}
this.open = true
this.title = '修改'
this.rowDrop2()
},
handleCopyData(row) {
this.$confirm('确定复制该条记录到当前稽查下吗?').then(() => {
let params = { ...row }
delete params.Id
addOrUpdateFrontAuditConfig(params).then(() => {
this.$message.success(this.$t('common:message:savedSuccessfully'))
this.getList()
})
})
},
/** 提交按钮 */
submitForm: function () {
this.$refs['form'].validate(valid => {
if (valid) {
addOrUpdateFrontAuditConfig(this.form).then(response => {
this.$message.success(this.$t('common:message:savedSuccessfully'))
this.open = false
this.getList()
})
}
})
},
/** 删除按钮操作 */
handleDelete(row) {
this.$confirm('是否确认删除名称为"' + row.Description + '"的数据项?', '警告', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.loading = true
return deleteFrontAuditConfig(row.Id)
}).then(() => {
this.loading = false
this.getList()
this.$message.success('删除成功')
}).catch(() => { this.loading = false })
}
}
}
</script>
<style lang="scss">
.vue-treeselect div {
line-height: 40px;
}
#check_config .el-dialog__body {
padding: 0 20px;
}
</style>