Browse Source

EAM ——> 文档类型选择集 与 文档类型项 关联 前后端更新

master_hella_20240701
高竟松 9 months ago
parent
commit
15216270ea
  1. 20
      src/api/eam/documentType/index.ts
  2. 61
      src/api/eam/documentTypeSelectSet/index.ts
  3. 0
      src/views/eam/documentType/documentType.data.ts
  4. 4
      src/views/eam/documentType/index.vue
  5. 140
      src/views/eam/documentTypeSelectSet/documentTypeSelectSet.data.ts
  6. 300
      src/views/eam/documentTypeSelectSet/index.vue
  7. 292
      src/views/eam/documentTypeSelectSet/itemSelectSetForm.vue

20
src/api/eam/basicDocumentType/index.ts → src/api/eam/documentType/index.ts

@ -20,48 +20,48 @@ export const getDocumentTypePage = async (params) => {
if (params.isSearch) { if (params.isSearch) {
delete params.isSearch delete params.isSearch
const data = {...params} const data = {...params}
return await request.post({ url: '/eam/document-type/senior', data }) return await request.post({ url: '/eam/basic/document-type/senior', data })
} else { } else {
return await request.get({ url: `/eam/document-type/page`, params }) return await request.get({ url: `/eam/basic/document-type/page`, params })
} }
} }
// 查询文档类型详情 // 查询文档类型详情
export const getDocumentType = async (id: number) => { export const getDocumentType = async (id: number) => {
return await request.get({ url: `/eam/document-type/get?id=` + id }) return await request.get({ url: `/eam/basic/document-type/get?id=` + id })
} }
// 新增文档类型 // 新增文档类型
export const createDocumentType = async (data: DocumentTypeVO) => { export const createDocumentType = async (data: DocumentTypeVO) => {
return await request.post({ url: `/eam/document-type/create`, data }) return await request.post({ url: `/eam/basic/document-type/create`, data })
} }
// 修改文档类型 // 修改文档类型
export const updateDocumentType = async (data: DocumentTypeVO) => { export const updateDocumentType = async (data: DocumentTypeVO) => {
return await request.put({ url: `/eam/document-type/update`, data }) return await request.put({ url: `/eam/basic/document-type/update`, data })
} }
// 删除文档类型 // 删除文档类型
export const deleteDocumentType = async (id: number) => { export const deleteDocumentType = async (id: number) => {
return await request.delete({ url: `/eam/document-type/delete?id=` + id }) return await request.delete({ url: `/eam/basic/document-type/delete?id=` + id })
} }
// 导出文档类型 Excel // 导出文档类型 Excel
export const exportDocumentType = async (params) => { export const exportDocumentType = async (params) => {
if (params.isSearch) { if (params.isSearch) {
const data = {...params} const data = {...params}
return await request.downloadPost({ url: `/eam/document-type/export-excel-senior`, data }) return await request.downloadPost({ url: `/eam/basic/document-type/export-excel-senior`, data })
}else{ }else{
return await request.download({ url: `/eam/document-type/export-excel`, params }) return await request.download({ url: `/eam/basic/document-type/export-excel`, params })
} }
} }
// 下载用户导入模板 // 下载用户导入模板
export const importTemplate = () => { export const importTemplate = () => {
return request.download({ url: '/eam/document-type/get-import-template' }) return request.download({ url: '/eam/basic/document-type/get-import-template' })
} }
// 启用 / 禁用 // 启用 / 禁用
export const updateEnableCode = async (data: DocumentTypeVO) => { export const updateEnableCode = async (data: DocumentTypeVO) => {
return await request.post({ url: `/eam/document-type/ables` , data }) return await request.post({ url: `/eam/basic/document-type/ables` , data })
} }

61
src/api/eam/documentTypeSelectSet/index.ts

