yudao
/
admin-vue3
mirror of https://gitee.com/yudaocode/yudao-ui-admin-vue3.git
3
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

加入属性分类值的可选项

pull/744/head
没钱 2025-03-10 15:36:48 +08:00
parent 031140a241
commit 42c2b69124
3 changed files with 101 additions and 53 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
.vscode/settings.json vendored
View File

@ -87,7 +87,7 @@
"source.fixAll.stylelint": "explicit"
},
"[vue]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
"editor.defaultFormatter": "Vue.volar"
},
"i18n-ally.localesPaths": ["src/locales"],
"i18n-ally.keystyle": "nested",

142
src/views/erp/product/category/propertiescategorymap/ProductCategoryPropertiesCategoryMapForm.vue
View File

@ -1,42 +1,45 @@
<template>
<Dialog title="新增分类属性值" v-model="valueDialogVisible">
<el-form ref="valueFormRef" :model="valueFormData" :rules="valueFormRules" label-width="100px" v-loading="formLoading">
<el-form-item label="分类属性值" prop="productCategoryPropertiesValue">
<el-input v-model="valueFormData.productCategoryPropertiesValue" placeholder="请输入分类属性值" clearable />
</el-form-item>
</el-form>
<template #footer>
<el-button @click="addProductCategoryPropertiesValue" type="primary" :disabled="formLoading">确 定</el-button>
<el-button @click="valueDialogVisible = false">取 消</el-button>
</template>
</Dialog>
<Dialog :title="dialogTitle" v-model="dialogVisible">
<el-form
ref="formRef"
:model="formData"
:rules="formRules"
label-width="100px"
v-loading="formLoading"
>
<el-form-item label="类别属性" prop="productCategoryPropertiesId"
v-show="false"
>
<el-input
v-model="formData.productCategoryPropertiesId"
placeholder="请输入类别属性"
clearable
/>
<el-form ref="formRef" :model="formData" :rules="formRules" label-width="100px" v-loading="formLoading">
<el-form-item label="分类属性" prop="productCategoryPropertiesId" v-show="false">
<el-input v-model="formData.productCategoryPropertiesId" placeholder="请输入分类属性" clearable />
</el-form-item>
<el-form-item label="类别属性" prop="productPropertiesCn">
<el-input
v-model="formData.productPropertiesCn"
placeholder="请输入类别属性"
clearable
disabled
/>
<el-form-item label="分类属性" prop="productPropertiesCn">
<el-input v-model="formData.productPropertiesCn" placeholder="请输入分类属性" clearable disabled />
</el-form-item>
<el-form-item label="产品分类" prop="productCategoryId" v-if="productPropertiesCategory===1">
<el-tree-select
v-model="formData.productCategoryId"
:data="productCategoryTree"
:props="defaultProps"
check-strictly
default-expand-all
placeholder="请选择上级编号"
/>
</el-form-item>
<el-form-item label="类别属性值" prop="productCategoryPropertiesValue" v-if="productPropertiesCategory===0">
<el-input v-model="formData.productCategoryPropertiesValue" placeholder="请输入类别属性值" />
<el-form-item label="产品分类" prop="productCategoryId" v-if="productPropertiesCategory === 1">
<el-tree-select v-model="formData.productCategoryId" :data="productCategoryTree" :props="defaultProps"
check-strictly default-expand-all placeholder="请选择上级编号" />
</el-form-item>
<el-row>
<el-col :span="21">
<el-form-item label="分类属性值" prop="productCategoryPropertiesValue" v-if="productPropertiesCategory === 0">
<el-select v-model="formData.productCategoryPropertiesValue" placeholder="请选择产品分类属性值" clearable>
<el-option v-for="dict in productCategoryPropertiesValueList" :key="dict.id"
:label="dict.productCategoryPropertiesValue" :value="dict.productCategoryPropertiesValue" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="1">
<span></span>
</el-col>
<el-col :span="1">
<el-button type="primary" @click="openValueForm">新 增</el-button>
</el-col>
</el-row>
</el-form>
<template #footer>
<el-button @click="submitForm" type="primary" :disabled="formLoading">确 定</el-button>
@ -46,9 +49,11 @@
</template>
<script setup lang="ts">
import { ProductCategoryPropertiesCategoryMapApi, ProductCategoryPropertiesCategoryMapVO } from '@/api/erp/product/category/productcategoryproperties/propertiescategorymap'
import { ProductCategoryApi,ProductCategoryVO} from '@/api/erp/product/category'
import { ProductCategoryApi } from '@/api/erp/product/category'
import { defaultProps, handleTree } from '@/utils/tree'
import { ProductCategoryPropertiesApi,ProductCategoryPropertiesVO } from '@/api/erp/product/category/productcategoryproperties'
import { ProductCategoryPropertiesApi } from '@/api/erp/product/category/productcategoryproperties'
import { ProductCategoryPropertiesValueApi, ProductCategoryPropertiesValueVO } from '@/api/erp/product/category/productcategoryproperties/productcategorypropertiesvalue'
/** 产品属性类别 */
let productPropertiesCategory = ref()
@ -57,7 +62,7 @@ let productPropertiesCategory = ref()
const productCategoryTree = ref() // 树形结构
/** 从父组件取数据*/
const props = defineProps<{
const props = defineProps<{
productPropertiesCn: string,
productCategoryPropertiesId: number,
}>();
@ -69,6 +74,16 @@ const { t } = useI18n() // 国际化
const message = useMessage() // 消息弹窗
const dialogVisible = ref(false) // 弹窗的是否展示
//分类属性值新增弹窗
const valueDialogVisible = ref(false) // 弹窗的是否展示
const valueFormData = ref({
productCategoryPropertiesValue: null as any
})
const valueFormRules = reactive({
productCategoryPropertiesValue: [
{ required: true, message: '请输入分类属性值', trigger: 'blur' },
]
})
const dialogTitle = ref('') // 弹窗的标题
const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
const formType = ref('') // 表单的类型：create - 新增；update - 修改
@ -82,12 +97,44 @@ const formData = ref({
const formRules = reactive({
})
const formRef = ref() // 表单 Ref
/** 分类属性值list */
const productCategoryPropertiesValueList = ref()
/** 新增分类属性值 */
const addProductCategoryPropertiesValue = async () => {
const data = {
productCategoryPropertiesId: props.productCategoryPropertiesId,
productCategoryPropertiesValue: valueFormData.value.productCategoryPropertiesValue
}
await ProductCategoryPropertiesValueApi.createProductCategoryPropertiesValue(data).then((res) => {
getAllProductCategoryPropertiesValue()
valueDialogVisible.value = false
message.success(t('common.createSuccess'))
})
}
/** 查询分类属性值的可选项 */
const getAllProductCategoryPropertiesValue = async () => {
await ProductCategoryPropertiesValueApi.getProductCategoryPropertiesValuePage({
pageNo: 1,
pageSize: 100,
productCategoryPropertiesId: props.productCategoryPropertiesId
}).then((res) => {
productCategoryPropertiesValueList.value = res.list
})
}
/** 判断使用下拉还是使用自定义属性 */
const getProductPropertiesCategory = async () => {
ProductCategoryPropertiesApi.getProductCategoryProperties(props.productCategoryPropertiesId).then((res) => {
productPropertiesCategory.value = res.productPropertiesCategory
})
ProductCategoryPropertiesApi.getProductCategoryProperties(props.productCategoryPropertiesId).then((res) => {
productPropertiesCategory.value = res.productPropertiesCategory
})
}
/** 打开分类属性值弹窗 */
const openValueForm = () => {
valueDialogVisible.value = true
}
/** 打开弹窗 */
const open = async (type: string, id?: number) => {
@ -98,6 +145,7 @@ const open = async (type: string, id?: number) => {
formData.value.productCategoryPropertiesId = props.productCategoryPropertiesId
formData.value.productPropertiesCn = props.productPropertiesCn
await getProductPropertiesCategory()
await getAllProductCategoryPropertiesValue()
getAllProductCategory()
// 修改时，设置数据
if (id) {
@ -139,18 +187,18 @@ const submitForm = async () => {
/** 重置表单 */
const resetForm = () => {
formData.value = {
id: undefined,
productPropertiesCn: null as any,
productCategoryId: undefined,
productCategoryPropertiesValue: undefined,
productCategoryPropertiesId: null as any
}
id: undefined,
productPropertiesCn: null as any,
productCategoryId: undefined,
productCategoryPropertiesValue: undefined,
productCategoryPropertiesId: null as any
}
formRef.value?.resetFields()
}
/** 获取所有产品分类 */
const getAllProductCategory = async () => {
productCategoryTree.value = []
productCategoryTree.value = []
const data = await ProductCategoryApi.getProductCategoryList({})
const root: Tree = { id: 0, name: '顶级产品分类', children: [] }
root.children = handleTree(data, 'id', 'parentId')

10
src/views/erp/product/category/propertiescategorymap/index.vue
View File

@ -8,10 +8,10 @@
:inline="true"
label-width="68px"
>
<el-form-item label="类别属性">
<el-form-item label="分类属性">
<el-input
v-model="productPropertiesCn"
placeholder="请输入类别属性"
placeholder="请输入分类属性"
clearable
disabled
@keyup.enter="handleQuery"
@ -59,7 +59,7 @@
<el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true">
<el-table-column label="编号" align="center" prop="id" />
<el-table-column label="产品分类" align="center" prop="productCategoryValue" />
<el-table-column label="类别属性值" align="center" prop="productCategoryPropertiesValue" />
<el-table-column label="分类属性值" align="center" prop="productCategoryPropertiesValue" />
<el-table-column
label="创建时间"
align="center"
@ -130,7 +130,7 @@ const queryParams = reactive({
})
const queryFormRef = ref() // 搜索的表单
const exportLoading = ref(false) // 导出的加载中
/** 类别属性中文 */
/** 分类属性中文 */
let productPropertiesCn = ref('')
/** 查询列表 */
@ -207,7 +207,7 @@ const searchProductCategoryProperties = async () => {
productPropertiesCn.value = res.productPropertiesCn
})
}catch (error) {
message.error('查询类别属性失败')
message.error('查询分类属性失败')
}
}