优化 下单动态属性配置
This commit is contained in:
parent
3920a5415d
commit
86f080e474
|
|
@ -1,21 +1,30 @@
|
|||
package cn.hangtag.framework.mybatis.build.where.handler;
|
||||
|
||||
|
||||
import cn.hangtag.framework.common.util.FuncUtil;
|
||||
import cn.hangtag.framework.mybatis.build.QueryConfigUtils;
|
||||
import cn.hangtag.framework.mybatis.build.WrapperInfo;
|
||||
import cn.hangtag.framework.mybatis.build.enums.QueryFilterTypeEnum;
|
||||
import cn.hangtag.framework.mybatis.build.where.WhereWrapper;
|
||||
import com.baomidou.mybatisplus.core.conditions.query.QueryWrapper;
|
||||
|
||||
import java.util.Collection;
|
||||
import java.util.Collections;
|
||||
import java.util.List;
|
||||
public class InHandler<T> implements WhereWrapper<T> {
|
||||
@Override
|
||||
public QueryFilterTypeEnum getType() {
|
||||
return QueryFilterTypeEnum.IN;
|
||||
}
|
||||
|
||||
@Override
|
||||
public QueryWrapper<T> handler(WrapperInfo<T> wrapperInfo) {
|
||||
return wrapperInfo.getQueryWrapper().in(wrapperInfo.getField(), wrapperInfo.getValue());
|
||||
}
|
||||
public class InHandler<T> implements WhereWrapper<T> {
|
||||
@Override
|
||||
public QueryFilterTypeEnum getType() {
|
||||
return QueryFilterTypeEnum.IN;
|
||||
}
|
||||
|
||||
@Override
|
||||
public QueryWrapper<T> handler(WrapperInfo<T> wrapperInfo) {
|
||||
Object value = wrapperInfo.getValue();
|
||||
if (value instanceof Collection) {
|
||||
return wrapperInfo.getQueryWrapper().in(wrapperInfo.getField(),(Collection)value);
|
||||
}
|
||||
value = FuncUtil.toStrList(FuncUtil.toStr(value));
|
||||
return wrapperInfo.getQueryWrapper().in(wrapperInfo.getField(),value);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,5 +1,6 @@
|
|||
package cn.hangtag.module.oms.controller.admin.productcareitem;
|
||||
|
||||
import cn.hangtag.framework.mybatis.build.QueryFilterInfo;
|
||||
import org.springframework.web.bind.annotation.*;
|
||||
import javax.annotation.Resource;
|
||||
import org.springframework.validation.annotation.Validated;
|
||||
|
|
@ -88,6 +89,12 @@ public class ProductCareItemController {
|
|||
PageResult<ProductCareItemDO> pageResult = productCareItemService.queryList(pageReqVO);
|
||||
return success(BeanUtils.toBean(pageResult, ProductCareItemRespVO.class));
|
||||
}
|
||||
@PostMapping("/query")
|
||||
@Operation(summary = "查询洗水对照项目 分页")
|
||||
public CommonResult<PageResult<ProductCareItemRespVO>> queryPage(@RequestBody QueryFilterInfo<ProductCareItemPageReqVO> pageReqVO) {
|
||||
PageResult<ProductCareItemDO> pageResult = productCareItemService.queryPage(pageReqVO);
|
||||
return success(BeanUtils.toBean(pageResult, ProductCareItemRespVO.class));
|
||||
}
|
||||
|
||||
@GetMapping("/export-excel")
|
||||
@Operation(summary = "导出产品保养项 Excel")
|
||||
|
|
|
|||
|
|
@ -2,11 +2,15 @@ package cn.hangtag.module.oms.dal.mysql.productcareitem;
|
|||
|
||||
import java.util.*;
|
||||
|
||||
import cn.hangtag.framework.common.pojo.PageParam;
|
||||
import cn.hangtag.framework.common.pojo.PageResult;
|
||||
import cn.hangtag.framework.common.util.FuncUtil;
|
||||
import cn.hangtag.framework.mybatis.build.MybatisPlusUtil;
|
||||
import cn.hangtag.framework.mybatis.build.QueryFilterInfo;
|
||||
import cn.hangtag.framework.mybatis.core.query.LambdaQueryWrapperX;
|
||||
import cn.hangtag.framework.mybatis.core.mapper.BaseMapperX;
|
||||
import cn.hangtag.module.oms.dal.dataobject.productcareitem.ProductCareItemDO;
|
||||
import com.baomidou.mybatisplus.core.conditions.query.QueryWrapper;
|
||||
import org.apache.ibatis.annotations.Mapper;
|
||||
import cn.hangtag.module.oms.controller.admin.productcareitem.vo.*;
|
||||
|
||||
|
|
@ -46,7 +50,7 @@ public interface ProductCareItemMapper extends BaseMapperX<ProductCareItemDO> {
|
|||
.betweenIfPresent(ProductCareItemDO::getCreateTime, reqVO.getCreateTime())
|
||||
.orderByDesc(ProductCareItemDO::getId);
|
||||
String brandIds = reqVO.getBrandIds();
|
||||
if(FuncUtil.isNotEmpty(reqVO.getType())){
|
||||
if (FuncUtil.isNotEmpty(reqVO.getType())) {
|
||||
String[] split = reqVO.getType().split(",");
|
||||
List<Long> types = new ArrayList<>();
|
||||
for (String s : split) {
|
||||
|
|
@ -55,7 +59,7 @@ public interface ProductCareItemMapper extends BaseMapperX<ProductCareItemDO> {
|
|||
queryWrapperX.in(ProductCareItemDO::getType, types);
|
||||
}
|
||||
if (brandIds != null && !brandIds.isEmpty()) {
|
||||
queryWrapperX.and(w ->{
|
||||
queryWrapperX.and(w -> {
|
||||
String[] split = brandIds.split(",");
|
||||
List<Long> brandIdList = new ArrayList<>();
|
||||
for (String s : split) {
|
||||
|
|
@ -64,10 +68,18 @@ public interface ProductCareItemMapper extends BaseMapperX<ProductCareItemDO> {
|
|||
w.eq(ProductCareItemDO::getIsAll, reqVO.getIsAll());
|
||||
w.or().in(ProductCareItemDO::getBrandIds, brandIdList);
|
||||
});
|
||||
}else {
|
||||
} else {
|
||||
queryWrapperX.eqIfPresent(ProductCareItemDO::getIsAll, true);
|
||||
}
|
||||
return selectPage(reqVO, queryWrapperX);
|
||||
}
|
||||
|
||||
default PageResult<ProductCareItemDO> selectPagePlus(QueryFilterInfo<ProductCareItemPageReqVO> queryFilterInfo) {
|
||||
PageParam pager = queryFilterInfo.getPager();
|
||||
QueryWrapper<ProductCareItemDO> queryWrapper = MybatisPlusUtil
|
||||
.parseQuery(queryFilterInfo, true, ProductCareItemDO.class,
|
||||
"pageNo", "pageSize", "PAGE_NO", "PAGE_SIZE", "PAGE_SIZE_NONE");
|
||||
PageResult<ProductCareItemDO> res = selectPage(pager, queryWrapper);
|
||||
return res;
|
||||
}
|
||||
}
|
||||
|
|
@ -2,6 +2,8 @@ package cn.hangtag.module.oms.service.productcareitem;
|
|||
|
||||
import java.util.*;
|
||||
import javax.validation.*;
|
||||
|
||||
import cn.hangtag.framework.mybatis.build.QueryFilterInfo;
|
||||
import cn.hangtag.module.oms.controller.admin.productcareitem.vo.*;
|
||||
import cn.hangtag.module.oms.dal.dataobject.productcareitem.ProductCareItemDO;
|
||||
import cn.hangtag.framework.common.pojo.PageResult;
|
||||
|
|
@ -53,4 +55,12 @@ public interface ProductCareItemService {
|
|||
PageResult<ProductCareItemDO> getProductCareItemPage(ProductCareItemPageReqVO pageReqVO);
|
||||
PageResult<ProductCareItemDO> queryList(ProductCareItemPageReqVO pageReqVO);
|
||||
|
||||
/**
|
||||
* 查询页
|
||||
*
|
||||
* @param pageReqVO 页面请求 vo
|
||||
* @return {@link PageResult }<{@link ProductCareItemDO }>
|
||||
*/
|
||||
PageResult<ProductCareItemDO> queryPage(QueryFilterInfo<ProductCareItemPageReqVO> pageReqVO);
|
||||
|
||||
}
|
||||
|
|
@ -1,5 +1,6 @@
|
|||
package cn.hangtag.module.oms.service.productcareitem;
|
||||
|
||||
import cn.hangtag.framework.mybatis.build.QueryFilterInfo;
|
||||
import org.springframework.stereotype.Service;
|
||||
import javax.annotation.Resource;
|
||||
import org.springframework.validation.annotation.Validated;
|
||||
|
|
@ -75,4 +76,12 @@ public class ProductCareItemServiceImpl implements ProductCareItemService {
|
|||
public PageResult<ProductCareItemDO> queryList(ProductCareItemPageReqVO pageReqVO) {
|
||||
return productCareItemMapper.queryPage(pageReqVO);
|
||||
}
|
||||
|
||||
@Override
|
||||
public PageResult<ProductCareItemDO> queryPage(QueryFilterInfo<ProductCareItemPageReqVO> queryFilterInfo) {
|
||||
PageResult<ProductCareItemDO> productInfoDOPageResult = productCareItemMapper.selectPagePlus(queryFilterInfo);
|
||||
List<ProductCareItemDO> list = productInfoDOPageResult.getList();
|
||||
productInfoDOPageResult.setList(list);
|
||||
return productInfoDOPageResult;
|
||||
}
|
||||
}
|
||||
|
|
@ -22,7 +22,9 @@ export const ProductCareItemApi = {
|
|||
queryList: async (params: any) => {
|
||||
return await request.get({ url: `/oms/product-care-item/list`, params })
|
||||
},
|
||||
|
||||
queryPage: async (params: any) => {
|
||||
return await request.post({ url: `/oms/product-care-item/query`, data:{...params} })
|
||||
},
|
||||
// 查询产品保养项 详情
|
||||
getProductCareItem: async (id: number) => {
|
||||
return await request.get({ url: `/oms/product-care-item/get?id=` + id })
|
||||
|
|
|
|||
|
|
@ -8,13 +8,18 @@
|
|||
append-to-body
|
||||
@close="updateVisible(false)">
|
||||
<div v-loading="that.loading">
|
||||
<DesignPropEdit ref="designPropEditRef" />
|
||||
<DesignPropEdit ref="designPropEditRef"/>
|
||||
</div>
|
||||
<template #footer>
|
||||
<span class="dialog-footer">
|
||||
<el-button @click="updateVisible(false)">{{t("designInfo.cancelText")}}</el-button>
|
||||
<el-button type="primary" @click="submit">{{ t("designInfo.auditSubmitText") }}</el-button>
|
||||
</span>
|
||||
<div style="display: flex;flex-direction: column;align-items: center">
|
||||
<div>
|
||||
<el-button @click="updateVisible(false)">{{ t("designInfo.cancelText") }}</el-button>
|
||||
<el-button type="primary" @click="submit">{{
|
||||
t("designInfo.auditSubmitText")
|
||||
}}
|
||||
</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</Dialog>
|
||||
</template>
|
||||
|
|
@ -24,47 +29,48 @@ import {ElAlert} from "element-plus";
|
|||
import {reactive, computed, watch} from 'vue'
|
||||
import {calculateVectorDifference} from "@/components/DraftDesign/utils/FuncUtil";
|
||||
import {useMessage} from "@/hooks/web/useMessage";
|
||||
import { useI18n } from 'vue-i18n'
|
||||
const { t } = useI18n()
|
||||
import {useI18n} from 'vue-i18n'
|
||||
|
||||
const {t} = useI18n()
|
||||
const emit = defineEmits(['update:visible', 'submit'])
|
||||
const designPropEditRef = ref();
|
||||
const that = reactive({
|
||||
previewVisible: false,
|
||||
loading: false,
|
||||
})
|
||||
const updateVisible = (visible)=>{
|
||||
const updateVisible = (visible) => {
|
||||
that.previewVisible = visible;
|
||||
}
|
||||
const preview = (config,prop={})=>{
|
||||
const preview = (config, prop = {}) => {
|
||||
updateVisible(true);
|
||||
that.loading = true;
|
||||
setTimeout(()=>{
|
||||
designPropEditRef.value.loadConfig(config,prop);
|
||||
setTimeout(() => {
|
||||
designPropEditRef.value.loadConfig(config, prop);
|
||||
that.loading = false;
|
||||
},100)
|
||||
}, 100)
|
||||
}
|
||||
// 预览产品id
|
||||
const previewByProductId = (id: string | number,prop={})=>{
|
||||
const previewByProductId = (id: string | number, prop = {}) => {
|
||||
updateVisible(true);
|
||||
that.loading = true;
|
||||
setTimeout(()=>{
|
||||
designPropEditRef.value.previewByProductId(id,prop);
|
||||
setTimeout(() => {
|
||||
designPropEditRef.value.previewByProductId(id, prop);
|
||||
that.loading = false;
|
||||
},100)
|
||||
}, 100)
|
||||
}
|
||||
// 预览草稿设计id
|
||||
const previewByDraftDesignId = (id: string | number,prop={})=>{
|
||||
const previewByDraftDesignId = (id: string | number, prop = {}) => {
|
||||
updateVisible(true);
|
||||
that.loading = true;
|
||||
setTimeout(()=>{
|
||||
designPropEditRef.value.previewByDraftDesignId(config,prop);
|
||||
setTimeout(() => {
|
||||
designPropEditRef.value.previewByDraftDesignId(config, prop);
|
||||
that.loading = false;
|
||||
},100)
|
||||
}, 100)
|
||||
}
|
||||
const submit = ()=>{
|
||||
const submit = () => {
|
||||
useMessage().confirm(t('designInfo.auditTips')).then(async (r) => {
|
||||
const res = await designPropEditRef.value.getPropInfo()
|
||||
emit("submit",res);
|
||||
emit("submit", res);
|
||||
updateVisible(false)
|
||||
})
|
||||
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load Diff
|
|
@ -1,119 +1,139 @@
|
|||
<template>
|
||||
<el-dialog
|
||||
v-model="that.show"
|
||||
title="动态属性配置"
|
||||
width="60vw"
|
||||
top="2%"
|
||||
draggable
|
||||
append-to-body
|
||||
@close="updateVisible(false)">
|
||||
<div style="width: 100%; max-height: 75vh">
|
||||
<el-alert
|
||||
title="动态属性配置说明"
|
||||
type="info"
|
||||
:closable="false"
|
||||
show-icon
|
||||
style="margin-bottom: 10px"
|
||||
>
|
||||
"位置信息配置为节点的位置信息。如:添加了3个配置数据这时会依次添加到对应位置上。从而实现动态属性配置。"
|
||||
</el-alert>
|
||||
<el-form>
|
||||
<el-row style="min-width: 900px">
|
||||
<el-col :span="6" :xs="12">
|
||||
<el-form-item label="组名称">
|
||||
<el-input v-model="that.configInfo.groupName" placeholder="请输入组名称"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="6" :xs="12">
|
||||
<el-form-item label="组id">
|
||||
<el-input v-model="that.configInfo.groupId" disabled/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-form-item label="保养类型" >
|
||||
<el-select v-model="that.configInfo.groupType" :disabled="that.configInfo.isCombo">
|
||||
<el-option
|
||||
v-for="dict in getStrDictOptions(DICT_TYPE.OMS_PRODUCT_CARE_ITEM_TYPE)"
|
||||
:key="`${dict.value}`"
|
||||
:label="dict.label"
|
||||
:value="dict.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<!-- 停用 -->
|
||||
<el-form-item label="控制" >
|
||||
<div style="width: 800px">
|
||||
<el-row>
|
||||
<el-col :span="6">
|
||||
<div style="width: 120px;display: flex">
|
||||
<el-checkbox
|
||||
v-model="that.configInfo.canChange">
|
||||
<span>允许调整数量</span>
|
||||
</el-checkbox>
|
||||
</div>
|
||||
<div>
|
||||
<SortDialog ref="sortDialogRef" @list-change="langSortChange"/>
|
||||
<el-dialog
|
||||
v-model="that.show"
|
||||
title="动态属性配置"
|
||||
width="60vw"
|
||||
top="2%"
|
||||
draggable
|
||||
append-to-body
|
||||
:close-on-click-modal="false"
|
||||
@close="updateVisible(false)">
|
||||
<div style="width: 100%; max-height: 75vh">
|
||||
<el-alert
|
||||
title="动态属性配置说明"
|
||||
type="info"
|
||||
:closable="false"
|
||||
show-icon
|
||||
style="margin-bottom: 10px"
|
||||
>
|
||||
"位置信息配置为节点的位置信息。如:添加了3个配置数据这时会依次添加到对应位置上。从而实现动态属性配置。"
|
||||
</el-alert>
|
||||
<el-form>
|
||||
<el-row style="min-width: 900px">
|
||||
<el-col :span="6" :xs="12">
|
||||
<el-form-item label="组名称">
|
||||
<el-input v-model="that.configInfo.groupName" placeholder="请输入组名称"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="6" :xs="12">
|
||||
<el-form-item label="组id">
|
||||
<el-input v-model="that.configInfo.groupId" disabled/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-form-item label="护理类型">
|
||||
<el-select v-model="that.configInfo.groupType" :disabled="that.configInfo.isCombo">
|
||||
<el-option
|
||||
v-for="dict in getStrDictOptions(DICT_TYPE.OMS_PRODUCT_CARE_ITEM_TYPE)"
|
||||
:key="`${dict.value}`"
|
||||
:label="dict.label"
|
||||
:value="dict.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<!-- 停用 -->
|
||||
<el-form-item label="控制">
|
||||
<div style="width: 800px">
|
||||
<el-row>
|
||||
<el-col :span="6">
|
||||
<div style="width: 120px;display: flex">
|
||||
<el-checkbox
|
||||
v-model="that.configInfo.canChange">
|
||||
<span>允许调整数量</span>
|
||||
</el-checkbox>
|
||||
</div>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="6">
|
||||
<div style="width: 120px;display: flex">
|
||||
<el-checkbox :disabled="disableInput"
|
||||
v-model="that.configInfo.canInput">
|
||||
<span>允许输入值</span>
|
||||
</el-checkbox>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-tooltip
|
||||
content="输入多个变量时的连接字符,使用<br/> 变量进行换行"
|
||||
>
|
||||
<div style="display:flex;">
|
||||
<div>变量链接符</div>
|
||||
<div>
|
||||
<el-input v-model="that.configInfo.linkChar" clearable maxlength="6" placeholder="请输入连接符" show-word-limit />
|
||||
<el-col :span="6">
|
||||
<div style="width: 120px;display: flex">
|
||||
<el-checkbox :disabled="disableInput"
|
||||
v-model="that.configInfo.canInput">
|
||||
<span>允许输入值</span>
|
||||
</el-checkbox>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-tooltip
|
||||
content="输入多个变量时的连接字符,使用<br/> 变量进行换行"
|
||||
>
|
||||
<div style="display:flex;">
|
||||
<div>变量链接符</div>
|
||||
<div>
|
||||
<el-input v-model="that.configInfo.linkChar" clearable maxlength="6"
|
||||
placeholder="请输入连接符" show-word-limit/>
|
||||
</div>
|
||||
<el-button @click="that.configInfo.linkChar = '<br/>'">换行</el-button>
|
||||
</div>
|
||||
<el-button @click="that.configInfo.linkChar = '<br/>'">换行</el-button>
|
||||
</div>
|
||||
</el-tooltip>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-form-item label="数量">
|
||||
<el-row>
|
||||
<el-col :span="11">
|
||||
min
|
||||
<el-input-number
|
||||
v-model="that.configInfo.minSize"
|
||||
:min="1"
|
||||
:max="that.configInfo.maxSize"
|
||||
:disabled="that.configInfo.shape"/>
|
||||
</el-col>
|
||||
<el-col :span="11">
|
||||
max
|
||||
<el-input-number
|
||||
v-model="that.configInfo.maxSize" :min="that.configInfo.shape ? 3 : 1"/>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form-item>
|
||||
<el-form-item label="位置信息">
|
||||
</el-tooltip>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-form-item label="数量">
|
||||
<el-row>
|
||||
<el-col :span="11">
|
||||
min
|
||||
<el-input-number
|
||||
v-model="that.configInfo.minSize"
|
||||
:min="1"
|
||||
:max="that.configInfo.maxSize"
|
||||
:disabled="that.configInfo.shape"/>
|
||||
</el-col>
|
||||
<el-col :span="11">
|
||||
max
|
||||
<el-input-number
|
||||
v-model="that.configInfo.maxSize" :min="that.configInfo.shape ? 3 : 1"/>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form-item>
|
||||
<el-form-item label="位置信息">
|
||||
|
||||
<div style="display: flex;flex-direction: column">
|
||||
<div>
|
||||
<el-checkbox v-model="that.configInfo.multiLanguage">多语言对照,开启后语言匹配到对应位置上</el-checkbox>
|
||||
</div>
|
||||
<div v-if="!that.configInfo.isCombo && that.configInfo.pointList.length > 1">
|
||||
<el-button @click="append(1)">追加</el-button>
|
||||
<el-button @click="append(10)">追加10个</el-button>
|
||||
<el-button type="danger" @click="delLast">删除</el-button>
|
||||
</div>
|
||||
<div v-else-if="!that.configInfo.isCombo">
|
||||
<span style="font-size: 0.8rem;color: #7c7b7b">两个或者以上允许追加更多位置信息</span>
|
||||
</div>
|
||||
<div style="display: flex;flex-direction: column">
|
||||
<div>
|
||||
<el-checkbox v-model="that.configInfo.multiLanguage">勾选后语言匹配到对应位置上
|
||||
</el-checkbox>
|
||||
<el-select
|
||||
v-show="!that.configInfo.multiLanguage"
|
||||
filterable
|
||||
multiple
|
||||
v-model="that.configInfo.langSort"
|
||||
placeholder="可多选语言参与拼接为一句话,和排序">
|
||||
<el-option
|
||||
v-for="dict in getStrDictOptions(DICT_TYPE.LANGUAGE_LOCALE)"
|
||||
:key="dict.value"
|
||||
:label="dict.label"
|
||||
:value="dict.value"
|
||||
/>
|
||||
</el-select>
|
||||
<el-button v-show="that.configInfo.langSort && that.configInfo.langSort.length > 0" @click="setLangSort">语言排序</el-button>
|
||||
</div>
|
||||
<div v-if="!that.configInfo.isCombo && that.configInfo.pointList.length > 1">
|
||||
<el-button @click="append(1)">追加</el-button>
|
||||
<el-button @click="append(10)">追加10个</el-button>
|
||||
<el-button type="danger" @click="delLast">删除</el-button>
|
||||
</div>
|
||||
<div v-else-if="!that.configInfo.isCombo">
|
||||
<span
|
||||
style="font-size: 0.8rem;color: #7c7b7b">两个或者以上允许追加更多位置信息</span>
|
||||
</div>
|
||||
<el-table :data="that.configInfo.pointList" style=" box-shadow: 2px 0 0 1px #eee; ">
|
||||
<el-table-column label="序号" width="60">
|
||||
<template #default="scope">
|
||||
<span>{{ scope.$index + 1 }}</span>
|
||||
<span v-if="that.configInfo.isCombo" style="padding-right: 4px">
|
||||
{{scope.$index !== 0 ? '' : '-icon' }}
|
||||
{{ scope.$index !== 0 ? '' : '-icon' }}
|
||||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
|
@ -129,7 +149,8 @@
|
|||
</el-table-column>
|
||||
<el-table-column label="语言" width="180" v-if="that.configInfo.multiLanguage">
|
||||
<template #default="scope">
|
||||
<el-select v-model="that.configInfo.pointList[scope.$index].dataInfo.locale" placeholder="请选择语言标识">
|
||||
<el-select v-model="that.configInfo.pointList[scope.$index].dataInfo.locale"
|
||||
placeholder="请选择语言标识">
|
||||
<el-option
|
||||
v-for="dict in languageOptions"
|
||||
:key="`${dict.value}`"
|
||||
|
|
@ -142,7 +163,8 @@
|
|||
<el-table-column label="文本" width="180">
|
||||
<template #default="scope">
|
||||
<div>
|
||||
<div v-if="that.configInfo.pointList[scope.$index].dataInfo.locale === '_$value'">
|
||||
<div
|
||||
v-if="that.configInfo.pointList[scope.$index].dataInfo.locale === '_$value'">
|
||||
表达式
|
||||
</div>
|
||||
<div v-else>
|
||||
|
|
@ -153,7 +175,7 @@
|
|||
placement="top"
|
||||
>
|
||||
<span class="line-clamp-1">
|
||||
{{ that.configInfo.pointList[scope.$index].dataInfo.label}}
|
||||
{{ that.configInfo.pointList[scope.$index].dataInfo.label }}
|
||||
</span>
|
||||
</el-tooltip>
|
||||
</div>
|
||||
|
|
@ -162,17 +184,18 @@
|
|||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<template #footer>
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<template #footer>
|
||||
<span class="dialog-footer">
|
||||
<el-button @click="updateVisible(false)">取消</el-button>
|
||||
<el-button type="primary" @click="submit">确定</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup name="DynamicPropConfig">
|
||||
|
|
@ -185,24 +208,25 @@ import {ShapeType} from "../config";
|
|||
// 动态属性配置
|
||||
|
||||
const emit = defineEmits(['update:visible', 'submit'])
|
||||
|
||||
const sortDialogRef = ref();
|
||||
const that = reactive({
|
||||
allGroupList: [],
|
||||
show: false,
|
||||
configInfo: {
|
||||
groupName: '', // 父节点名称
|
||||
groupType: '1',
|
||||
isCombo: false, // 是否是组合节点
|
||||
multiLanguage: true, // 是否使用多语言
|
||||
minSize: 1,
|
||||
maxSize: 100,
|
||||
canChange: false,
|
||||
canInput: false,
|
||||
linkChar: ',',
|
||||
cellIds: [], // 节点id
|
||||
groupType: '1', // 组合类型
|
||||
groupId: `g_${Math.random().toString(36).substring(2)}`,
|
||||
isCombo: false, // 是否是组合节点
|
||||
multiLanguage: true, // 是否使用多语言 true 为多语言对应到指定位置上,false 为将语言组合成一句话
|
||||
langSort: [], // 多语言 组合成一句话的 排序
|
||||
minSize: 1, // 节点组最小数量
|
||||
maxSize: 100, // 节点组最大数量
|
||||
canChange: false, // 是否允许调整数量
|
||||
canInput: false,// 是否允许输入值
|
||||
linkChar: ',',// 连接字符
|
||||
cellIds: [], // 节点id
|
||||
data: {}, //节点是数据
|
||||
shape: '', // 是否是图片
|
||||
shape: '', // 节点类型
|
||||
pointList: [], //{ x:10,y:100}
|
||||
}
|
||||
})
|
||||
|
|
@ -212,11 +236,11 @@ const props = defineProps({
|
|||
default: false
|
||||
}
|
||||
})
|
||||
const languageOptions = computed(()=>{
|
||||
const languageOptions = computed(() => {
|
||||
|
||||
const options = getStrDictOptions(DICT_TYPE.LANGUAGE_LOCALE);
|
||||
// @ts-ignore
|
||||
options.unshift({ label: '*取值表达式', value: '_$value' })
|
||||
options.unshift({label: '*取值表达式', value: '_$value'})
|
||||
return options
|
||||
})
|
||||
const delLast = () => {
|
||||
|
|
@ -227,7 +251,7 @@ const delLast = () => {
|
|||
that.configInfo.pointList.pop()
|
||||
useMessage().success(`成功删除1个位置信息`)
|
||||
}
|
||||
const disableInput = computed(()=>{
|
||||
const disableInput = computed(() => {
|
||||
return that.configInfo.shape === ShapeType.vueShapeImage
|
||||
})
|
||||
const appendNode = () => {
|
||||
|
|
@ -256,14 +280,15 @@ const append = (count = 1) => {
|
|||
}
|
||||
const init = (allGroupList, data) => {
|
||||
that.allGroupList = allGroupList;
|
||||
console.log("that.allGroupList",that.allGroupList)
|
||||
console.log("data",data)
|
||||
console.log("that.allGroupList", that.allGroupList)
|
||||
console.log("data", data)
|
||||
that.configInfo = {
|
||||
groupName: '', // 父节点名称
|
||||
groupType: '1',
|
||||
groupId: `g_${Math.random().toString(36).substring(2)}`,
|
||||
isCombo: false, // 是否是组合节点
|
||||
multiLanguage: true, // 是否使用多语言
|
||||
multiLanguage: true, // 是否使用多语言 true 为多语言对应到指定位置上,false 为将语言组合成一句话
|
||||
langSort: [], // 多语言 组合成一句话的 排序
|
||||
minSize: 1, // 节点组最小数量
|
||||
maxSize: 100, // 节点组最大数量
|
||||
canChange: false, // 是否允许调整数量
|
||||
|
|
@ -280,12 +305,19 @@ const updateVisible = (value: boolean) => {
|
|||
that.show = value;
|
||||
}
|
||||
const getConfig = () => {
|
||||
console.log("that.configInfo",that.configInfo)
|
||||
console.log("that.configInfo", that.configInfo)
|
||||
return that.configInfo;
|
||||
}
|
||||
const submit = () => {
|
||||
emit('submit', getConfig())
|
||||
}
|
||||
const setLangSort = () => {
|
||||
sortDialogRef.value.init(that.configInfo.langSort)
|
||||
sortDialogRef.value.show();
|
||||
}
|
||||
const langSortChange = (val) => {
|
||||
that.configInfo.langSort = val;
|
||||
}
|
||||
onMounted(() => {
|
||||
})
|
||||
defineExpose({
|
||||
|
|
|
|||
|
|
@ -0,0 +1,149 @@
|
|||
<template>
|
||||
|
||||
<div>
|
||||
<el-dialog
|
||||
v-model="that.showOrderByDialog"
|
||||
draggable
|
||||
append-to-body
|
||||
width="50vw"
|
||||
:close-on-click-modal="false"
|
||||
>
|
||||
<template #title>
|
||||
<div>
|
||||
{{ title }}
|
||||
</div>
|
||||
</template>
|
||||
<template #default>
|
||||
<div>
|
||||
<div>
|
||||
<div v-html="tips"></div>
|
||||
</div>
|
||||
|
||||
<Draggable
|
||||
style="display: flex; flex-direction: column; align-items: center;"
|
||||
ghost-class="draggable-ghost"
|
||||
item-key="_$key"
|
||||
@change="propListChange"
|
||||
handler=".order-by-item"
|
||||
:list="that.propList"
|
||||
:group="{ name: 'sortItem'}"
|
||||
:animation="200"
|
||||
>
|
||||
<template #item="{ element,index }">
|
||||
<div class="order-by-item">
|
||||
<span style="padding: 4px">{{ index + 1 }}</span>
|
||||
<span style="padding: 4px;">{{ showLabel(element) }}</span>
|
||||
</div>
|
||||
</template>
|
||||
</Draggable>
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
|
||||
</div>
|
||||
|
||||
</template>
|
||||
<script setup lang="ts" name="SortDialog">
|
||||
|
||||
import {nextId} from "@/components/DraftDesign/utils/FuncUtil";
|
||||
import Draggable from 'vuedraggable'
|
||||
import '../icons/style.css'
|
||||
|
||||
const props = defineProps({
|
||||
title: {
|
||||
type: String,
|
||||
default: '排序'
|
||||
},
|
||||
tips: {
|
||||
type: String,
|
||||
default: '拖动可排序'
|
||||
}
|
||||
})
|
||||
const emit = defineEmits(['listChange'])
|
||||
const that = reactive({
|
||||
propList: [],
|
||||
showKey: '',
|
||||
showOrderByDialog: false,
|
||||
isString: false,
|
||||
})
|
||||
const propListChange = () => {
|
||||
let res = []
|
||||
let arr =JSON.parse( JSON.stringify(that.propList))
|
||||
if(that.isString){
|
||||
arr.forEach(item => {
|
||||
res.push(item.label)
|
||||
})
|
||||
}else {
|
||||
arr.forEach(item => {
|
||||
//删除 _$key
|
||||
delete item._$key
|
||||
res.push(item)
|
||||
})
|
||||
}
|
||||
|
||||
emit('listChange', that.propList)
|
||||
}
|
||||
let showLabel = (el) => {
|
||||
return el;
|
||||
}
|
||||
const show = () => {
|
||||
that.showOrderByDialog = true
|
||||
}
|
||||
const close = () => {
|
||||
that.showOrderByDialog = false
|
||||
}
|
||||
const init = (arr, showFunc = (el) => {
|
||||
return el;
|
||||
}) => {
|
||||
// 深拷贝
|
||||
that.propList = JSON.parse(JSON.stringify([...(arr || [])]));
|
||||
// 给每个元素添加一个 key
|
||||
that.propList.forEach(item => {
|
||||
console.log(item)
|
||||
if(typeof item === 'string'){
|
||||
item = {
|
||||
_$key: nextId(),
|
||||
label: item
|
||||
}
|
||||
that.isString = true
|
||||
}else {
|
||||
item['_$key'] = nextId()
|
||||
}
|
||||
|
||||
})
|
||||
showLabel = showFunc || showLabel
|
||||
}
|
||||
defineExpose({
|
||||
init,
|
||||
show,
|
||||
close
|
||||
})
|
||||
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
@import "./layout/fontFamilyIcon.scss";
|
||||
|
||||
.draggable-ghost {
|
||||
background-color: rgba(39, 255, 169, 0.2);
|
||||
outline-width: 0;
|
||||
height: 38px;
|
||||
box-sizing: border-box;
|
||||
font-size: 0;
|
||||
content: '';
|
||||
overflow: hidden;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.order-by-item:hover {
|
||||
cursor: move;
|
||||
}
|
||||
|
||||
.order-by-item {
|
||||
margin: 6px;
|
||||
border: 1px solid #8e8b8b;
|
||||
width: 100%;
|
||||
padding: 10px
|
||||
}
|
||||
|
||||
</style>
|
||||
|
|
@ -0,0 +1,11 @@
|
|||
|
||||
// 成分比例 1
|
||||
// 图文说明 2
|
||||
// 文字说明 3
|
||||
// 尺码 4
|
||||
export enum GroupTypeEnum {
|
||||
RATIO = '1',
|
||||
ICON = '2',
|
||||
TEXT = '3',
|
||||
SIZE = '4'
|
||||
}
|
||||
|
|
@ -1159,6 +1159,7 @@ const getJson = () => {
|
|||
let canChange = prop.canChange === undefined ? false : prop.canChange;
|
||||
let canInput = prop.canInput === undefined ? false : prop.canInput;
|
||||
let linkChar = prop.linkChar === undefined ? ',' : prop.linkChar;
|
||||
let langSort = prop.langSort === undefined ? [] : prop.langSort;
|
||||
|
||||
if (combo) {
|
||||
min = Math.min(dataInfoList.length,min);
|
||||
|
|
@ -1178,6 +1179,7 @@ const getJson = () => {
|
|||
canChange: canChange,
|
||||
canInput: canInput,
|
||||
linkChar: linkChar,
|
||||
langSort: langSort,
|
||||
shape: prop.shape,
|
||||
dataInfo: dataInfoList
|
||||
}
|
||||
|
|
@ -1454,11 +1456,12 @@ const handlerGroupList = (cells, isCombo = false, min, max) => {
|
|||
let canChange = false;
|
||||
let canInput = false;
|
||||
let linkChar = ',';
|
||||
let langSort = [];
|
||||
for (let i = 0; i < that.pageConfig.propList.length; i++) {
|
||||
if (that.pageConfig.propList[i].groupId === cells[0].getData().propGroupId) {
|
||||
canChange = that.pageConfig.propList[i].canChange === true
|
||||
canInput = that.pageConfig.propList[i].canInput === true
|
||||
linkChar = that.pageConfig.propList[i].linkChar || ','
|
||||
langSort = that.pageConfig.propList[i].langSort || []
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
|
@ -1473,6 +1476,7 @@ const handlerGroupList = (cells, isCombo = false, min, max) => {
|
|||
maxSize: max,
|
||||
canChange: canChange,
|
||||
canInput: canInput,
|
||||
langSort: langSort,
|
||||
linkChar: linkChar,
|
||||
data: info.data, //节点是数据
|
||||
shape: info.shape,
|
||||
|
|
|
|||
|
|
@ -21,7 +21,16 @@
|
|||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :xs="24" :span="8">
|
||||
<el-select v-model="queryParams.type" clearable multiple>
|
||||
<el-option
|
||||
v-for="dict in getStrDictOptions(DICT_TYPE.OMS_PRODUCT_CARE_ITEM_TYPE)"
|
||||
:key="`${dict.value}`"
|
||||
:label="dict.label"
|
||||
:value="dict.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-col>
|
||||
<el-col :xs="24" :span="8">
|
||||
<el-form-item label="启用状态" prop="enabled">
|
||||
<el-select
|
||||
|
|
@ -131,13 +140,14 @@ import { dateFormatter } from '@/utils/formatTime'
|
|||
import download from '@/utils/download'
|
||||
import { ProductCareItemApi, ProductCareItemVO } from '@/api/oms/productcareitem'
|
||||
import ProductCareItemForm from './ProductCareItemForm.vue'
|
||||
import {buildQuery} from "@/utils/queryUtil";
|
||||
|
||||
/** 产品保养项 列表 */
|
||||
defineOptions({ name: 'ProductCareItem' })
|
||||
|
||||
const message = useMessage() // 消息弹窗
|
||||
const { t } = useI18n() // 国际化
|
||||
|
||||
const route = useRoute() // 路由
|
||||
const loading = ref(true) // 列表的加载中
|
||||
const list = ref<ProductCareItemVO[]>([]) // 列表的数据
|
||||
const total = ref(0) // 列表的总页数
|
||||
|
|
@ -145,6 +155,7 @@ const queryParams = reactive({
|
|||
pageNo: 1,
|
||||
pageSize: 10,
|
||||
value: undefined,
|
||||
type: undefined,
|
||||
iconUrl: undefined,
|
||||
brandIds: undefined,
|
||||
isCombo: undefined,
|
||||
|
|
@ -161,7 +172,12 @@ const exportLoading = ref(false) // 导出的加载中
|
|||
const getList = async () => {
|
||||
loading.value = true
|
||||
try {
|
||||
const data = await ProductCareItemApi.getProductCareItemPage(queryParams)
|
||||
|
||||
const data = await ProductCareItemApi.queryPage(buildQuery(queryParams,{
|
||||
easyOption: "value@like,type@in",
|
||||
orderBy: 'create_time desc',
|
||||
ignoreField: "pageNo,pageSize"
|
||||
}))
|
||||
list.value = data.list
|
||||
total.value = data.total
|
||||
} finally {
|
||||
|
|
@ -214,9 +230,21 @@ const handleExport = async () => {
|
|||
exportLoading.value = false
|
||||
}
|
||||
}
|
||||
|
||||
let first_load = true;
|
||||
/** 初始化 **/
|
||||
onMounted(() => {
|
||||
if(first_load){
|
||||
first_load = false;
|
||||
queryParams.type = route.query.type
|
||||
if(queryParams.type){
|
||||
queryParams.type = queryParams.type.split(',').map(String)
|
||||
}
|
||||
const tmp = route.query._add
|
||||
if(tmp == 1){
|
||||
// 删除 url的参数
|
||||
openForm('create')
|
||||
}
|
||||
}
|
||||
getList()
|
||||
})
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -8,13 +8,18 @@
|
|||
append-to-body
|
||||
@close="updateVisible(false)">
|
||||
<div v-loading="that.loading">
|
||||
<DesignPropEdit ref="designPropEditRef" />
|
||||
<DesignPropEdit ref="designPropEditRef"/>
|
||||
</div>
|
||||
<template #footer>
|
||||
<span class="dialog-footer">
|
||||
<el-button @click="updateVisible(false)">{{t("designInfo.cancelText")}}</el-button>
|
||||
<el-button type="primary" @click="submit">{{ t("designInfo.auditSubmitText") }}</el-button>
|
||||
</span>
|
||||
<div style="display: flex;flex-direction: column;align-items: center">
|
||||
<div>
|
||||
<el-button @click="updateVisible(false)">{{ t("designInfo.cancelText") }}</el-button>
|
||||
<el-button type="primary" @click="submit">{{
|
||||
t("designInfo.auditSubmitText")
|
||||
}}
|
||||
</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</Dialog>
|
||||
</template>
|
||||
|
|
@ -24,47 +29,48 @@ import {ElAlert} from "element-plus";
|
|||
import {reactive, computed, watch} from 'vue'
|
||||
import {calculateVectorDifference} from "@/components/DraftDesign/utils/FuncUtil";
|
||||
import {useMessage} from "@/hooks/web/useMessage";
|
||||
import { useI18n } from 'vue-i18n'
|
||||
const { t } = useI18n()
|
||||
import {useI18n} from 'vue-i18n'
|
||||
|
||||
const {t} = useI18n()
|
||||
const emit = defineEmits(['update:visible', 'submit'])
|
||||
const designPropEditRef = ref();
|
||||
const that = reactive({
|
||||
previewVisible: false,
|
||||
loading: false,
|
||||
})
|
||||
const updateVisible = (visible)=>{
|
||||
const updateVisible = (visible) => {
|
||||
that.previewVisible = visible;
|
||||
}
|
||||
const preview = (config,prop={})=>{
|
||||
const preview = (config, prop = {}) => {
|
||||
updateVisible(true);
|
||||
that.loading = true;
|
||||
setTimeout(()=>{
|
||||
designPropEditRef.value.loadConfig(config,prop);
|
||||
setTimeout(() => {
|
||||
designPropEditRef.value.loadConfig(config, prop);
|
||||
that.loading = false;
|
||||
},100)
|
||||
}, 100)
|
||||
}
|
||||
// 预览产品id
|
||||
const previewByProductId = (id: string | number,prop={})=>{
|
||||
const previewByProductId = (id: string | number, prop = {}) => {
|
||||
updateVisible(true);
|
||||
that.loading = true;
|
||||
setTimeout(()=>{
|
||||
designPropEditRef.value.previewByProductId(id,prop);
|
||||
setTimeout(() => {
|
||||
designPropEditRef.value.previewByProductId(id, prop);
|
||||
that.loading = false;
|
||||
},100)
|
||||
}, 100)
|
||||
}
|
||||
// 预览草稿设计id
|
||||
const previewByDraftDesignId = (id: string | number,prop={})=>{
|
||||
const previewByDraftDesignId = (id: string | number, prop = {}) => {
|
||||
updateVisible(true);
|
||||
that.loading = true;
|
||||
setTimeout(()=>{
|
||||
designPropEditRef.value.previewByDraftDesignId(config,prop);
|
||||
setTimeout(() => {
|
||||
designPropEditRef.value.previewByDraftDesignId(config, prop);
|
||||
that.loading = false;
|
||||
},100)
|
||||
}, 100)
|
||||
}
|
||||
const submit = ()=>{
|
||||
const submit = () => {
|
||||
useMessage().confirm(t('designInfo.auditTips')).then(async (r) => {
|
||||
const res = await designPropEditRef.value.getPropInfo()
|
||||
emit("submit",res);
|
||||
emit("submit", res);
|
||||
updateVisible(false)
|
||||
})
|
||||
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load Diff
|
|
@ -1,119 +1,139 @@
|
|||
<template>
|
||||
<el-dialog
|
||||
v-model="that.show"
|
||||
title="动态属性配置"
|
||||
width="60vw"
|
||||
top="2%"
|
||||
draggable
|
||||
append-to-body
|
||||
@close="updateVisible(false)">
|
||||
<div style="width: 100%; max-height: 75vh">
|
||||
<el-alert
|
||||
title="动态属性配置说明"
|
||||
type="info"
|
||||
:closable="false"
|
||||
show-icon
|
||||
style="margin-bottom: 10px"
|
||||
>
|
||||
"位置信息配置为节点的位置信息。如:添加了3个配置数据这时会依次添加到对应位置上。从而实现动态属性配置。"
|
||||
</el-alert>
|
||||
<el-form>
|
||||
<el-row style="min-width: 900px">
|
||||
<el-col :span="6" :xs="12">
|
||||
<el-form-item label="组名称">
|
||||
<el-input v-model="that.configInfo.groupName" placeholder="请输入组名称"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="6" :xs="12">
|
||||
<el-form-item label="组id">
|
||||
<el-input v-model="that.configInfo.groupId" disabled/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-form-item label="保养类型" >
|
||||
<el-select v-model="that.configInfo.groupType" :disabled="that.configInfo.isCombo">
|
||||
<el-option
|
||||
v-for="dict in getStrDictOptions(DICT_TYPE.OMS_PRODUCT_CARE_ITEM_TYPE)"
|
||||
:key="`${dict.value}`"
|
||||
:label="dict.label"
|
||||
:value="dict.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<!-- 停用 -->
|
||||
<el-form-item label="控制" >
|
||||
<div style="width: 800px">
|
||||
<el-row>
|
||||
<el-col :span="6">
|
||||
<div style="width: 120px;display: flex">
|
||||
<el-checkbox
|
||||
v-model="that.configInfo.canChange">
|
||||
<span>允许调整数量</span>
|
||||
</el-checkbox>
|
||||
</div>
|
||||
<div>
|
||||
<SortDialog ref="sortDialogRef" @list-change="langSortChange"/>
|
||||
<el-dialog
|
||||
v-model="that.show"
|
||||
title="动态属性配置"
|
||||
width="60vw"
|
||||
top="2%"
|
||||
draggable
|
||||
append-to-body
|
||||
:close-on-click-modal="false"
|
||||
@close="updateVisible(false)">
|
||||
<div style="width: 100%; max-height: 75vh">
|
||||
<el-alert
|
||||
title="动态属性配置说明"
|
||||
type="info"
|
||||
:closable="false"
|
||||
show-icon
|
||||
style="margin-bottom: 10px"
|
||||
>
|
||||
"位置信息配置为节点的位置信息。如:添加了3个配置数据这时会依次添加到对应位置上。从而实现动态属性配置。"
|
||||
</el-alert>
|
||||
<el-form>
|
||||
<el-row style="min-width: 900px">
|
||||
<el-col :span="6" :xs="12">
|
||||
<el-form-item label="组名称">
|
||||
<el-input v-model="that.configInfo.groupName" placeholder="请输入组名称"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="6" :xs="12">
|
||||
<el-form-item label="组id">
|
||||
<el-input v-model="that.configInfo.groupId" disabled/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-form-item label="护理类型">
|
||||
<el-select v-model="that.configInfo.groupType" :disabled="that.configInfo.isCombo">
|
||||
<el-option
|
||||
v-for="dict in getStrDictOptions(DICT_TYPE.OMS_PRODUCT_CARE_ITEM_TYPE)"
|
||||
:key="`${dict.value}`"
|
||||
:label="dict.label"
|
||||
:value="dict.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<!-- 停用 -->
|
||||
<el-form-item label="控制">
|
||||
<div style="width: 800px">
|
||||
<el-row>
|
||||
<el-col :span="6">
|
||||
<div style="width: 120px;display: flex">
|
||||
<el-checkbox
|
||||
v-model="that.configInfo.canChange">
|
||||
<span>允许调整数量</span>
|
||||
</el-checkbox>
|
||||
</div>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="6">
|
||||
<div style="width: 120px;display: flex">
|
||||
<el-checkbox :disabled="disableInput"
|
||||
v-model="that.configInfo.canInput">
|
||||
<span>允许输入值</span>
|
||||
</el-checkbox>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-tooltip
|
||||
content="输入多个变量时的连接字符,使用<br/> 变量进行换行"
|
||||
>
|
||||
<div style="display:flex;">
|
||||
<div>变量链接符</div>
|
||||
<div>
|
||||
<el-input v-model="that.configInfo.linkChar" clearable maxlength="6" placeholder="请输入连接符" show-word-limit />
|
||||
<el-col :span="6">
|
||||
<div style="width: 120px;display: flex">
|
||||
<el-checkbox :disabled="disableInput"
|
||||
v-model="that.configInfo.canInput">
|
||||
<span>允许输入值</span>
|
||||
</el-checkbox>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-tooltip
|
||||
content="输入多个变量时的连接字符,使用<br/> 变量进行换行"
|
||||
>
|
||||
<div style="display:flex;">
|
||||
<div>变量链接符</div>
|
||||
<div>
|
||||
<el-input v-model="that.configInfo.linkChar" clearable maxlength="6"
|
||||
placeholder="请输入连接符" show-word-limit/>
|
||||
</div>
|
||||
<el-button @click="that.configInfo.linkChar = '<br/>'">换行</el-button>
|
||||
</div>
|
||||
<el-button @click="that.configInfo.linkChar = '<br/>'">换行</el-button>
|
||||
</div>
|
||||
</el-tooltip>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-form-item label="数量">
|
||||
<el-row>
|
||||
<el-col :span="11">
|
||||
min
|
||||
<el-input-number
|
||||
v-model="that.configInfo.minSize"
|
||||
:min="1"
|
||||
:max="that.configInfo.maxSize"
|
||||
:disabled="that.configInfo.shape"/>
|
||||
</el-col>
|
||||
<el-col :span="11">
|
||||
max
|
||||
<el-input-number
|
||||
v-model="that.configInfo.maxSize" :min="that.configInfo.shape ? 3 : 1"/>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form-item>
|
||||
<el-form-item label="位置信息">
|
||||
</el-tooltip>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-form-item label="数量">
|
||||
<el-row>
|
||||
<el-col :span="11">
|
||||
min
|
||||
<el-input-number
|
||||
v-model="that.configInfo.minSize"
|
||||
:min="1"
|
||||
:max="that.configInfo.maxSize"
|
||||
:disabled="that.configInfo.shape"/>
|
||||
</el-col>
|
||||
<el-col :span="11">
|
||||
max
|
||||
<el-input-number
|
||||
v-model="that.configInfo.maxSize" :min="that.configInfo.shape ? 3 : 1"/>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form-item>
|
||||
<el-form-item label="位置信息">
|
||||
|
||||
<div style="display: flex;flex-direction: column">
|
||||
<div>
|
||||
<el-checkbox v-model="that.configInfo.multiLanguage">多语言对照,开启后语言匹配到对应位置上</el-checkbox>
|
||||
</div>
|
||||
<div v-if="!that.configInfo.isCombo && that.configInfo.pointList.length > 1">
|
||||
<el-button @click="append(1)">追加</el-button>
|
||||
<el-button @click="append(10)">追加10个</el-button>
|
||||
<el-button type="danger" @click="delLast">删除</el-button>
|
||||
</div>
|
||||
<div v-else-if="!that.configInfo.isCombo">
|
||||
<span style="font-size: 0.8rem;color: #7c7b7b">两个或者以上允许追加更多位置信息</span>
|
||||
</div>
|
||||
<div style="display: flex;flex-direction: column">
|
||||
<div>
|
||||
<el-checkbox v-model="that.configInfo.multiLanguage">勾选后语言匹配到对应位置上
|
||||
</el-checkbox>
|
||||
<el-select
|
||||
v-show="!that.configInfo.multiLanguage"
|
||||
filterable
|
||||
multiple
|
||||
v-model="that.configInfo.langSort"
|
||||
placeholder="可多选语言参与拼接为一句话,和排序">
|
||||
<el-option
|
||||
v-for="dict in getStrDictOptions(DICT_TYPE.LANGUAGE_LOCALE)"
|
||||
:key="dict.value"
|
||||
:label="dict.label"
|
||||
:value="dict.value"
|
||||
/>
|
||||
</el-select>
|
||||
<el-button v-show="that.configInfo.langSort && that.configInfo.langSort.length > 0" @click="setLangSort">语言排序</el-button>
|
||||
</div>
|
||||
<div v-if="!that.configInfo.isCombo && that.configInfo.pointList.length > 1">
|
||||
<el-button @click="append(1)">追加</el-button>
|
||||
<el-button @click="append(10)">追加10个</el-button>
|
||||
<el-button type="danger" @click="delLast">删除</el-button>
|
||||
</div>
|
||||
<div v-else-if="!that.configInfo.isCombo">
|
||||
<span
|
||||
style="font-size: 0.8rem;color: #7c7b7b">两个或者以上允许追加更多位置信息</span>
|
||||
</div>
|
||||
<el-table :data="that.configInfo.pointList" style=" box-shadow: 2px 0 0 1px #eee; ">
|
||||
<el-table-column label="序号" width="60">
|
||||
<template #default="scope">
|
||||
<span>{{ scope.$index + 1 }}</span>
|
||||
<span v-if="that.configInfo.isCombo" style="padding-right: 4px">
|
||||
{{scope.$index !== 0 ? '' : '-icon' }}
|
||||
{{ scope.$index !== 0 ? '' : '-icon' }}
|
||||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
|
@ -129,7 +149,8 @@
|
|||
</el-table-column>
|
||||
<el-table-column label="语言" width="180" v-if="that.configInfo.multiLanguage">
|
||||
<template #default="scope">
|
||||
<el-select v-model="that.configInfo.pointList[scope.$index].dataInfo.locale" placeholder="请选择语言标识">
|
||||
<el-select v-model="that.configInfo.pointList[scope.$index].dataInfo.locale"
|
||||
placeholder="请选择语言标识">
|
||||
<el-option
|
||||
v-for="dict in languageOptions"
|
||||
:key="`${dict.value}`"
|
||||
|
|
@ -142,7 +163,8 @@
|
|||
<el-table-column label="文本" width="180">
|
||||
<template #default="scope">
|
||||
<div>
|
||||
<div v-if="that.configInfo.pointList[scope.$index].dataInfo.locale === '_$value'">
|
||||
<div
|
||||
v-if="that.configInfo.pointList[scope.$index].dataInfo.locale === '_$value'">
|
||||
表达式
|
||||
</div>
|
||||
<div v-else>
|
||||
|
|
@ -153,7 +175,7 @@
|
|||
placement="top"
|
||||
>
|
||||
<span class="line-clamp-1">
|
||||
{{ that.configInfo.pointList[scope.$index].dataInfo.label}}
|
||||
{{ that.configInfo.pointList[scope.$index].dataInfo.label }}
|
||||
</span>
|
||||
</el-tooltip>
|
||||
</div>
|
||||
|
|
@ -162,17 +184,18 @@
|
|||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<template #footer>
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<template #footer>
|
||||
<span class="dialog-footer">
|
||||
<el-button @click="updateVisible(false)">取消</el-button>
|
||||
<el-button type="primary" @click="submit">确定</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup name="DynamicPropConfig">
|
||||
|
|
@ -185,24 +208,25 @@ import {ShapeType} from "../config";
|
|||
// 动态属性配置
|
||||
|
||||
const emit = defineEmits(['update:visible', 'submit'])
|
||||
|
||||
const sortDialogRef = ref();
|
||||
const that = reactive({
|
||||
allGroupList: [],
|
||||
show: false,
|
||||
configInfo: {
|
||||
groupName: '', // 父节点名称
|
||||
groupType: '1',
|
||||
isCombo: false, // 是否是组合节点
|
||||
multiLanguage: true, // 是否使用多语言
|
||||
minSize: 1,
|
||||
maxSize: 100,
|
||||
canChange: false,
|
||||
canInput: false,
|
||||
linkChar: ',',
|
||||
cellIds: [], // 节点id
|
||||
groupType: '1', // 组合类型
|
||||
groupId: `g_${Math.random().toString(36).substring(2)}`,
|
||||
isCombo: false, // 是否是组合节点
|
||||
multiLanguage: true, // 是否使用多语言 true 为多语言对应到指定位置上,false 为将语言组合成一句话
|
||||
langSort: [], // 多语言 组合成一句话的 排序
|
||||
minSize: 1, // 节点组最小数量
|
||||
maxSize: 100, // 节点组最大数量
|
||||
canChange: false, // 是否允许调整数量
|
||||
canInput: false,// 是否允许输入值
|
||||
linkChar: ',',// 连接字符
|
||||
cellIds: [], // 节点id
|
||||
data: {}, //节点是数据
|
||||
shape: '', // 是否是图片
|
||||
shape: '', // 节点类型
|
||||
pointList: [], //{ x:10,y:100}
|
||||
}
|
||||
})
|
||||
|
|
@ -212,11 +236,11 @@ const props = defineProps({
|
|||
default: false
|
||||
}
|
||||
})
|
||||
const languageOptions = computed(()=>{
|
||||
const languageOptions = computed(() => {
|
||||
|
||||
const options = getStrDictOptions(DICT_TYPE.LANGUAGE_LOCALE);
|
||||
// @ts-ignore
|
||||
options.unshift({ label: '*取值表达式', value: '_$value' })
|
||||
options.unshift({label: '*取值表达式', value: '_$value'})
|
||||
return options
|
||||
})
|
||||
const delLast = () => {
|
||||
|
|
@ -227,7 +251,7 @@ const delLast = () => {
|
|||
that.configInfo.pointList.pop()
|
||||
useMessage().success(`成功删除1个位置信息`)
|
||||
}
|
||||
const disableInput = computed(()=>{
|
||||
const disableInput = computed(() => {
|
||||
return that.configInfo.shape === ShapeType.vueShapeImage
|
||||
})
|
||||
const appendNode = () => {
|
||||
|
|
@ -256,14 +280,15 @@ const append = (count = 1) => {
|
|||
}
|
||||
const init = (allGroupList, data) => {
|
||||
that.allGroupList = allGroupList;
|
||||
console.log("that.allGroupList",that.allGroupList)
|
||||
console.log("data",data)
|
||||
console.log("that.allGroupList", that.allGroupList)
|
||||
console.log("data", data)
|
||||
that.configInfo = {
|
||||
groupName: '', // 父节点名称
|
||||
groupType: '1',
|
||||
groupId: `g_${Math.random().toString(36).substring(2)}`,
|
||||
isCombo: false, // 是否是组合节点
|
||||
multiLanguage: true, // 是否使用多语言
|
||||
multiLanguage: true, // 是否使用多语言 true 为多语言对应到指定位置上,false 为将语言组合成一句话
|
||||
langSort: [], // 多语言 组合成一句话的 排序
|
||||
minSize: 1, // 节点组最小数量
|
||||
maxSize: 100, // 节点组最大数量
|
||||
canChange: false, // 是否允许调整数量
|
||||
|
|
@ -280,12 +305,19 @@ const updateVisible = (value: boolean) => {
|
|||
that.show = value;
|
||||
}
|
||||
const getConfig = () => {
|
||||
console.log("that.configInfo",that.configInfo)
|
||||
console.log("that.configInfo", that.configInfo)
|
||||
return that.configInfo;
|
||||
}
|
||||
const submit = () => {
|
||||
emit('submit', getConfig())
|
||||
}
|
||||
const setLangSort = () => {
|
||||
sortDialogRef.value.init(that.configInfo.langSort)
|
||||
sortDialogRef.value.show();
|
||||
}
|
||||
const langSortChange = (val) => {
|
||||
that.configInfo.langSort = val;
|
||||
}
|
||||
onMounted(() => {
|
||||
})
|
||||
defineExpose({
|
||||
|
|
|
|||
|
|
@ -0,0 +1,149 @@
|
|||
<template>
|
||||
|
||||
<div>
|
||||
<el-dialog
|
||||
v-model="that.showOrderByDialog"
|
||||
draggable
|
||||
append-to-body
|
||||
width="50vw"
|
||||
:close-on-click-modal="false"
|
||||
>
|
||||
<template #title>
|
||||
<div>
|
||||
{{ title }}
|
||||
</div>
|
||||
</template>
|
||||
<template #default>
|
||||
<div>
|
||||
<div>
|
||||
<div v-html="tips"></div>
|
||||
</div>
|
||||
|
||||
<Draggable
|
||||
style="display: flex; flex-direction: column; align-items: center;"
|
||||
ghost-class="draggable-ghost"
|
||||
item-key="_$key"
|
||||
@change="propListChange"
|
||||
handler=".order-by-item"
|
||||
:list="that.propList"
|
||||
:group="{ name: 'sortItem'}"
|
||||
:animation="200"
|
||||
>
|
||||
<template #item="{ element,index }">
|
||||
<div class="order-by-item">
|
||||
<span style="padding: 4px">{{ index + 1 }}</span>
|
||||
<span style="padding: 4px;">{{ showLabel(element) }}</span>
|
||||
</div>
|
||||
</template>
|
||||
</Draggable>
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
|
||||
</div>
|
||||
|
||||
</template>
|
||||
<script setup lang="ts" name="SortDialog">
|
||||
|
||||
import {nextId} from "@/components/DraftDesign/utils/FuncUtil";
|
||||
import Draggable from 'vuedraggable'
|
||||
import '../icons/style.css'
|
||||
|
||||
const props = defineProps({
|
||||
title: {
|
||||
type: String,
|
||||
default: '排序'
|
||||
},
|
||||
tips: {
|
||||
type: String,
|
||||
default: '拖动可排序'
|
||||
}
|
||||
})
|
||||
const emit = defineEmits(['listChange'])
|
||||
const that = reactive({
|
||||
propList: [],
|
||||
showKey: '',
|
||||
showOrderByDialog: false,
|
||||
isString: false,
|
||||
})
|
||||
const propListChange = () => {
|
||||
let res = []
|
||||
let arr =JSON.parse( JSON.stringify(that.propList))
|
||||
if(that.isString){
|
||||
arr.forEach(item => {
|
||||
res.push(item.label)
|
||||
})
|
||||
}else {
|
||||
arr.forEach(item => {
|
||||
//删除 _$key
|
||||
delete item._$key
|
||||
res.push(item)
|
||||
})
|
||||
}
|
||||
|
||||
emit('listChange', that.propList)
|
||||
}
|
||||
let showLabel = (el) => {
|
||||
return el;
|
||||
}
|
||||
const show = () => {
|
||||
that.showOrderByDialog = true
|
||||
}
|
||||
const close = () => {
|
||||
that.showOrderByDialog = false
|
||||
}
|
||||
const init = (arr, showFunc = (el) => {
|
||||
return el;
|
||||
}) => {
|
||||
// 深拷贝
|
||||
that.propList = JSON.parse(JSON.stringify([...(arr || [])]));
|
||||
// 给每个元素添加一个 key
|
||||
that.propList.forEach(item => {
|
||||
console.log(item)
|
||||
if(typeof item === 'string'){
|
||||
item = {
|
||||
_$key: nextId(),
|
||||
label: item
|
||||
}
|
||||
that.isString = true
|
||||
}else {
|
||||
item['_$key'] = nextId()
|
||||
}
|
||||
|
||||
})
|
||||
showLabel = showFunc || showLabel
|
||||
}
|
||||
defineExpose({
|
||||
init,
|
||||
show,
|
||||
close
|
||||
})
|
||||
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
@import "./layout/fontFamilyIcon.scss";
|
||||
|
||||
.draggable-ghost {
|
||||
background-color: rgba(39, 255, 169, 0.2);
|
||||
outline-width: 0;
|
||||
height: 38px;
|
||||
box-sizing: border-box;
|
||||
font-size: 0;
|
||||
content: '';
|
||||
overflow: hidden;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.order-by-item:hover {
|
||||
cursor: move;
|
||||
}
|
||||
|
||||
.order-by-item {
|
||||
margin: 6px;
|
||||
border: 1px solid #8e8b8b;
|
||||
width: 100%;
|
||||
padding: 10px
|
||||
}
|
||||
|
||||
</style>
|
||||
|
|
@ -0,0 +1,11 @@
|
|||
|
||||
// 成分比例 1
|
||||
// 图文说明 2
|
||||
// 文字说明 3
|
||||
// 尺码 4
|
||||
export enum GroupTypeEnum {
|
||||
RATIO = '1',
|
||||
ICON = '2',
|
||||
TEXT = '3',
|
||||
SIZE = '4'
|
||||
}
|
||||
|
|
@ -1159,6 +1159,7 @@ const getJson = () => {
|
|||
let canChange = prop.canChange === undefined ? false : prop.canChange;
|
||||
let canInput = prop.canInput === undefined ? false : prop.canInput;
|
||||
let linkChar = prop.linkChar === undefined ? ',' : prop.linkChar;
|
||||
let langSort = prop.langSort === undefined ? [] : prop.langSort;
|
||||
|
||||
if (combo) {
|
||||
min = Math.min(dataInfoList.length,min);
|
||||
|
|
@ -1178,6 +1179,7 @@ const getJson = () => {
|
|||
canChange: canChange,
|
||||
canInput: canInput,
|
||||
linkChar: linkChar,
|
||||
langSort: langSort,
|
||||
shape: prop.shape,
|
||||
dataInfo: dataInfoList
|
||||
}
|
||||
|
|
@ -1454,11 +1456,12 @@ const handlerGroupList = (cells, isCombo = false, min, max) => {
|
|||
let canChange = false;
|
||||
let canInput = false;
|
||||
let linkChar = ',';
|
||||
let langSort = [];
|
||||
for (let i = 0; i < that.pageConfig.propList.length; i++) {
|
||||
if (that.pageConfig.propList[i].groupId === cells[0].getData().propGroupId) {
|
||||
canChange = that.pageConfig.propList[i].canChange === true
|
||||
canInput = that.pageConfig.propList[i].canInput === true
|
||||
linkChar = that.pageConfig.propList[i].linkChar || ','
|
||||
langSort = that.pageConfig.propList[i].langSort || []
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
|
@ -1473,6 +1476,7 @@ const handlerGroupList = (cells, isCombo = false, min, max) => {
|
|||
maxSize: max,
|
||||
canChange: canChange,
|
||||
canInput: canInput,
|
||||
langSort: langSort,
|
||||
linkChar: linkChar,
|
||||
data: info.data, //节点是数据
|
||||
shape: info.shape,
|
||||
|
|
|
|||
Loading…
Reference in New Issue