@ -0,0 +1,61 @@
import request from '@/config/axios'
import {BasicSpotCheckSelectSetVO} from "@/api/eam/basicSpotCheckSelectSet";
export interface DocumentTypeSelectSetVO {
id: number
name: string
itemCode: string
departmentCode: string
remark: string
siteId: string
available: string
deletionTime: Date
deleterId: byte[]
concurrencyStamp: number
}
// 查询文档类型选择集列表
export const getDocumentTypeSelectSetPage = async (params) => {
if (params.isSearch) {
delete params.isSearch
const data = {...params}
return await request.post({ url: '/eam/document-type-select-set/senior', data })
} else {
return await request.get({ url: `/eam/document-type-select-set/page`, params })
}
}
// 查询文档类型选择集详情
export const getDocumentTypeSelectSet = async (id: number) => {
return await request.get({ url: `/eam/document-type-select-set/get?id=` + id })
}
// 新增文档类型选择集
export const createDocumentTypeSelectSet = async (data: DocumentTypeSelectSetVO) => {
return await request.post({ url: `/eam/document-type-select-set/create`, data })
}
// 修改文档类型选择集
export const updateDocumentTypeSelectSet = async (data: DocumentTypeSelectSetVO) => {
return await request.put({ url: `/eam/document-type-select-set/update`, data })
}
// 删除文档类型选择集
export const deleteDocumentTypeSelectSet = async (id: number) => {
return await request.delete({ url: `/eam/document-type-select-set/delete?id=` + id })
}
// 导出文档类型选择集 Excel
export const exportDocumentTypeSelectSet = async (params) => {
return await request.download({ url: `/eam/document-type-select-set/export-excel`, params })
}
// 下载用户导入模板
export const importTemplate = () => {
return request.download({ url: '/eam/document-type-select-set/get-import-template' })
}
// 启用 / 禁用
export const updateEnableCode = async (data: DocumentTypeSelectSetVO) => {
return await request.post({ url: `/eam/document-type-select-set/ables` , data })
}

0
src/views/eam/basicDocumentType/basicDocumentType.data.ts → src/views/eam/documentType/documentType.data.ts

4
src/views/eam/basicDocumentType/index.vue → src/views/eam/documentType/index.vue

@ -59,8 +59,8 @@
<script setup lang="ts"> <script setup lang="ts">
import download from '@/utils/download' import download from '@/utils/download'
import { DocumentType,DocumentTypeRules } from './basicDocumentType.data' import { DocumentType,DocumentTypeRules } from './documentType.data'
import * as DocumentTypeApi from '@/api/eam/basicDocumentType' import * as DocumentTypeApi from '@/api/eam/documentType'
import * as defaultButtons from '@/utils/disposition/defaultButtons' import * as defaultButtons from '@/utils/disposition/defaultButtons'
import TableHead from '@/components/TableHead/src/TableHead.vue' import TableHead from '@/components/TableHead/src/TableHead.vue'
import ImportForm from '@/components/ImportForm/src/ImportForm.vue' import ImportForm from '@/components/ImportForm/src/ImportForm.vue'

140
src/views/eam/documentTypeSelectSet/documentTypeSelectSet.data.ts

@ -0,0 +1,140 @@
import type { CrudSchema } from '@/hooks/web/useCrudSchemas'
import { dateFormatter } from '@/utils/formatTime'
// 表单校验
export const DocumentTypeSelectSetRules = reactive({
name: [required],
itemCode: [required],
})
export const DocumentTypeSelectSet = useCrudSchemas(reactive<CrudSchema[]>([
{
label: 'id',
field: 'id',
sort: 'custom',
isSearch: false,
isTable: false,
isForm: false,
isDetail:false,
},
{
label: '选择集名称',
field: 'name',
sort: 'custom',
isSearch: true,
},
{
label: '项编号',
field: 'itemCode',
sort: 'custom',
isSearch: true,
},
{
label: '创建时间',
field: 'createTime',
sort: 'custom',
formatter: dateFormatter,
isSearch: true,
search: {
component: 'DatePicker',
componentProps: {
valueFormat: 'YYYY-MM-DD HH:mm:ss',
type: 'daterange',
defaultTime: [new Date('1 00:00:00'), new Date('1 23:59:59')]
}
},
isForm: false,
},
{
label: '部门id',
field: 'departmentCode',
sort: 'custom',
isSearch: false,
isTable: false,
isForm: false,
isDetail:false,
},
{
label: '备注',
field: 'remark',
sort: 'custom',
isSearch: true,
},
{
label: '地点ID',
field: 'siteId',
sort: 'custom',
isSearch: false,
isTable: false,
isForm: false,
isDetail:false,
},
{
label: '是否可用',
field: 'available',
sort: 'custom',
dictType: DICT_TYPE.TRUE_FALSE,
dictClass: 'string', // 默认都是字符串类型其他暂不考虑
isTable: true,
isDetail: false,
isSearch: true,
isTableForm: false,
isForm: false,
},
{
label: '删除时间',
field: 'deletionTime',
sort: 'custom',
formatter: dateFormatter,
isSearch: false,
isTable: false,
isForm: false,
isDetail:false,
search: {
component: 'DatePicker',
componentProps: {
valueFormat: 'YYYY-MM-DD HH:mm:ss',
type: 'daterange',
defaultTime: [new Date('1 00:00:00'), new Date('1 23:59:59')]
}
},
form: {
component: 'DatePicker',
componentProps: {
type: 'datetime',
valueFormat: 'x'
}
},
},
{
label: '删除人id',
field: 'deleterId',
sort: 'custom',
isSearch: false,
isTable: false,
isForm: false,
isDetail:false,
},
{
label: '并发乐观锁',
field: 'concurrencyStamp',
sort: 'custom',
isSearch: false,
isTable: false,
isForm: false,
isDetail:false,
form: {
component: 'InputNumber',
value: 0
},
},
{
label: '操作',
field: 'action',
isForm: false,
table: {
width: 150,
fixed: 'right'
}
}
]))

