基础资料模块优化
parent
36d9d228e6
commit
c565f0acbf
|
@ -20,5 +20,9 @@ export default {
|
|||
// 获取扩展字段配置详情
|
||||
extendFieldDetail(data) {
|
||||
return request('detail', data, 'get')
|
||||
},
|
||||
// 获取扩展字段配置列表(根据分类)
|
||||
extendFieldTypeList(data) {
|
||||
return request('typeList', data, 'get')
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1,5 +1,6 @@
|
|||
<template>
|
||||
<div>
|
||||
<a-spin :spinning="localLoading">
|
||||
<div class="s-table-tool">
|
||||
<div class="s-table-tool-left">{{ treeTitle }}</div>
|
||||
<div class="layout-items-center s-table-tool-right">
|
||||
|
@ -19,13 +20,18 @@
|
|||
</a-popconfirm>
|
||||
</a-tooltip>
|
||||
<!-- 刷新 -->
|
||||
<a-tooltip :title="item.title" class="s-tool-item" v-if="item.name === 'refresh' && props.toolConfig.refresh">
|
||||
<a-tooltip
|
||||
:title="item.title"
|
||||
class="s-tool-item"
|
||||
v-if="item.name === 'refresh' && props.toolConfig.refresh"
|
||||
>
|
||||
<component class="icons" :is="item.icon" @click="loadTreeData()"></component>
|
||||
</a-tooltip>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<a-directory-tree
|
||||
:loading="localLoading"
|
||||
show-line
|
||||
v-model:expandedKeys="expandedKeys"
|
||||
v-model:selectedKeys="selectedKeys"
|
||||
|
@ -38,6 +44,7 @@
|
|||
:tree-data="treeData"
|
||||
@select="handleTreeClick"
|
||||
></a-directory-tree>
|
||||
</a-spin>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
@ -84,7 +91,7 @@
|
|||
}
|
||||
})
|
||||
|
||||
const emits = defineEmits('selectTree', 'delTree')
|
||||
const emit = defineEmits(['selectTree', 'delTree'])
|
||||
|
||||
const tool = [
|
||||
{
|
||||
|
@ -112,12 +119,20 @@
|
|||
// 树结构
|
||||
const expandedKeys = ref()
|
||||
const selectedKeys = ref([])
|
||||
const treeData = ref([])
|
||||
const localLoading = ref(false)
|
||||
const treeData = ref([
|
||||
{
|
||||
id: 0,
|
||||
parentId: '-1',
|
||||
name: '顶级',
|
||||
children: ''
|
||||
}
|
||||
])
|
||||
let treeRow = {}
|
||||
|
||||
const handleTreeClick = (selectedKeys, event) => {
|
||||
treeRow = event.node
|
||||
emits('selectTree', treeRow)
|
||||
emit('selectTree', treeRow)
|
||||
}
|
||||
|
||||
const handleAddTree = () => {
|
||||
|
@ -141,11 +156,13 @@
|
|||
|
||||
const loadTreeData = async () => {
|
||||
try {
|
||||
localLoading.value = true
|
||||
const treeRes = await props.apiModel.getTree()
|
||||
console.log(treeRes, 'treeRes')
|
||||
if (Array.isArray(treeRes)) {
|
||||
treeData.value = treeRes
|
||||
treeData.value[0].children = treeRes
|
||||
} else {
|
||||
treeData.value = []
|
||||
treeData.value[0].children = []
|
||||
}
|
||||
|
||||
if (selectedKeys.value.length > 0) {
|
||||
|
@ -157,7 +174,12 @@
|
|||
if (treeRow.id) {
|
||||
treeRow = []
|
||||
}
|
||||
|
||||
setTimeout(() => {
|
||||
localLoading.value = false
|
||||
}, 800)
|
||||
} catch (e) {
|
||||
localLoading.value = false
|
||||
message.error('获取树结构数据失败:' + e)
|
||||
console.error('获取树结构数据失败:' + e)
|
||||
}
|
||||
|
|
|
@ -62,7 +62,8 @@
|
|||
detailDataProps.value = props.detailData
|
||||
},
|
||||
{
|
||||
immediate: true
|
||||
immediate: true,
|
||||
deep: true
|
||||
}
|
||||
)
|
||||
</script>
|
||||
|
|
Binary file not shown.
After Width: | Height: | Size: 450 KiB |
|
@ -13,6 +13,7 @@ export default function useFormHandler(formItems, api) {
|
|||
const state = reactive({
|
||||
PAGE_TYPE: ''
|
||||
})
|
||||
let detailData = reactive({})
|
||||
|
||||
// 初始化表单数据对象
|
||||
let formData = reactive({})
|
||||
|
@ -84,8 +85,8 @@ export default function useFormHandler(formItems, api) {
|
|||
* 处理返回操作,返回上一级页面并关闭当前标签页。
|
||||
*/
|
||||
const handleBack = () => {
|
||||
useTabs.close(route)
|
||||
router.go(-1) // 优化为通用的返回上一页操作
|
||||
useTabs.close()
|
||||
}
|
||||
|
||||
/**
|
||||
|
@ -98,6 +99,7 @@ export default function useFormHandler(formItems, api) {
|
|||
if (pageType && pageType !== 'ADD') {
|
||||
try {
|
||||
const res = await api.getDetail({ id: route.query.id })
|
||||
|
||||
// 根据返回的详情数据初始化表单数据
|
||||
for (let key in formData) {
|
||||
if (res[key] !== undefined) {
|
||||
|
@ -117,6 +119,7 @@ export default function useFormHandler(formItems, api) {
|
|||
formData,
|
||||
submitLoading,
|
||||
formRefs,
|
||||
detailData,
|
||||
onSubmit,
|
||||
handleBack,
|
||||
fetchData
|
||||
|
|
|
@ -52,7 +52,7 @@
|
|||
<right-outlined />
|
||||
</div>
|
||||
</template>
|
||||
<a-tab-pane v-for="tag in tagList" :key="tag.fullPath" :tab="tag.meta.title" :closable="!tag.meta.affix">
|
||||
<a-tab-pane v-for="tag in tagList" :key="tag.path" :tab="tag.meta.title" :closable="!tag.meta.affix">
|
||||
</a-tab-pane>
|
||||
</a-tabs>
|
||||
</div>
|
||||
|
@ -94,7 +94,7 @@
|
|||
})
|
||||
watch(route, (to) => {
|
||||
addViewTags(to)
|
||||
activeKey.value = to.fullPath
|
||||
activeKey.value = to.path
|
||||
})
|
||||
watch(layoutTagsOpen, () => {
|
||||
// closeOtherCacheTabs()
|
||||
|
@ -107,10 +107,10 @@
|
|||
})
|
||||
// 增加tag
|
||||
const addViewTags = (to) => {
|
||||
activeKey.value = to.fullPath
|
||||
if (to.name && !to.meta.fullpage) {
|
||||
activeKey.value = to.path
|
||||
if (to.name) {
|
||||
vStore.pushViewTags(to)
|
||||
kStore.pushKeepLive(to.name)
|
||||
// kStore.pushKeepLive(to.name)
|
||||
}
|
||||
if (tagList.value.length - 1 > maxTabs.value) {
|
||||
const firstTag = tagList.value[1]
|
||||
|
@ -158,9 +158,9 @@
|
|||
const nowTag = getCurrentTag()
|
||||
// 判断是否当前路由,否的话跳转
|
||||
// eslint-disable-next-line eqeqeq
|
||||
if (route.fullPath !== nowTag.fullPath) {
|
||||
if (route.path !== nowTag.path) {
|
||||
router.push({
|
||||
path: nowTag.fullPath,
|
||||
path: nowTag.path,
|
||||
query: nowTag.query
|
||||
})
|
||||
}
|
||||
|
@ -189,16 +189,16 @@
|
|||
const nowTag = getCurrentTag()
|
||||
// 判断是否当前路由,否的话跳转
|
||||
// eslint-disable-next-line eqeqeq
|
||||
if (route.fullPath !== nowTag.fullPath) {
|
||||
if (route.path !== nowTag.path) {
|
||||
router.push({
|
||||
path: nowTag.fullPath,
|
||||
path: nowTag.path,
|
||||
query: nowTag.query
|
||||
})
|
||||
}
|
||||
const tags = [...tagList.value]
|
||||
tags.forEach((tag) => {
|
||||
// eslint-disable-next-line eqeqeq
|
||||
if ((tag.meta && tag.meta.affix) || nowTag.fullPath === tag.fullPath) {
|
||||
if ((tag.meta && tag.meta.affix) || nowTag.path === tag.path) {
|
||||
return true
|
||||
} else {
|
||||
closeSelectedTag(tag, false)
|
||||
|
@ -219,9 +219,9 @@
|
|||
const nowTag = getCurrentTag()
|
||||
// 判断是否当前路由,否的话跳转
|
||||
// eslint-disable-next-line eqeqeq
|
||||
if (route.fullPath !== nowTag.fullPath) {
|
||||
if (route.path !== nowTag.path) {
|
||||
router.push({
|
||||
path: nowTag.fullPath,
|
||||
path: nowTag.path,
|
||||
query: nowTag.query
|
||||
})
|
||||
}
|
||||
|
@ -265,7 +265,7 @@
|
|||
|
||||
const onTabRemove = (tabKey, action) => {
|
||||
if (action === 'remove') {
|
||||
const tag = tagList.value.find((tag) => tag.fullPath === tabKey)
|
||||
const tag = tagList.value.find((tag) => tag.path === tabKey)
|
||||
closeSelectedTag(tag)
|
||||
}
|
||||
}
|
||||
|
@ -319,9 +319,7 @@
|
|||
background: none;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
transition:
|
||||
background-color 0.3s,
|
||||
color 0.3s;
|
||||
transition: background-color 0.3s, color 0.3s;
|
||||
padding: 0 16px;
|
||||
border-radius: 0;
|
||||
border: none;
|
||||
|
@ -442,9 +440,7 @@
|
|||
position: relative;
|
||||
z-index: 1;
|
||||
border-radius: 10px 10px 0 0 !important;
|
||||
box-shadow:
|
||||
12px 15px 0 0 var(--primary-1),
|
||||
-12px 15px 0 0 var(--primary-1);
|
||||
box-shadow: 12px 15px 0 0 var(--primary-1), -12px 15px 0 0 var(--primary-1);
|
||||
}
|
||||
.snowy-radius .ant-tabs-tab-active::before {
|
||||
content: '';
|
||||
|
|
|
@ -70,6 +70,9 @@
|
|||
</template>
|
||||
</a-table>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="3" tab="操作信息" v-if="route.query.type !== 'ADD'">
|
||||
<OperationalInformation :detailData="detailData" :colSpan="12"></OperationalInformation>
|
||||
</a-tab-pane>
|
||||
</a-tabs>
|
||||
</a-card>
|
||||
</template>
|
||||
|
@ -83,8 +86,8 @@
|
|||
import useFormHandler from '@/hook/useFormHandler'
|
||||
import tool from '@/utils/tool'
|
||||
import { useRoute } from 'vue-router'
|
||||
const route = useRoute()
|
||||
import cityOptions from '@/utils/cityOptions'
|
||||
const route = useRoute()
|
||||
|
||||
const formRules = {
|
||||
name: [required('请输入名称')],
|
||||
|
@ -92,6 +95,7 @@
|
|||
appid: [required('请输入AppID')],
|
||||
secret: [required('请输入AppSecret')]
|
||||
}
|
||||
let detailData = reactive({})
|
||||
|
||||
// 级联选择
|
||||
const onCascaderChange = (value) => {
|
||||
|
@ -321,9 +325,12 @@
|
|||
}
|
||||
|
||||
onMounted(async () => {
|
||||
console.log(1)
|
||||
formRefs.value = [formRef1.value, formRef2.value]
|
||||
fetchData(route.query.type).then((res) => {
|
||||
if (res) {
|
||||
detailData = res
|
||||
|
||||
formData.provinceName = [res.province, res.city, res.county]
|
||||
|
||||
customerApi
|
||||
|
@ -350,7 +357,6 @@
|
|||
})
|
||||
|
||||
// 客户分类
|
||||
|
||||
customerCategoryApi
|
||||
.customerCategoryTree({
|
||||
enabledState: 'ENABLE'
|
||||
|
|
|
@ -0,0 +1,95 @@
|
|||
import tool from '@/utils/tool'
|
||||
import { required } from '@/utils/formRules'
|
||||
|
||||
export const officialAccountFormItems = [
|
||||
{
|
||||
label: '类型:',
|
||||
name: 'type',
|
||||
type: 'a-select',
|
||||
span: 8,
|
||||
attrs: {
|
||||
placeholder: '请选择类型',
|
||||
options: tool.dictList('OFFICIAL_ACCOUNT_TYPE')
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '名称:',
|
||||
name: 'name',
|
||||
type: 'a-input',
|
||||
span: 8,
|
||||
rules: [required('请输入名称')],
|
||||
attrs: {
|
||||
placeholder: '请输入名称',
|
||||
allowClear: true
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '可用状态:',
|
||||
name: 'enabledState',
|
||||
type: 'a-select',
|
||||
span: 8,
|
||||
attrs: {
|
||||
placeholder: '请选择可用状态',
|
||||
options: tool.dictList('COMMON_STATUS')
|
||||
},
|
||||
defaultValue: 'ENABLE'
|
||||
},
|
||||
{
|
||||
label: '备注:',
|
||||
name: 'remarks',
|
||||
type: 'a-textarea',
|
||||
span: 24,
|
||||
attrs: {
|
||||
placeholder: '请输入备注',
|
||||
allowClear: true
|
||||
}
|
||||
}
|
||||
]
|
||||
|
||||
export const basicInfoFormItems = [
|
||||
{
|
||||
label: 'AppID:',
|
||||
name: 'appid',
|
||||
type: 'a-input',
|
||||
attrs: {
|
||||
placeholder: '请输入AppID',
|
||||
allowClear: true
|
||||
}
|
||||
},
|
||||
{
|
||||
label: 'AppSecret:',
|
||||
name: 'secret',
|
||||
type: 'a-input',
|
||||
attrs: {
|
||||
placeholder: '请输入AppSecret',
|
||||
allowClear: true
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '字符串编码格式:',
|
||||
name: 'encodingFormat',
|
||||
type: 'a-input',
|
||||
attrs: {
|
||||
placeholder: '请输入字符串编码格式',
|
||||
allowClear: true
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '校验码:',
|
||||
name: 'token',
|
||||
type: 'a-input',
|
||||
attrs: {
|
||||
placeholder: '请输入校验码',
|
||||
allowClear: true
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '签名方式:',
|
||||
name: 'aesKey',
|
||||
type: 'a-input',
|
||||
attrs: {
|
||||
placeholder: '请输入签名方式',
|
||||
allowClear: true
|
||||
}
|
||||
}
|
||||
]
|
|
@ -129,7 +129,6 @@
|
|||
<a-popconfirm title="确定要删除吗?" @confirm="deleteRecord(record)">
|
||||
<a-button type="link" danger size="small" v-if="hasPerm('customerDelete')">
|
||||
<DeleteOutlined />
|
||||
<!-- 删除-->
|
||||
</a-button>
|
||||
</a-popconfirm>
|
||||
</a-space>
|
||||
|
@ -142,7 +141,7 @@
|
|||
</a-card>
|
||||
</template>
|
||||
|
||||
<script setup name="client">
|
||||
<script setup name="basicDataClient">
|
||||
import customerApi from '@/api/base/customer/customerApi'
|
||||
import customerCategoryApi from '@/api/base/customer/customerCategoryApi'
|
||||
import { useTableManagement } from '@/hook/useTableManagement'
|
||||
|
|
|
@ -106,6 +106,17 @@
|
|||
</a-form-item>
|
||||
</a-form>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="5" tab="扩展字段" force-render>
|
||||
<a-form layout="vertical">
|
||||
<a-row :gutter="16">
|
||||
<a-col :span="item.span || 6" v-for="(item, index) in extendData" :key="index">
|
||||
<a-form-item :label="item.label" :name="item.name" :rules="item.rules">
|
||||
<component style="width: 100%" :is="item.type" v-model:value="item.defaultValue" v-bind="item.attrs" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</a-tab-pane>
|
||||
</a-tabs>
|
||||
</a-card>
|
||||
</template>
|
||||
|
@ -113,6 +124,7 @@
|
|||
<script setup name="materielDetail">
|
||||
import unitGroupsApi from '@/api/base/unit/unitGroupsApi'
|
||||
import unitApi from '@/api/base/unit/unitApi'
|
||||
import extendFieldApi from '@/api/base/extendfield/extendFieldApi'
|
||||
|
||||
import { required } from '@/utils/formRules'
|
||||
import useFormHandler from '@/hook/useFormHandler'
|
||||
|
@ -133,6 +145,7 @@
|
|||
let productFormData = ref({
|
||||
promoteEnabledState: 'ENABLE'
|
||||
})
|
||||
let extendData = ref([]) // 扩展字段
|
||||
|
||||
onMounted(async () => {
|
||||
formRefs.value = [formRef1.value, formRef2.value, formRef3.value]
|
||||
|
@ -209,6 +222,33 @@
|
|||
item.attrs.options = brandList
|
||||
}
|
||||
})
|
||||
|
||||
// 字段扩展
|
||||
extendFieldApi
|
||||
.extendFieldTypeList({
|
||||
enabledState: 'ENABLE',
|
||||
model: 'MATERIAL'
|
||||
})
|
||||
.then((res) => {
|
||||
if (res) {
|
||||
res.forEach((item) => {
|
||||
extendData.value.push({
|
||||
label: item.fieldName,
|
||||
name: item.fieldName,
|
||||
type: 'ASelect',
|
||||
span: 6,
|
||||
attrs: {
|
||||
placeholder: '请输入内容',
|
||||
options: [],
|
||||
fieldNames: {
|
||||
label: 'name',
|
||||
value: 'id'
|
||||
}
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
let activeKey = ref('1')
|
||||
|
@ -651,7 +691,7 @@
|
|||
}
|
||||
]
|
||||
|
||||
const { state, formData, submitLoading, formRefs, onSubmit, handleBack, fetchData } = useFormHandler(
|
||||
const { formData, formRefs, onSubmit, handleBack, fetchData } = useFormHandler(
|
||||
[...materialFormItems, ...baseFormItems, ...unitFormItems],
|
||||
{
|
||||
submitForm: materialApi.materialSubmitForm,
|
||||
|
|
|
@ -24,13 +24,17 @@
|
|||
ref="formRef2"
|
||||
/>
|
||||
</a-card>
|
||||
|
||||
<a-card :bordered="false" title="操作信息" class="mt-4" v-if="route.query.type !== 'ADD'">
|
||||
<OperationalInformation :detailData="detailData" :colSpan="12"></OperationalInformation>
|
||||
</a-card>
|
||||
</template>
|
||||
|
||||
<script setup name="publicAccountDetail">
|
||||
import { required } from '@/utils/formRules'
|
||||
import officialAccountApi from '@/api/base/wx/officialAccountApi'
|
||||
import useFormHandler from '@/hook/useFormHandler'
|
||||
import tool from '@/utils/tool'
|
||||
import { basicInfoFormItems, officialAccountFormItems } from '@/views/basicData/client/formItems'
|
||||
import { useRoute } from 'vue-router'
|
||||
const route = useRoute()
|
||||
|
||||
|
@ -41,103 +45,11 @@
|
|||
secret: [required('请输入AppSecret')]
|
||||
}
|
||||
|
||||
const officialAccountFormItems = [
|
||||
{
|
||||
label: '类型:',
|
||||
name: 'type',
|
||||
type: 'a-select',
|
||||
span: 8,
|
||||
attrs: {
|
||||
placeholder: '请选择类型',
|
||||
options: tool.dictList('OFFICIAL_ACCOUNT_TYPE')
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '名称:',
|
||||
name: 'name',
|
||||
type: 'a-input',
|
||||
span: 8,
|
||||
rules: [required('请输入名称')],
|
||||
attrs: {
|
||||
placeholder: '请输入名称',
|
||||
allowClear: true
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '可用状态:',
|
||||
name: 'enabledState',
|
||||
type: 'a-select',
|
||||
span: 8,
|
||||
attrs: {
|
||||
placeholder: '请选择可用状态',
|
||||
options: tool.dictList('COMMON_STATUS')
|
||||
},
|
||||
defaultValue: 'ENABLE'
|
||||
},
|
||||
{
|
||||
label: '备注:',
|
||||
name: 'remarks',
|
||||
type: 'a-textarea',
|
||||
span: 24,
|
||||
attrs: {
|
||||
placeholder: '请输入备注',
|
||||
allowClear: true
|
||||
}
|
||||
}
|
||||
]
|
||||
|
||||
const basicInfoFormItems = [
|
||||
{
|
||||
label: 'AppID:',
|
||||
name: 'appid',
|
||||
type: 'a-input',
|
||||
attrs: {
|
||||
placeholder: '请输入AppID',
|
||||
allowClear: true
|
||||
}
|
||||
},
|
||||
{
|
||||
label: 'AppSecret:',
|
||||
name: 'secret',
|
||||
type: 'a-input',
|
||||
attrs: {
|
||||
placeholder: '请输入AppSecret',
|
||||
allowClear: true
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '字符串编码格式:',
|
||||
name: 'encodingFormat',
|
||||
type: 'a-input',
|
||||
attrs: {
|
||||
placeholder: '请输入字符串编码格式',
|
||||
allowClear: true
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '校验码:',
|
||||
name: 'token',
|
||||
type: 'a-input',
|
||||
attrs: {
|
||||
placeholder: '请输入校验码',
|
||||
allowClear: true
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '签名方式:',
|
||||
name: 'aesKey',
|
||||
type: 'a-input',
|
||||
attrs: {
|
||||
placeholder: '请输入签名方式',
|
||||
allowClear: true
|
||||
}
|
||||
}
|
||||
]
|
||||
|
||||
const formRef1 = ref(null)
|
||||
const formRef2 = ref(null)
|
||||
let detailData = ref({})
|
||||
|
||||
const { state, formData, submitLoading, formRefs, onSubmit, handleBack, fetchData } = useFormHandler(
|
||||
const { formData, formRefs, onSubmit, handleBack, fetchData } = useFormHandler(
|
||||
[...officialAccountFormItems, ...basicInfoFormItems],
|
||||
{
|
||||
submitForm: officialAccountApi.officialAccountSubmitForm,
|
||||
|
@ -147,6 +59,10 @@
|
|||
|
||||
onMounted(async () => {
|
||||
formRefs.value = [formRef1.value, formRef2.value]
|
||||
await fetchData(route.query.type)
|
||||
fetchData(route.query.type).then((res) => {
|
||||
if (res) {
|
||||
detailData.value = res
|
||||
}
|
||||
})
|
||||
})
|
||||
</script>
|
||||
|
|
|
@ -152,7 +152,7 @@
|
|||
span: 6,
|
||||
attrs: {
|
||||
placeholder: '请选择上游仓库',
|
||||
options: [],
|
||||
treeData: [],
|
||||
fieldNames: {
|
||||
children: 'children',
|
||||
label: 'name',
|
||||
|
@ -236,13 +236,18 @@
|
|||
})
|
||||
|
||||
const sysStoreTreeList = await sysStoreApi.sysStoreTree()
|
||||
if (Array.isArray(sysStoreTreeList)) {
|
||||
officialAccountFormItems.forEach((item) => {
|
||||
if (item.name === 'parentId') {
|
||||
item.attrs.options = sysStoreTreeList
|
||||
item.attrs.treeData = [
|
||||
{
|
||||
id: 0,
|
||||
parentId: '-1',
|
||||
name: '顶级',
|
||||
children: sysStoreTreeList || []
|
||||
}
|
||||
]
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
|
||||
let activeKey = ref('1')
|
||||
|
|
|
@ -30,6 +30,26 @@
|
|||
</a-card>
|
||||
|
||||
<a-card :bordered="false" class="mt-4" style="height: 100%">
|
||||
<a-row :gutter="24">
|
||||
<a-col :span="6">
|
||||
<dynamic-tree
|
||||
ref="dynamicTreeRef"
|
||||
treeTitle="生产组织"
|
||||
:tableRef="tableRef"
|
||||
:apiModel="{
|
||||
getTree: sysStoreApi.sysStoreTree,
|
||||
delTree: sysStoreApi.productionOrganizationDelete
|
||||
}"
|
||||
@selectTree="onSelectTree"
|
||||
:toolConfig="{
|
||||
plus: false,
|
||||
edit: false,
|
||||
delete: false,
|
||||
refresh: true
|
||||
}"
|
||||
></dynamic-tree>
|
||||
</a-col>
|
||||
<a-col :span="18">
|
||||
<s-table
|
||||
ref="tableRef"
|
||||
:columns="columns"
|
||||
|
@ -117,6 +137,8 @@
|
|||
</template>
|
||||
</template>
|
||||
</s-table>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-card>
|
||||
</template>
|
||||
|
||||
|
@ -192,4 +214,15 @@
|
|||
stashColumn,
|
||||
['sysStoreEdit', 'sysStoreDelete']
|
||||
)
|
||||
|
||||
const dynamicTreeRef = ref(null)
|
||||
|
||||
const onSelectTree = (value) => {
|
||||
searchFormState.value.parentId = value.id
|
||||
tableRef.value.refresh()
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
dynamicTreeRef.value.loadTreeData()
|
||||
})
|
||||
</script>
|
||||
|
|
|
@ -1,14 +1,14 @@
|
|||
<template>
|
||||
<xn-form-container
|
||||
:title="pageType === 'EDIT' ? '编辑生产组织' : pageType === 'ADD' ? '增加生产组织' : '查看生产组织'"
|
||||
:width="700"
|
||||
width="50%"
|
||||
:visible="visible"
|
||||
:destroy-on-close="true"
|
||||
@close="onClose"
|
||||
>
|
||||
<a-form ref="formRef" :model="formData" :rules="formRules" layout="vertical">
|
||||
<a-row :gutter="16">
|
||||
<a-col :span="24">
|
||||
<a-col :span="12">
|
||||
<a-form-item label="编码:" name="number">
|
||||
<a-input
|
||||
:disabled="pageType === 'SEARCH'"
|
||||
|
@ -18,7 +18,7 @@
|
|||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="24">
|
||||
<a-col :span="12">
|
||||
<a-form-item label="类型:" name="type">
|
||||
<a-select
|
||||
:disabled="pageType !== 'ADD'"
|
||||
|
@ -28,7 +28,7 @@
|
|||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="24">
|
||||
<a-col :span="12">
|
||||
<a-form-item label="工厂名称:" name="name">
|
||||
<a-input
|
||||
:disabled="pageType === 'SEARCH'"
|
||||
|
@ -38,7 +38,7 @@
|
|||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="24">
|
||||
<a-col :span="12">
|
||||
<a-form-item label="仓库:" name="storeId">
|
||||
<a-tree-select
|
||||
:disabled="pageType === 'SEARCH'"
|
||||
|
@ -56,8 +56,8 @@
|
|||
</a-tree-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="24">
|
||||
<a-form-item label="上级组织:" name="parentId" v-if="formData.type !== 'FACTORY'">
|
||||
<a-col :span="12" v-if="formData.type !== 'FACTORY'">
|
||||
<a-form-item label="上级组织:" name="parentId">
|
||||
<a-tree-select
|
||||
:disabled="pageType === 'SEARCH'"
|
||||
v-model:value="formData.parentId"
|
||||
|
@ -74,7 +74,7 @@
|
|||
</a-tree-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="24">
|
||||
<a-col :span="12">
|
||||
<a-form-item label="厂家名称:" name="manufacturer" v-if="formData.type === 'FACTORY'">
|
||||
<a-input
|
||||
:disabled="pageType === 'SEARCH'"
|
||||
|
@ -84,7 +84,7 @@
|
|||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="24">
|
||||
<a-col :span="12">
|
||||
<a-form-item label="启用状态:" name="enabledState">
|
||||
<a-select
|
||||
:disabled="pageType === 'SEARCH'"
|
||||
|
@ -96,7 +96,7 @@
|
|||
</a-col>
|
||||
</a-row>
|
||||
|
||||
<OperationalInformation :detailData="detailData" v-if="pageType !== 'ADD'"></OperationalInformation>
|
||||
<OperationalInformation :detailData="detailData" v-if="pageType !== 'ADD'" :colSpan="12"></OperationalInformation>
|
||||
</a-form>
|
||||
<template #footer>
|
||||
<a-button style="margin-right: 8px" @click="onClose">关闭</a-button>
|
||||
|
|
|
@ -0,0 +1,180 @@
|
|||
<template>
|
||||
<xn-form-container
|
||||
:title="formData.id ? '编辑扩展字段配置' : '增加扩展字段配置'"
|
||||
width="50%"
|
||||
:visible="visible"
|
||||
:destroy-on-close="true"
|
||||
@close="onClose"
|
||||
>
|
||||
<a-form ref="formRef" :model="formData" :rules="formRules" layout="vertical">
|
||||
<a-row :gutter="16">
|
||||
<a-col :span="12">
|
||||
<a-form-item label="名称:" name="name">
|
||||
<a-input v-model:value="formData.name" placeholder="请输入名称" allow-clear />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<a-form-item label="所属模块:" name="model">
|
||||
<a-select
|
||||
v-model:value="formData.model"
|
||||
placeholder="请选择所属模块"
|
||||
:options="tool.dictList('EXTEND_FIELD_MODEL')"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<a-form-item label="字段名:" name="fieldName">
|
||||
<a-input v-model:value="formData.fieldName" placeholder="请输入字段名" allow-clear />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<a-form-item label="字段名:" name="fieldType">
|
||||
<a-input v-model:value="formData.fieldType" placeholder="请输入字段名" allow-clear />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<a-form-item label="展示形式:" name="showType">
|
||||
<a-select
|
||||
v-model:value="formData.showType"
|
||||
placeholder="请选择展示形式"
|
||||
:options="tool.dictList('EXTEND_FIELD_SHOW_TYPE')"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<a-form-item label="启用状态:" name="enabledState">
|
||||
<a-select
|
||||
v-model:value="formData.enabledState"
|
||||
placeholder="请选择启用状态"
|
||||
:options="enabledStateOptions"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<a-form-item label="备注:" name="remarks">
|
||||
<a-textarea v-model:value="formData.remarks" placeholder="请输入备注" allow-clear />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
|
||||
<a-col
|
||||
:span="24"
|
||||
v-if="formData.showType && formData.showType !== 'input' && formData.showType !== 'inputNumber'"
|
||||
>
|
||||
<h3>扩展数据:</h3>
|
||||
<div v-for="(item, index) in selectableData" :key="index" class="mb-2">
|
||||
<a-space>
|
||||
<a-button type="primary" @click="addSelectableData" v-if="index === 0">
|
||||
<PlusOutlined />
|
||||
</a-button>
|
||||
<a-button type="primary" danger @click="delSelectableData(index)" v-if="index !== 0">
|
||||
<MinusOutlined />
|
||||
</a-button>
|
||||
<a-input style="width: 100%" v-model:value="item.filedName" placeholder="请输入内容"></a-input>
|
||||
</a-space>
|
||||
</div>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-form>
|
||||
|
||||
<template #footer>
|
||||
<a-button style="margin-right: 8px" @click="onClose">关闭</a-button>
|
||||
<a-button type="primary" @click="onSubmit" :loading="submitLoading">保存</a-button>
|
||||
</template>
|
||||
</xn-form-container>
|
||||
</template>
|
||||
|
||||
<script setup name="extendFieldForm">
|
||||
import tool from '@/utils/tool'
|
||||
import { cloneDeep } from 'lodash-es'
|
||||
import { required } from '@/utils/formRules'
|
||||
import extendFieldApi from '@/api/base/extendfield/extendFieldApi'
|
||||
import { message } from 'ant-design-vue'
|
||||
|
||||
// 抽屉状态
|
||||
const visible = ref(false)
|
||||
const emit = defineEmits({ successful: null })
|
||||
const formRef = ref()
|
||||
// 表单数据
|
||||
const formData = ref({})
|
||||
const submitLoading = ref(false)
|
||||
const enabledStateOptions = ref([])
|
||||
|
||||
// 增加数据
|
||||
let selectableData = ref([
|
||||
{
|
||||
filedName: ''
|
||||
}
|
||||
])
|
||||
|
||||
const addSelectableData = () => {
|
||||
selectableData.value.push({
|
||||
filedName: ''
|
||||
})
|
||||
}
|
||||
|
||||
const delSelectableData = (index) => {
|
||||
selectableData.value.splice(index, 1)
|
||||
}
|
||||
|
||||
// 打开抽屉
|
||||
const onOpen = (record) => {
|
||||
visible.value = true
|
||||
if (record) {
|
||||
let recordData = cloneDeep(record)
|
||||
formData.value = Object.assign({}, recordData)
|
||||
if (recordData.showValues) {
|
||||
selectableData.value = JSON.parse(recordData.showValues)
|
||||
} else {
|
||||
selectableData.value = [
|
||||
{
|
||||
filedName: ''
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
enabledStateOptions.value = tool.dictList('COMMON_STATUS')
|
||||
}
|
||||
// 关闭抽屉
|
||||
const onClose = () => {
|
||||
formRef.value.resetFields()
|
||||
formData.value = {}
|
||||
visible.value = false
|
||||
}
|
||||
// 默认要校验的
|
||||
const formRules = {}
|
||||
// 验证并提交数据
|
||||
const onSubmit = () => {
|
||||
if (
|
||||
formData.value.showType === 'select' &&
|
||||
formData.value.showType === 'radio' &&
|
||||
formData.value.showType === 'checkbox' &&
|
||||
selectableData.value.length === 0
|
||||
) {
|
||||
return message.error('请添加选项要展示的数据')
|
||||
}
|
||||
|
||||
formRef.value.validate().then(() => {
|
||||
submitLoading.value = true
|
||||
const formDataParam = cloneDeep(formData.value)
|
||||
if (formDataParam.showType === 'input' || formDataParam.showType === 'inputNumber') {
|
||||
formDataParam.showValues = ''
|
||||
} else {
|
||||
formDataParam.showValues = JSON.stringify(selectableData.value)
|
||||
}
|
||||
|
||||
extendFieldApi
|
||||
.extendFieldSubmitForm(formDataParam, formDataParam.id)
|
||||
.then(() => {
|
||||
onClose()
|
||||
emit('successful')
|
||||
})
|
||||
.finally(() => {
|
||||
submitLoading.value = false
|
||||
})
|
||||
})
|
||||
}
|
||||
// 抛出函数
|
||||
defineExpose({
|
||||
onOpen
|
||||
})
|
||||
</script>
|
|
@ -0,0 +1,160 @@
|
|||
<template>
|
||||
<a-card :bordered="false">
|
||||
<a-form ref="searchFormRef" name="advanced_search" :model="searchFormState">
|
||||
<a-row :gutter="24">
|
||||
<a-col :span="6">
|
||||
<a-form-item label="所属类型" name="type">
|
||||
<a-input v-model:value="searchFormState.type" placeholder="请输入所属类型" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="6">
|
||||
<a-form-item label="启用状态" name="enabledState">
|
||||
<a-select
|
||||
v-model:value="searchFormState.enabledState"
|
||||
placeholder="请选择启用状态"
|
||||
:options="enabledStateOptions"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="6">
|
||||
<a-button type="primary" @click="tableRef.refresh()">查询</a-button>
|
||||
<a-button style="margin: 0 8px" @click="reset">重置</a-button>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</a-card>
|
||||
|
||||
<a-card :bordered="false" style="height: 100%" class="mt-4">
|
||||
<s-table
|
||||
ref="tableRef"
|
||||
:columns="columns"
|
||||
:data="loadData"
|
||||
:alert="options.alert.show"
|
||||
bordered
|
||||
:row-key="(record) => record.id"
|
||||
:tool-config="toolConfig"
|
||||
:row-selection="options.rowSelection"
|
||||
>
|
||||
<template #operator>
|
||||
<a-space>
|
||||
<a-button type="primary" @click="formRef.onOpen()" v-if="hasPerm('extendFieldAdd')">
|
||||
<template #icon><plus-outlined /></template>
|
||||
新增
|
||||
</a-button>
|
||||
<xn-batch-delete
|
||||
v-if="hasPerm('extendFieldBatchDelete')"
|
||||
:selectedRowKeys="selectedRowKeys"
|
||||
@batchDelete="deleteBatchExtendField"
|
||||
/>
|
||||
</a-space>
|
||||
</template>
|
||||
<template #bodyCell="{ column, record }">
|
||||
<template v-if="column.dataIndex === 'enabledState'">
|
||||
{{ $TOOL.dictTypeData('COMMON_STATUS', record.enabledState) }}
|
||||
</template>
|
||||
<template v-if="column.dataIndex === 'action'">
|
||||
<a-space>
|
||||
<a @click="formRef.onOpen(record)" v-if="hasPerm('extendFieldEdit')">编辑</a>
|
||||
<a-divider type="vertical" v-if="hasPerm(['extendFieldEdit', 'extendFieldDelete'], 'and')" />
|
||||
<a-popconfirm title="确定要删除吗?" @confirm="deleteExtendField(record)">
|
||||
<a-button type="link" danger size="small" v-if="hasPerm('extendFieldDelete')">删除</a-button>
|
||||
</a-popconfirm>
|
||||
</a-space>
|
||||
</template>
|
||||
</template>
|
||||
</s-table>
|
||||
</a-card>
|
||||
<Form ref="formRef" @successful="tableRef.refresh()" />
|
||||
</template>
|
||||
|
||||
<script setup name="extendfield">
|
||||
import tool from '@/utils/tool'
|
||||
import { cloneDeep } from 'lodash-es'
|
||||
import Form from './detail/form.vue'
|
||||
import extendFieldApi from '@/api/base/extendfield/extendFieldApi'
|
||||
const searchFormState = ref({})
|
||||
const searchFormRef = ref()
|
||||
const tableRef = ref()
|
||||
const formRef = ref()
|
||||
const toolConfig = { refresh: true, height: true, columnSetting: true, striped: false }
|
||||
const columns = [
|
||||
{
|
||||
title: '名称',
|
||||
dataIndex: 'name'
|
||||
},
|
||||
{
|
||||
title: '所属类型',
|
||||
dataIndex: 'type'
|
||||
},
|
||||
{
|
||||
title: '字段名',
|
||||
dataIndex: 'fieldName'
|
||||
},
|
||||
{
|
||||
title: '字段类型',
|
||||
dataIndex: 'fieldType'
|
||||
},
|
||||
{
|
||||
title: '备注',
|
||||
dataIndex: 'remarks'
|
||||
},
|
||||
{
|
||||
title: '启用状态',
|
||||
dataIndex: 'enabledState'
|
||||
}
|
||||
]
|
||||
// 操作栏通过权限判断是否显示
|
||||
if (hasPerm(['extendFieldEdit', 'extendFieldDelete'])) {
|
||||
columns.push({
|
||||
title: '操作',
|
||||
dataIndex: 'action',
|
||||
align: 'center',
|
||||
width: 150
|
||||
})
|
||||
}
|
||||
const selectedRowKeys = ref([])
|
||||
// 列表选择配置
|
||||
const options = {
|
||||
// columns数字类型字段加入 needTotal: true 可以勾选自动算账
|
||||
alert: {
|
||||
show: true,
|
||||
clear: () => {
|
||||
selectedRowKeys.value = ref([])
|
||||
}
|
||||
},
|
||||
rowSelection: {
|
||||
onChange: (selectedRowKey, selectedRows) => {
|
||||
selectedRowKeys.value = selectedRowKey
|
||||
}
|
||||
}
|
||||
}
|
||||
const loadData = (parameter) => {
|
||||
const searchFormParam = cloneDeep(searchFormState.value)
|
||||
return extendFieldApi.extendFieldPage(Object.assign(parameter, searchFormParam)).then((data) => {
|
||||
return data
|
||||
})
|
||||
}
|
||||
// 重置
|
||||
const reset = () => {
|
||||
searchFormRef.value.resetFields()
|
||||
tableRef.value.refresh(true)
|
||||
}
|
||||
// 删除
|
||||
const deleteExtendField = (record) => {
|
||||
let params = [
|
||||
{
|
||||
id: record.id
|
||||
}
|
||||
]
|
||||
extendFieldApi.extendFieldDelete(params).then(() => {
|
||||
tableRef.value.refresh(true)
|
||||
})
|
||||
}
|
||||
// 批量删除
|
||||
const deleteBatchExtendField = (params) => {
|
||||
extendFieldApi.extendFieldDelete(params).then(() => {
|
||||
tableRef.value.clearRefreshSelected()
|
||||
})
|
||||
}
|
||||
const enabledStateOptions = tool.dictList('COMMON_STATUS')
|
||||
</script>
|
Loading…
Reference in New Issue