300
src/views/eam/documentTypeSelectSet/index.vue

@ -0,0 +1,300 @@
<template>
<ContentWrap>
<!-- 搜索工作栏 -->
<Search :schema="DocumentTypeSelectSet.allSchemas.searchSchema" @search="setSearchParams" @reset="setSearchParams" />
</ContentWrap>
<!-- 列表头部 -->
<TableHead
:HeadButttondata="HeadButttondata"
@button-base-click="buttonBaseClick"
:routeName="routeName"
@updataTableColumns="updataTableColumns"
@searchFormClick="searchFormClick"
:allSchemas="DocumentTypeSelectSet.allSchemas"
/>
<!-- 列表 -->
<ContentWrap>
<Table
:columns="tableColumns"
:data="tableObject.tableList"
:loading="tableObject.loading"
:pagination="{
total: tableObject.total
}"
v-model:pageSize="tableObject.pageSize"
v-model:currentPage="tableObject.currentPage"
v-model:sort="tableObject.sort"
>
<template #name="{row}">
<el-button type="primary" link @click="openDetail(row, '代码', row.name)">
<span>{{ row.name }}</span>
</el-button>
</template>
<template #action="{ row }">
<ButtonBase :Butttondata="butttondata(row)" @button-base-click="buttonTableClick($event,row)" />
</template>
</Table>
</ContentWrap>
<!-- 表单弹窗添加/修改 -->
<BasicForm
ref="basicFormRef"
@success="formsSuccess"
:rules="DocumentTypeSelectSetRules"
:formAllSchemas="DocumentTypeSelectSet.allSchemas"
:apiUpdate="DocumentTypeSelectSetApi.updateDocumentTypeSelectSet"
:apiCreate="DocumentTypeSelectSetApi.createDocumentTypeSelectSet"
@searchTableSuccess="searchTableSuccess"
:isBusiness="false"
/>
<!-- 表单弹窗添加/修改 -->
<ItemForm ref="basicFormRef" @success="getData"/>
<!-- 详情 -->
<Detail ref="detailRef" :isBasic="true" :allSchemas="DocumentTypeSelectSet.allSchemas" />
<!-- 导入 -->
<ImportForm ref="importFormRef" url="/eam/document-type-select-set/import" :importTemplateData="importTemplateData" @success="importSuccess" />
</template>
<script setup lang="ts">
import download from '@/utils/download'
import { DocumentTypeSelectSet,DocumentTypeSelectSetRules } from './documentTypeSelectSet.data'
import * as DocumentTypeSelectSetApi from '@/api/eam/documentTypeSelectSet'
import * as defaultButtons from '@/utils/disposition/defaultButtons'
import TableHead from '@/components/TableHead/src/TableHead.vue'
import ImportForm from '@/components/ImportForm/src/ImportForm.vue'
import Detail from '@/components/Detail/src/Detail.vue'
import ItemForm from "@/views/eam/documentTypeSelectSet/itemSelectSetForm.vue";
defineOptions({ name: 'DocumentTypeSelectSet' })
const message = useMessage() //
const { t } = useI18n() //
const route = useRoute() //
const routeName = ref()
routeName.value = route.name
const tableColumns = ref(DocumentTypeSelectSet.allSchemas.tableColumns)
//
const searchTableSuccess = (formField, searchField, val, formRef) => {
nextTick(() => {
const setV = {}
setV[formField] = val[0][searchField]
formRef.setValues(setV)
})
}
//
const updataTableColumns = (val) => {
tableColumns.value = val
}
const { tableObject, tableMethods } = useTable({
getListApi: DocumentTypeSelectSetApi.getDocumentTypeSelectSetPage //
})
//
const { getList, setSearchParams } = tableMethods
//
const HeadButttondata = [
defaultButtons.defaultAddBtn({hasPermi:'eam:documentTypeSelectSet:create'}), //
//defaultButtons.defaultImportBtn({hasPermi:'eam:documentTypeSelectSet:import'}), //
//defaultButtons.defaultExportBtn({hasPermi:'eam:documentTypeSelectSet:export'}), //
defaultButtons.defaultFreshBtn(null), //
defaultButtons.defaultFilterBtn(null), //
defaultButtons.defaultSetBtn(null), //
// {
// label: '',
// name: 'zdy',
// hide: false,
// type: 'primary',
// icon: 'Select',
// color: ''
// },
]
//
const buttonBaseClick = (val, item) => {
if (val == 'add') { //
openForm('create')
} else if (val == 'import') { //
handleImport()
} else if (val == 'export') { //
handleExport()
} else if (val == 'refresh') { //
getList()
} else if (val == 'filtrate') { //
} else { //
console.log('其他按钮', item)
}
}
const isShowMainButton = (row,val) => {
if (val.indexOf(row.available) > -1) {
return false
} else {
return true
}
}
// -
const butttondata = (row) => {
return [
defaultButtons.mainListEditBtn({hasPermi:'eam:documentTypeSelectSet:update'}), //
defaultButtons.mainListEnableBtn({hide:isShowMainButton(row,['FALSE']),hasPermi:'eam:documentTypeSelectSet:update'}),
defaultButtons.mainListDisableBtn({hide:isShowMainButton(row,['TRUE']),hasPermi:'eam:documentTypeSelectSet:update'}),
]
}
// -
const buttonTableClick = async (val, row) => {
if (val == 'edit') { //
openForm('update', row)
} else if (val == 'delete') { //
handleDelete(row.id)
} else if (val == 'enable') {
handleEnable(row.id)
} else if (val == 'disable') {
handleDisable(row.id)
}
}
/** 添加/修改操作 */
const basicFormRef = ref()
const openForm = (type: string, row?: any) => {
basicFormRef.value.open(type, row)
}
// form
const formsSuccess = async (formType,data) => {
var isHave =DocumentTypeSelectSet.allSchemas.formSchema.some(function (item) {
return item.field === 'activeTime' || item.field === 'expireTime';
});
if(isHave){
if(data.activeTime && data.expireTime && data.activeTime >=data.expireTime){
message.error('失效时间要大于生效时间')
return;
}
}
if(data.activeTime==0)data.activeTime = null;
if(data.expireTime==0)data.expireTime = null;
if (formType === 'create') {
await DocumentTypeSelectSetApi.createDocumentTypeSelectSet(data)
message.success(t('common.createSuccess'))
} else {
await DocumentTypeSelectSetApi.updateDocumentTypeSelectSet(data)
message.success(t('common.updateSuccess'))
}
basicFormRef.value.dialogVisible = false
getList()
}
//
const getData = async() => {
getList();
}
/** 详情操作 */
const detailRef = ref()
const openDetail = (row: any, titleName: any, titleValue: any) => {
detailRef.value.openDetail(row, titleName, titleValue, 'basicDocumentTypeSelectSet')
}
/** 删除按钮操作 */
const handleDelete = async (id: number) => {
try {
//
await message.delConfirm()
//
await DocumentTypeSelectSetApi.deleteDocumentTypeSelectSet(id)
message.success(t('common.delSuccess'))
//
await getList()
} catch {}
}
/** 启用 */
const handleEnable = async (id: number) => {
try {
const params = ref({
id: '',
available:'',
})
params.value.id = id
params.value.available = 'TRUE'
await DocumentTypeSelectSetApi.updateEnableCode(params.value)
message.success(t('common.updateSuccess'))
//
await getList()
} catch {}
}
/** 禁用 */
const handleDisable = async (id: number) => {
try {
const params = ref({
id: '',
available:'',
})
params.value.id = id
params.value.available = 'FALSE'
await DocumentTypeSelectSetApi.updateEnableCode(params.value)
message.success(t('common.updateSuccess'))
//
await getList()
} catch {}
}
/** 导出按钮操作 */
const exportLoading = ref(false) //
const handleExport = async () => {
try {
//
await message.exportConfirm()
//
exportLoading.value = true
const data = await DocumentTypeSelectSetApi.exportDocumentTypeSelectSet(tableObject.params)
download.excel(data, '文档类型选择集.xlsx')
} catch {
} finally {
exportLoading.value = false
}
}
/** 导入 */
const importFormRef = ref()
const handleImport = () => {
importFormRef.value.open()
}
//
const importTemplateData = reactive({
templateUrl: '',
templateTitle: '文档类型选择集导入模版.xlsx'
})
//
const importSuccess = () => {
getList()
}
//
const searchFormClick = (searchData) => {
tableObject.params = {
isSearch: true,
filters: searchData.filters
}
getList() //
}
/** 初始化 **/
onMounted(async () => {
getList()
importTemplateData.templateUrl = await DocumentTypeSelectSetApi.importTemplate()
})
</script>

292
src/views/eam/documentTypeSelectSet/itemSelectSetForm.vue

@ -0,0 +1,292 @@
<template>
<Dialog v-model="dialogVisible" :title="dialogTitle">
<el-form
ref="basicFormRef"
v-loading="formLoading"
:model="formData"
:rules="formRules"
label-width="100px"
>
<el-row>
<el-col :span="12">
<el-form-item label="选择集名称" prop="name">
<el-input v-model="formData.name" placeholder="选择集名称" :disabled="isDisabled"/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="描述" prop="describing">
<el-input v-model="formData.describing" placeholder="描述" :disabled="isDisabled"/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="备注" prop="remark">
<el-input v-model="formData.remark" placeholder="请输入备注名称" />
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item label="文档类型项" prop="items">
<div class="tag-container flex gap-2">
<el-tag v-for="ent in tags" :key="ent.code" closable :disable-transitions="false" @close="handleClose(ent.id)">
{{ ent.code}}
</el-tag>
<el-input v-if="inputVisible" ref="InputRef" v-model="inputValue" class="w-20" size="small"/>
<el-button v-else class="button-new-tag" size="small" @click="addItem">
添加文档类型项 +
</el-button>
</div>
</el-form-item>
</el-col>
</el-row>
</el-form>
<template #footer>
<el-button :disabled="formLoading" type="primary" @click="submitForm"> </el-button>
<el-button @click="dialogVisible = false"> </el-button>
</template>
</Dialog>
<!--添加文档类型项弹窗-->
<SearchTable ref="searchTableRef" @searchTableSuccess="searchTableSuccess" />
</template>
<script lang="ts" setup>
import * as SelectSetApi from '@/api/eam/documentTypeSelectSet'
import request from "@/config/axios";
import { SearchTable } from '@/components/SearchTable'
import { DocumentType} from "@/views/eam/documentType/documentType.data";
import * as documentTypeItemApi from "@/api/eam/documentType";
import {ElInput} from "element-plus";
import {
createDocumentTypeSelectSet,
DocumentTypeSelectSetVO, updateDocumentTypeSelectSet
} from "@/api/eam/documentTypeSelectSet";
defineOptions({ name: 'TeamForm' })
const { t } = useI18n() //
const message = useMessage() //
const dialogVisible = ref(false) //
const dialogTitle = ref('') //
const formLoading = ref(false) // 12
const formType = ref('') // create - update -
const tags=ref([])
const inputValue = ref('')
const inputVisible = ref(false)
const isDisabled = ref(false)
const InputRef = ref<InstanceType<typeof ElInput>>()
const itemData = ref({
id: '',
code: ''
})
const formData = ref({
id: '',
name: '',
describing: '',
itemCode: '',
available: 'TRUE',
remark: '',
createTime: ''
})
const formRules = reactive({
name: [
{ required: true, message: '选择集名称不能为空', trigger: 'blur' },
{ max: 50, message: '不得超过50个字符', trigger: 'blur' }
],
remark: [
{ max: 50, message: '不得超过50个字符', trigger: 'blur' }
],
})
const basicFormRef = ref() // Ref
/** 删除文档类型项 */
const handleClose = (id: string) => {
const index = tags.value.findIndex(tag => tag.id === id);
if (index !== -1) {
tags.value.splice(index, 1);
}
}
/** 弹窗相关参数 */
const searchTableRef = ref();
const _searchTableTitle = ref();
const _searchTableAllSchemas = ref();
const _searchTablePage = ref();
const _formField = ref();
const _searchField = ref();
const _multiple = ref();
const _type = ref();
const _row = ref();
const _searchCondition = ref({})
const addItem = () =>{
addItemCommon(true,'wenDangItem')
}
/** 选择文档类型项弹窗 */
const addItemCommon = (multiple,field) => {
_searchCondition.value = {}
const filters: any[] = []
filters.push({
action: "==",
column: 'available',
value: 'TRUE'
})
//
_searchCondition.value.isSearch = true
_searchCondition.value.filters = filters
_searchTableTitle.value = '选择文档类型项'
_multiple.value = multiple
_formField.value = field
_searchField.value = field
_searchTablePage.value = documentTypeItemApi.getDocumentTypePage
_searchTableAllSchemas.value = DocumentType.allSchemas
openCommon()
}
/** 弹窗选择之后 回调函数 添加选择集 */
const searchTableSuccess = (formField, searchField, val, formRef, type, row ) => {
nextTick?.(() => {
if (formField === 'wenDangItem') {
console.log(val)
val.forEach(item => {
const isExist = tags.value.some(tag => tag.code === item.code);
if (!isExist){
const newItem = {};
newItem['code'] = item.code;
newItem['id'] = item.id;
tags.value.push(newItem);
}
});
}
})
}
/*打开弹窗*/
const openCommon = () => {
searchTableRef.value.open(
_searchTableTitle.value,
_searchTableAllSchemas.value,
_searchTablePage.value,
_formField.value,
_searchField.value,
_multiple.value,
_type.value,
_row.value,
_searchCondition.value
)
}
/** 初始化弹窗 */
const open = async (type: string, row?: object) => {
dialogVisible.value = true
dialogTitle.value = t('action.' + type)
formType.value = type
//
if (row) {
tags.value=[];
isDisabled.value = true;
formLoading.value = true
formData.value = row;
let item = (row.itemCode).split(",")
try {
for (var i = 0; i < item.length; i++) {
itemData.value = await request.get({ url: `/eam/basic/document-type/get?id=` + item[i] });
tags.value.push(itemData.value);
}
} finally {
formLoading.value = false
}
}
//
else {
resetForm()
isDisabled.value = false;
}
}
defineExpose({ open }) // open
/** 提交表单 */
const emit = defineEmits(['success']) // success
const submitForm = async () => {
//
if (!basicFormRef) return
const valid = await basicFormRef.value.validate()
if (!valid) return
if (tags.value.length > 10 ){
message.warning('文档类型项最多10个');
return
}
let result = '';
for (var i = 0; i < tags.value.length; i++) {
result += tags.value[i].id + ',';
}
if(result.endsWith(',')){
result = result.substring(0,result.length -1)
}
formData.value.itemCode = result
//
formLoading.value = true
//formData.value.members = JSON.stringify(tags.value)
try {
const data = formData.value as unknown as SelectSetApi.DocumentTypeSelectSetVO
if (formType.value === 'create') {
await SelectSetApi.createDocumentTypeSelectSet(data)
message.success(t('common.createSuccess'))
} else {
await SelectSetApi.updateDocumentTypeSelectSet(data)
message.success(t('common.updateSuccess'))
}
dialogVisible.value = false
//
emit('success')
} finally {
formLoading.value = false
}
}
/** 重置表单 */
const resetForm = () => {
formData.value = {
id: '',
name: '',
describing: '',
itemCode: '',
available: 'TRUE',
remark: '',
createTime: ''
}
tags.value=[];
basicFormRef.value?.resetFields()
}
</script>
<style scoped>
.tag-container {
margin-top: 10px; /* 可根据需要调整标签容器与表单项之间的间距 */
border: 1px solid #ccc; /* 添加边框样式 */
padding: 10px; /* 可根据需要调整容器内边距 */
width: 950px; /* 设置固定宽度为 950px */
overflow-y: auto; /* 当内容溢出容器高度时显示滚动条 */
word-wrap: break-word; /* 使用 word-wrap 属性实现超出范围换行 */
overflow-wrap: break-word; /* 兼容性更好的写法 */
flex-wrap: wrap;
}
.input-with-button {
display: flex;
align-items: center;
width: 100%;
}
.input-with-button > .el-input {
flex: 1;
/*margin-right: 10px;*/
}
</style>
Loading…
Cancel
Save