Skip to content

C
customisation-management_front
Commit db60a6f0 by qinjianhui
Options

fix: 格式化代码

parent ee8406a7
Showing with 593 additions and 332 deletions
src/api/product.ts
import request from '@/utils/request' import request from '@/utils/request'
//设计产品/成品/系统素材三级分类列表 //设计产品/成品/系统素材三级分类列表
export function shopTypeList(params?: any) { export function shopTypeList(params?: any) {
return request.get({ url: '/api/diy/template/type/list', params }) return request.get({ url: '/api/diy/template/type/list', params })
...@@ -25,14 +24,13 @@ export function shopTypeChangeTop(params?: any) { ...@@ -25,14 +24,13 @@ export function shopTypeChangeTop(params?: any) {
return request.post({ url: '/shop/type/changeTop', params }) return request.post({ url: '/shop/type/changeTop', params })
} }
//模板列表 //模板列表
export function foxpsdDiyTemplateListFindAndCountAll(params: Record<string, any>) { export function foxpsdDiyTemplateListFindAndCountAll(
params: Record<string, any>
) {
return request.post({ url: '/api/diy/template/listFindAndCountAll', params }) return request.post({ url: '/api/diy/template/listFindAndCountAll', params })
} }
//foxpsd 模板详情 //foxpsd 模板详情
export function foxpsdDiyTemplateItem(params: Record<string, any>) { export function foxpsdDiyTemplateItem(params: Record<string, any>) {
return request.get({ url: '/foxpsdData/api/diy/template/item', params }) return request.get({ url: '/foxpsdData/api/diy/template/item', params })
...@@ -48,7 +46,6 @@ export function apiDiyTemplateUnbindDiy(params?: any) { ...@@ -48,7 +46,6 @@ export function apiDiyTemplateUnbindDiy(params?: any) {
return request.post({ url: '/api/diy/template/unbind/diy', params }) return request.post({ url: '/api/diy/template/unbind/diy', params })
} }
// 模板创建 // 模板创建
export function apiDiyTemplateCreate(params?: any) { export function apiDiyTemplateCreate(params?: any) {
return request.post({ url: '/api/diy/template/create', params }) return request.post({ url: '/api/diy/template/create', params })
...@@ -138,5 +135,3 @@ export function apiDiyTemplateChimaUpdate(params?: any) { ...@@ -138,5 +135,3 @@ export function apiDiyTemplateChimaUpdate(params?: any) {
export function apiDiyTemplateChimaDelete(params?: any) { export function apiDiyTemplateChimaDelete(params?: any) {
return request.post({ url: '/api/diy/template/chima/delete', params }) return request.post({ url: '/api/diy/template/chima/delete', params })
} }
src/views/product/lists/bindDiy.vue
...@@ -65,7 +65,7 @@ import type { FormInstance } from 'element-plus' ...@@ -65,7 +65,7 @@ import type { FormInstance } from 'element-plus'
import { import {
apiDiyTemplateUpdate, apiDiyTemplateUpdate,
apiDiyTemplateCreate, apiDiyTemplateCreate,
apiDiyTemplateBindDiy, apiDiyTemplateBindDiy
} from '@/api/product' } from '@/api/product'
import Popup from '@/components/popup/index.vue' import Popup from '@/components/popup/index.vue'
import { getImageUrl } from '@/utils/getImgUrl' import { getImageUrl } from '@/utils/getImgUrl'
...@@ -80,7 +80,7 @@ const mobanList: any = ref([]) ...@@ -80,7 +80,7 @@ const mobanList: any = ref([])
const formData = reactive({ const formData = reactive({
id: '', id: '',
diy_ids: '', //待绑定的模板 diy_ids: '', //待绑定的模板
default_diy_id: '', default_diy_id: ''
}) })
const formRules: any = reactive({ const formRules: any = reactive({
...@@ -88,9 +88,9 @@ const formRules: any = reactive({ ...@@ -88,9 +88,9 @@ const formRules: any = reactive({
{ {
required: true, required: true,
message: '请输入标签名称', message: '请输入标签名称',
trigger: 'blur', trigger: 'blur'
}, }
], ]
}) })
const templateChange = (e: any) => { const templateChange = (e: any) => {
...@@ -150,6 +150,6 @@ const handleClose = () => { ...@@ -150,6 +150,6 @@ const handleClose = () => {
defineExpose({ defineExpose({
open, open,
setFormData, setFormData,
getDetail, getDetail
}) })
</script> </script>
src/views/product/lists/edit.vue
<template> <template>
<div class="edit-popup"> <div class="edit-popup">
<popup ref="popupRef" :title="popupTitle" :async="true" width="700px" @confirm="handleSubmit" @close="handleClose"> <popup
<el-form ref="formRef" :model="formData" label-width="120px" :rules="formRules"> ref="popupRef"
:title="popupTitle"
:async="true"
width="700px"
@confirm="handleSubmit"
@close="handleClose"
>
<el-form
ref="formRef"
:model="formData"
label-width="120px"
:rules="formRules"
>
<el-form-item label="模板名称" prop="title"> <el-form-item label="模板名称" prop="title">
<el-input v-model="formData.title" placeholder="请输入模板名称" clearable /> <el-input
v-model="formData.title"
placeholder="请输入模板名称"
clearable
/>
</el-form-item> </el-form-item>
<el-form-item label="产品主图" prop="img_url"> <el-form-item label="产品主图" prop="img_url">
...@@ -16,12 +32,20 @@ ...@@ -16,12 +32,20 @@
</el-form-item> </el-form-item>
<el-form-item label="分类" prop="type_id"> <el-form-item label="分类" prop="type_id">
<el-cascader v-model="formData.type_id" :options="type_list" :props="{ label: 'title', value: 'id' }" /> <el-cascader
v-model="formData.type_id"
:options="type_list"
:props="{ label: 'title', value: 'id' }"
/>
</el-form-item> </el-form-item>
<el-form-item label="自定义编码" prop="bianma"> <el-form-item label="自定义编码" prop="bianma">
<el-input v-model="formData.bianma" placeholder="请输入自定义编码" clearable /> <el-input
<div class=" text-xs">自定义编码会合成到生产图中（英文或数字）</div> v-model="formData.bianma"
placeholder="请输入自定义编码"
clearable
/>
<div class="text-xs">自定义编码会合成到生产图中（英文或数字）</div>
</el-form-item> </el-form-item>
<el-form-item label="生产图格式" prop="sc_img_type"> <el-form-item label="生产图格式" prop="sc_img_type">
...@@ -31,7 +55,9 @@ ...@@ -31,7 +55,9 @@
<el-radio :label="2">SVG</el-radio> <el-radio :label="2">SVG</el-radio>
<el-radio :label="3">TIFF</el-radio> <el-radio :label="3">TIFF</el-radio>
</el-radio-group> </el-radio-group>
<div class=" text-xs">没特殊需求，请选择方法jpg及svg，其中svg性能最好</div> <div class="text-xs">
没特殊需求，请选择方法jpg及svg，其中svg性能最好
</div>
</div> </div>
</el-form-item> </el-form-item>
...@@ -41,7 +67,9 @@ ...@@ -41,7 +67,9 @@
<el-radio :label="0">后续生成</el-radio> <el-radio :label="0">后续生成</el-radio>
<el-radio :label="1">立刻生成</el-radio> <el-radio :label="1">立刻生成</el-radio>
</el-radio-group> </el-radio-group>
<div class=" text-xs">默认为【后续生成】，可以通过接口等用户下单后再去合成</div> <div class="text-xs">
默认为【后续生成】，可以通过接口等用户下单后再去合成
</div>
</div> </div>
</el-form-item> </el-form-item>
...@@ -53,21 +81,28 @@ ...@@ -53,21 +81,28 @@
</el-form-item> </el-form-item>
<el-form-item label="描述" prop="content"> <el-form-item label="描述" prop="content">
<el-input v-model="formData.content" placeholder="请输入描述" type="textarea" <el-input
:autosize="{ minRows: 3, maxRows: 3 }" maxlength="200" show-word-limit clearable /> v-model="formData.content"
placeholder="请输入描述"
type="textarea"
:autosize="{ minRows: 3, maxRows: 3 }"
maxlength="200"
show-word-limit
clearable
/>
</el-form-item> </el-form-item>
</el-form> </el-form>
</popup> </popup>
</div> </div>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import type { FormInstance } from 'element-plus' import type { FormInstance } from 'element-plus'
import { shopTypeList, apiDiyTemplateUpdate, apiDiyTemplateCreate } from '@/api/product' import {
shopTypeList,
apiDiyTemplateUpdate,
apiDiyTemplateCreate
} from '@/api/product'
import Popup from '@/components/popup/index.vue' import Popup from '@/components/popup/index.vue'
const emit = defineEmits(['success', 'close']) const emit = defineEmits(['success', 'close'])
...@@ -87,10 +122,9 @@ const formData = reactive({ ...@@ -87,10 +122,9 @@ const formData = reactive({
bianma: '', bianma: '',
content: '', content: '',
sc_img_type: 1, // 1 JPG 2 SVG sc_img_type: 1, // 1 JPG 2 SVG
chima_now_render:0 chima_now_render: 0
}) })
const formRules: any = reactive({ const formRules: any = reactive({
title: [ title: [
{ {
...@@ -136,34 +170,33 @@ const formRules: any = reactive({ ...@@ -136,34 +170,33 @@ const formRules: any = reactive({
] ]
}) })
const handleSubmit = async () => { const handleSubmit = async () => {
await formRef.value?.validate(); await formRef.value?.validate()
let obj: any = { ...toRaw(formData) }; const obj: any = { ...toRaw(formData) }
if (obj.id === '') delete obj.id if (obj.id === '') delete obj.id
if (obj.type_id && obj.type_id.length > 0) { if (obj.type_id && obj.type_id.length > 0) {
obj.type_id = obj.type_id[obj.type_id.length - 1] obj.type_id = obj.type_id[obj.type_id.length - 1]
} }
mode.value == 'edit' ? await apiDiyTemplateUpdate(obj) : await apiDiyTemplateCreate(obj) mode.value == 'edit'
? await apiDiyTemplateUpdate(obj)
: await apiDiyTemplateCreate(obj)
popupRef.value?.close() popupRef.value?.close()
emit('success') emit('success')
} }
const type_list = ref([])
const type_list = ref([]);
const getData = async () => { const getData = async () => {
let res = await shopTypeList() const res = await shopTypeList()
console.log(res) console.log(res)
type_list.value = res.data.list; type_list.value = res.data.list
} }
const open = async (key = 'add') => { const open = async (key = 'add') => {
mode.value = key mode.value = key
popupRef.value?.open(); popupRef.value?.open()
await getData() await getData()
} }
...@@ -176,9 +209,8 @@ const setFormData = (data: Record<any, any>) => { ...@@ -176,9 +209,8 @@ const setFormData = (data: Record<any, any>) => {
} }
} }
const getDetail = async (row: Record<string, any>) => { const getDetail = async (row: Record<string, any>) => {
setFormData(row); setFormData(row)
} }
const handleClose = () => { const handleClose = () => {
......
src/views/product/lists/index.vue
<template> <template>
<div class="article-lists"> <div class="article-lists">
<el-card class="!border-none" shadow="never"> <el-card class="!border-none" shadow="never">
<el-form ref="formRef" class="mb-[-16px]" @submit.native.prevent :model="queryParams" :inline="true"> <el-form
ref="formRef"
class="mb-[-16px]"
@submit.native.prevent
:model="queryParams"
:inline="true"
>
<el-form-item label="编号/标题"> <el-form-item label="编号/标题">
<el-input class="w-[280px]" v-model="queryParams.content" clearable @keyup.enter="resetPage" /> <el-input
class="w-[280px]"
v-model="queryParams.content"
clearable
@keyup.enter="resetPage"
/>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-button type="primary" @click="resetPage">查询</el-button> <el-button type="primary" @click="resetPage">查询</el-button>
...@@ -26,19 +37,34 @@ ...@@ -26,19 +37,34 @@
<pagination v-model="pager" @change="getLists" /> <pagination v-model="pager" @change="getLists" />
</div> </div>
<el-table ref="tableRef" class="mt20" @selection-change="handleSelectionChange" size="large" v-loading="pager.loading" <el-table
:data="pager.lists" :tree-props="{ children: 'children', hasChildren: 'hasChildren' }" row-key="id"> ref="tableRef"
class="mt20"
@selection-change="handleSelectionChange"
size="large"
v-loading="pager.loading"
:data="pager.lists"
:tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
row-key="id"
>
<el-table-column type="selection" width="55" /> <el-table-column type="selection" width="55" />
<el-table-column label="展开"> <el-table-column label="展开">
<template #default="{ row }"> <template #default="{ row }">
<span v-if="row.children && row.children.length >0">关联模板数： {{ row.children.length }}</span> <span v-if="row.children && row.children.length > 0"
>关联模板数： {{ row.children.length }}</span
>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="SKU" width="180"> <el-table-column label="SKU" width="180">
<template #default="{ row }"> <template #default="{ row }">
<div class="two" v-copy="row.sku"> <div class="two" v-copy="row.sku">
{{ row.sku }} {{ row.sku }}
<icon class="ml-2" :size="14" color="#38f" name="el-icon-DocumentCopy" /> <icon
class="ml-2"
:size="14"
color="#38f"
name="el-icon-DocumentCopy"
/>
</div> </div>
</template> </template>
</el-table-column> </el-table-column>
...@@ -46,9 +72,15 @@ ...@@ -46,9 +72,15 @@
<el-table-column label="商品信息"> <el-table-column label="商品信息">
<template #default="{ row }"> <template #default="{ row }">
<div class="flex relative"> <div class="flex relative">
<image-contain v-if="row.img_url" :src="getImageUrl(row.img_url, 200)" :width="100" :height="100" <image-contain
:preview-src-list="[row.img_url]" preview-teleported v-if="row.img_url"
fit="contain" /> :src="getImageUrl(row.img_url, 200)"
:width="100"
:height="100"
:preview-src-list="[row.img_url]"
preview-teleported
fit="contain"
/>
<div class="goodsInfo ml-4"> <div class="goodsInfo ml-4">
<div class="title">{{ row.title }}</div> <div class="title">{{ row.title }}</div>
...@@ -56,7 +88,9 @@ ...@@ -56,7 +88,9 @@
<div class="flex"> <div class="flex">
<div class="one">分类：</div> <div class="one">分类：</div>
<div class="two"> <div class="two">
<span v-if="row.db_diy_type">{{ row.db_diy_type.title}}</span> <span v-if="row.db_diy_type">{{
row.db_diy_type.title
}}</span>
</div> </div>
</div> </div>
</div> </div>
...@@ -69,39 +103,44 @@ ...@@ -69,39 +103,44 @@
<el-table-column label="生产图生成格式"> <el-table-column label="生产图生成格式">
<template #default="{ row }"> <template #default="{ row }">
<el-tag v-if="row.sc_img_type==1">JPG</el-tag> <el-tag v-if="row.sc_img_type == 1">JPG</el-tag>
<el-tag v-if="row.sc_img_type==2">SVG</el-tag> <el-tag v-if="row.sc_img_type == 2">SVG</el-tag>
<el-tag v-if="row.sc_img_type==3">TIFF</el-tag> <el-tag v-if="row.sc_img_type == 3">TIFF</el-tag>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="尺码图是否立即生成"> <el-table-column label="尺码图是否立即生成">
<template #default="{ row }"> <template #default="{ row }">
<el-tag v-if="row.chima_now_render==1">立刻生成</el-tag> <el-tag v-if="row.chima_now_render == 1">立刻生成</el-tag>
<el-tag v-else>后续生成</el-tag> <el-tag v-else>后续生成</el-tag>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="创建时间" prop="create_date"/> <el-table-column label="创建时间" prop="create_date" />
<el-table-column label="上下架"> <el-table-column label="上下架">
<template #default="{ row }"> <template #default="{ row }">
<el-switch v-model="row.status" :active-value="1" :inactive-value="0" <el-switch
@change="changeStatus($event as number, row.id)" /> v-model="row.status"
:active-value="1"
:inactive-value="0"
@change="changeStatus($event as number, row.id)"
/>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="操作" width="120" fixed="right"> <el-table-column label="操作" width="120" fixed="right">
<template #default="{ row }"> <template #default="{ row }">
<div> <div>
<el-button type="primary" link> <el-button type="primary" link>
<router-link :to="{ <router-link
:to="{
path: '/product/face', path: '/product/face',
query: { query: {
did: row.id did: row.id
} }
}"> }"
>
创建层面 创建层面
</router-link> </router-link>
</el-button> </el-button>
...@@ -109,12 +148,14 @@ ...@@ -109,12 +148,14 @@
<div> <div>
<el-button type="primary" link> <el-button type="primary" link>
<router-link :to="{ <router-link
:to="{
path: '/product/xiaoguotu', path: '/product/xiaoguotu',
query: { query: {
did: row.id did: row.id
} }
}"> }"
>
创建效果图 创建效果图
</router-link> </router-link>
</el-button> </el-button>
...@@ -122,31 +163,36 @@ ...@@ -122,31 +163,36 @@
<div> <div>
<el-button type="primary" link> <el-button type="primary" link>
<router-link :to="{ <router-link
:to="{
path: '/product/chima', path: '/product/chima',
query: { query: {
did: row.id did: row.id
} }
}"> }"
>
创建尺码 创建尺码
</router-link> </router-link>
</el-button> </el-button>
</div> </div>
<div class="mt-3">
<div class=" mt-3">
<el-button type="primary" link @click="handleEdit(row)"> <el-button type="primary" link @click="handleEdit(row)">
编辑 编辑
</el-button> </el-button>
</div> </div>
<div v-if="!row.parent_id"> <div v-if="!row.parent_id">
<el-button type="primary" link @click="handleEdit(row,'bindDiy')"> <el-button
type="primary"
link
@click="handleEdit(row, 'bindDiy')"
>
绑定模板 绑定模板
</el-button> </el-button>
</div> </div>
<div v-if="row.children && row.children.length>0"> <div v-if="row.children && row.children.length > 0">
<el-button type="primary" link @click="unbindDiy(row)"> <el-button type="primary" link @click="unbindDiy(row)">
解绑模板 解绑模板
</el-button> </el-button>
...@@ -166,10 +212,19 @@ ...@@ -166,10 +212,19 @@
</div> </div>
</el-card> </el-card>
<edit-popup v-if="showEdit" ref="editRef" @success="getLists" @close="showEdit = false" /> <edit-popup
v-if="showEdit"
<bind-diy-popup ref="bindDiyRef" v-if="showEdit2" @success="getLists" @close="showEdit2 = false" /> ref="editRef"
@success="getLists"
@close="showEdit = false"
/>
<bind-diy-popup
ref="bindDiyRef"
v-if="showEdit2"
@success="getLists"
@close="showEdit2 = false"
/>
</div> </div>
</template> </template>
<script lang="ts" setup name="productLists"> <script lang="ts" setup name="productLists">
...@@ -181,12 +236,11 @@ import { ...@@ -181,12 +236,11 @@ import {
} from '@/api/product' } from '@/api/product'
import { usePaging } from '@/hooks/usePaging' import { usePaging } from '@/hooks/usePaging'
import feedback from '@/utils/feedback' import feedback from '@/utils/feedback'
import { getImageUrl } from "@/utils/getImgUrl"; import { getImageUrl } from '@/utils/getImgUrl'
import BindDiyPopup from "./bindDiy.vue" import BindDiyPopup from './bindDiy.vue'
import EditPopup from './edit.vue' import EditPopup from './edit.vue'
import type { ElTable } from 'element-plus' import type { ElTable } from 'element-plus'
const editRef = shallowRef<InstanceType<typeof EditPopup>>() const editRef = shallowRef<InstanceType<typeof EditPopup>>()
const bindDiyRef = shallowRef<InstanceType<typeof BindDiyPopup>>() const bindDiyRef = shallowRef<InstanceType<typeof BindDiyPopup>>()
const showEdit = ref(false) const showEdit = ref(false)
...@@ -197,7 +251,7 @@ const tableRef = shallowRef<InstanceType<typeof ElTable>>() ...@@ -197,7 +251,7 @@ const tableRef = shallowRef<InstanceType<typeof ElTable>>()
const queryParams = reactive({ const queryParams = reactive({
content: '', content: '',
type: 'all', type: 'all',
have_all:0 have_all: 0
}) })
const { pager, getLists, resetPage, resetParams } = usePaging({ const { pager, getLists, resetPage, resetParams } = usePaging({
...@@ -205,37 +259,35 @@ const { pager, getLists, resetPage, resetParams } = usePaging({ ...@@ -205,37 +259,35 @@ const { pager, getLists, resetPage, resetParams } = usePaging({
params: queryParams params: queryParams
}) })
const selectData = ref<any[]>([]) const selectData = ref<any[]>([])
const handleSelectionChange = (val: any[]) => { const handleSelectionChange = (val: any[]) => {
selectData.value = val.map(({ id }) => id) selectData.value = val.map(({ id }) => id)
} }
const handleAdd = async () => { const handleAdd = async () => {
showEdit.value = true; showEdit.value = true
await nextTick(); await nextTick()
editRef.value?.open('add'); editRef.value?.open('add')
} }
const handleEdit = async (data: any,key='edit') => { const handleEdit = async (data: any, key = 'edit') => {
if(key=='edit'){ if (key == 'edit') {
showEdit.value = true; showEdit.value = true
await nextTick(); await nextTick()
editRef.value?.open('edit'); editRef.value?.open('edit')
editRef.value?.getDetail(data) editRef.value?.getDetail(data)
}else{ } else {
showEdit2.value = true; showEdit2.value = true
await nextTick(); await nextTick()
bindDiyRef.value?.open('edit'); bindDiyRef.value?.open('edit')
bindDiyRef.value?.getDetail(data) bindDiyRef.value?.getDetail(data)
} }
} }
const unbindDiy = async (row:any)=>{ const unbindDiy = async (row: any) => {
await feedback.confirm('确定要解绑吗？') await feedback.confirm('确定要解绑吗？')
let res = await apiDiyTemplateUnbindDiy({ const res = await apiDiyTemplateUnbindDiy({
id:row.id id: row.id
}) })
getLists() getLists()
} }
...@@ -250,7 +302,6 @@ const changeStatus = async (status: number, id: number) => { ...@@ -250,7 +302,6 @@ const changeStatus = async (status: number, id: number) => {
} }
} }
const handleExpand = () => { const handleExpand = () => {
isExpand = !isExpand isExpand = !isExpand
toggleExpand(pager.lists, isExpand) toggleExpand(pager.lists, isExpand)
...@@ -267,7 +318,7 @@ const toggleExpand = (children: any[], unfold = true) => { ...@@ -267,7 +318,7 @@ const toggleExpand = (children: any[], unfold = true) => {
const handleDelete = async (id: number) => { const handleDelete = async (id: number) => {
await feedback.confirm('确定要删除？') await feedback.confirm('确定要删除？')
await apiDiyTemplateDelete({ id}) await apiDiyTemplateDelete({ id })
getLists() getLists()
} }
...@@ -278,8 +329,6 @@ onActivated(() => { ...@@ -278,8 +329,6 @@ onActivated(() => {
onMounted(() => { onMounted(() => {
getLists() getLists()
}) })
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
...@@ -287,7 +336,6 @@ onMounted(() => { ...@@ -287,7 +336,6 @@ onMounted(() => {
.title { .title {
font-weight: bold; font-weight: bold;
} }
} }
:deep(.el-table__row--level-1) { :deep(.el-table__row--level-1) {
...@@ -331,10 +379,7 @@ onMounted(() => { ...@@ -331,10 +379,7 @@ onMounted(() => {
margin-right: 5px; margin-right: 5px;
} }
} }
} }
} }
.nav_her_btn { .nav_her_btn {
......
src/views/product/xiaoguotu/edit.vue
<template> <template>
<div class="edit-popup"> <div class="edit-popup">
<popup ref="popupRef" :title="popupTitle" :async="true" width="1000px" @confirm="handleSubmit" @close="handleClose"> <popup
<el-form ref="formRef" :model="formData" label-width="140px" :rules="formRules"> ref="popupRef"
:title="popupTitle"
:async="true"
width="1000px"
@confirm="handleSubmit"
@close="handleClose"
>
<el-form
ref="formRef"
:model="formData"
label-width="140px"
:rules="formRules"
>
<el-row :gutter="20"> <el-row :gutter="20">
<el-col :span="14"> <el-col :span="14">
<el-form-item label="名称" prop="title"> <el-form-item label="名称" prop="title">
<el-input v-model="formData.title" placeholder="请输入名称" clearable /> <el-input
v-model="formData.title"
placeholder="请输入名称"
clearable
/>
</el-form-item> </el-form-item>
<el-form-item label="排序" prop="idx"> <el-form-item label="排序" prop="idx">
...@@ -18,23 +34,41 @@ ...@@ -18,23 +34,41 @@
<el-form-item label="颜色" prop="color_id"> <el-form-item label="颜色" prop="color_id">
<el-select v-model="formData.color_id"> <el-select v-model="formData.color_id">
<el-option value="">不绑定颜色</el-option> <el-option value="">不绑定颜色</el-option>
<el-option :label="item.title" :value="item.id" v-for="item in colorList" :key="item.id"/> <el-option
:label="item.title"
:value="item.id"
v-for="item in colorList"
:key="item.id"
/>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item class="!mb-0"> <el-form-item class="!mb-0">
<div> <div>
<upload :multiple="false" :action="`${config.baseUrl}/api/v1/upload`" @change="onChange" <upload
@error="onError" type="psd" :saveFoxpsd="false" :show-progress="true"> :multiple="false"
<el-button :loading="uploadPsdLoading" type="primary">上传PSD文件</el-button> :action="`${config.baseUrl}/api/v1/upload`"
@change="onChange"
@error="onError"
type="psd"
:saveFoxpsd="false"
:show-progress="true"
>
<el-button :loading="uploadPsdLoading" type="primary"
>上传PSD文件</el-button
>
</upload> </upload>
<div>上传时间较长，请耐心等待</div> <div>上传时间较长，请耐心等待</div>
</div> </div>
</el-form-item> </el-form-item>
<el-form-item label="PSD文件" prop="psd_url"> <el-form-item label="PSD文件" prop="psd_url">
<el-input v-model="formData.psd_url" placeholder="psd 文件路径" clearable disabled /> <el-input
v-model="formData.psd_url"
placeholder="psd 文件路径"
clearable
disabled
/>
</el-form-item> </el-form-item>
</el-col> </el-col>
...@@ -44,7 +78,9 @@ ...@@ -44,7 +78,9 @@
<div> <div>
<material-picker v-model="formData.img_url" :limit="1" /> <material-picker v-model="formData.img_url" :limit="1" />
</div> </div>
<div class="text-xs">png,jpg,jpeg等格式，最大为100kb,750*750像素</div> <div class="text-xs">
png,jpg,jpeg等格式，最大为100kb,750*750像素
</div>
</div> </div>
</el-form-item> </el-form-item>
</el-col> </el-col>
...@@ -55,7 +91,6 @@ ...@@ -55,7 +91,6 @@
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import type { FormInstance } from 'element-plus' import type { FormInstance } from 'element-plus'
import { import {
apiDiyTemplateXiaoguotuUpdate, apiDiyTemplateXiaoguotuUpdate,
...@@ -67,7 +102,6 @@ import Popup from '@/components/popup/index.vue' ...@@ -67,7 +102,6 @@ import Popup from '@/components/popup/index.vue'
import config from '@/config' import config from '@/config'
import feedback from '@/utils/feedback' import feedback from '@/utils/feedback'
const emit = defineEmits(['success', 'close']) const emit = defineEmits(['success', 'close'])
const formRef = shallowRef<FormInstance>() const formRef = shallowRef<FormInstance>()
const popupRef = shallowRef<InstanceType<typeof Popup>>() const popupRef = shallowRef<InstanceType<typeof Popup>>()
...@@ -75,7 +109,7 @@ const mode = ref('add') ...@@ -75,7 +109,7 @@ const mode = ref('add')
const popupTitle = computed(() => { const popupTitle = computed(() => {
return mode.value == 'edit' ? '编辑效果图' : '新增效果图' return mode.value == 'edit' ? '编辑效果图' : '新增效果图'
}) })
const route = useRoute(); const route = useRoute()
const uploadPsdLoading = ref(false) const uploadPsdLoading = ref(false)
const formData = reactive({ const formData = reactive({
...@@ -139,62 +173,61 @@ const formRules: any = reactive({ ...@@ -139,62 +173,61 @@ const formRules: any = reactive({
}) })
const onChange = async (e: any) => { const onChange = async (e: any) => {
console.log(e); console.log(e)
uploadPsdLoading.value = true; uploadPsdLoading.value = true
let relativePath = e.response.data.relativePath; const relativePath = e.response.data.relativePath
let res = await apiPsdParser({ const res = await apiPsdParser({
lianjie: relativePath, lianjie: relativePath,
upload: 'oss' upload: 'oss'
}) })
if (res.data.width > 1600 || res.data.height > 1600) { if (res.data.width > 1600 || res.data.height > 1600) {
feedback.msgError("psd 最大可上传1600*1600像素"); feedback.msgError('psd 最大可上传1600*1600像素')
return return
} }
formData.img_url = res.data.img_url; formData.img_url = res.data.img_url
formData.psd_url = res.data.relativePath; formData.psd_url = res.data.relativePath
formData.psd_svg = res.data.svg; formData.psd_svg = res.data.svg
formData.psd_txt = res.data.txt; formData.psd_txt = res.data.txt
formData.dpi = res.data.dpi; formData.dpi = res.data.dpi
formData.width = res.data.width; formData.width = res.data.width
formData.height = res.data.height; formData.height = res.data.height
uploadPsdLoading.value = false; uploadPsdLoading.value = false
} }
const onError = (e: any) => { const onError = (e: any) => {
console.log(e); console.log(e)
} }
const handleSubmit = async () => { const handleSubmit = async () => {
await formRef.value?.validate(); await formRef.value?.validate()
let obj: any = { ...toRaw(formData) }; const obj: any = { ...toRaw(formData) }
if (obj.id === '') delete obj.id if (obj.id === '') delete obj.id
if (obj.id) delete obj.diy_id if (obj.id) delete obj.diy_id
mode.value == 'edit' ? await apiDiyTemplateXiaoguotuUpdate(obj) : await apiDiyTemplateXiaoguotuCreate(obj) mode.value == 'edit'
? await apiDiyTemplateXiaoguotuUpdate(obj)
: await apiDiyTemplateXiaoguotuCreate(obj)
popupRef.value?.close() popupRef.value?.close()
emit('success') emit('success')
} }
const colorList:any= ref([]); const colorList: any = ref([])
const getData = async () => { const getData = async () => {
let res:any = await apiDiyTemplateColorList({ const res: any = await apiDiyTemplateColorList({
diy_id: route.query.did diy_id: route.query.did
}) })
colorList.value = res.data.list; colorList.value = res.data.list
} }
const open = async (key = 'add', pager: any) => { const open = async (key = 'add', pager: any) => {
mode.value = key mode.value = key
popupRef.value?.open(); popupRef.value?.open()
await getData(); await getData()
} }
const setFormData = (data: Record<any, any>) => { const setFormData = (data: Record<any, any>) => {
...@@ -206,9 +239,8 @@ const setFormData = (data: Record<any, any>) => { ...@@ -206,9 +239,8 @@ const setFormData = (data: Record<any, any>) => {
} }
} }
const getDetail = async (row: Record<string, any>) => { const getDetail = async (row: Record<string, any>) => {
setFormData(row); setFormData(row)
} }
const handleClose = () => { const handleClose = () => {
......
src/views/product/xiaoguotu/index.vue
...@@ -4,15 +4,17 @@ ...@@ -4,15 +4,17 @@
<el-page-header :content="$route.meta.title" @back="goBack" /> <el-page-header :content="$route.meta.title" @back="goBack" />
</el-card> </el-card>
<el-card
<el-card class="!border-none mt-2" shadow="never" v-loading="pager.loading" v-if="activeTab=='xiaoguotu'"> class="!border-none mt-2"
shadow="never"
<el-tabs v-model="activeTab" class=" bg-white" > v-loading="pager.loading"
v-if="activeTab == 'xiaoguotu'"
>
<el-tabs v-model="activeTab" class="bg-white">
<el-tab-pane label="效果图" name="xiaoguotu"></el-tab-pane> <el-tab-pane label="效果图" name="xiaoguotu"></el-tab-pane>
<el-tab-pane label="颜色" name="color"></el-tab-pane> <el-tab-pane label="颜色" name="color"></el-tab-pane>
</el-tabs> </el-tabs>
<div class="mb-4 mt-2"> <div class="mb-4 mt-2">
<el-button type="primary" @click="handleAdd()"> <el-button type="primary" @click="handleAdd()">
<template #icon> <template #icon>
...@@ -23,14 +25,27 @@ ...@@ -23,14 +25,27 @@
</div> </div>
<div class="mt-2"> <div class="mt-2">
<el-table ref="tableRef" size="large" v-loading="pager.loading" :data="pager.lists" row-key="id" <el-table
:tree-props="{ children: 'children', hasChildren: 'hasChildren' }"> ref="tableRef"
size="large"
v-loading="pager.loading"
:data="pager.lists"
row-key="id"
:tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
>
<el-table-column label="ID" prop="id" /> <el-table-column label="ID" prop="id" />
<el-table-column label="主图"> <el-table-column label="主图">
<template #default="{ row }"> <template #default="{ row }">
<image-contain v-if="row.img_url" :src="getImageUrl(row.img_url, 200)" :width="80" :height="80" <image-contain
:preview-src-list="[row.img_url]" preview-teleported fit="contain" /> v-if="row.img_url"
:src="getImageUrl(row.img_url, 200)"
:width="80"
:height="80"
:preview-src-list="[row.img_url]"
preview-teleported
fit="contain"
/>
</template> </template>
</el-table-column> </el-table-column>
...@@ -43,8 +58,11 @@ ...@@ -43,8 +58,11 @@
</el-table-column> </el-table-column>
<el-table-column label="颜色" min-width="120"> <el-table-column label="颜色" min-width="120">
<template #default="{ row }"> <template #default="{ row }">
<div v-if="row.db_diy_color" > <div v-if="row.db_diy_color">
<div class="w-[20px] h-[20px]" :style="{background:row.db_diy_color.sezhi}"></div> <div
class="w-[20px] h-[20px]"
:style="{ background: row.db_diy_color.sezhi }"
></div>
<div>{{ row.db_diy_color.title }}</div> <div>{{ row.db_diy_color.title }}</div>
</div> </div>
<span v-else>未绑定</span> <span v-else>未绑定</span>
...@@ -57,7 +75,11 @@ ...@@ -57,7 +75,11 @@
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="创建时间" prop="create_date" min-width="120" /> <el-table-column
label="创建时间"
prop="create_date"
min-width="120"
/>
<el-table-column label="操作" width="120" fixed="right"> <el-table-column label="操作" width="120" fixed="right">
<template #default="{ row }"> <template #default="{ row }">
<el-button type="primary" link @click="handleEdit(row)"> <el-button type="primary" link @click="handleEdit(row)">
...@@ -72,34 +94,46 @@ ...@@ -72,34 +94,46 @@
</div> </div>
</el-card> </el-card>
<edit-popup v-if="showEdit" ref="editRef" @success="getLists" @close="showEdit = false" /> <edit-popup
v-if="showEdit"
ref="editRef"
<ColorPage :activeTab="activeTab" v-if="activeTab=='color'" @on-change="(e)=>{activeTab=e}"/> @success="getLists"
@close="showEdit = false"
/>
<ColorPage
:activeTab="activeTab"
v-if="activeTab == 'color'"
@on-change="
(e) => {
activeTab = e
}
"
/>
</div> </div>
</template> </template>
<script lang="ts" setup name="productFenlei"> <script lang="ts" setup name="productFenlei">
import {
import { apiDiyTemplateXiaoguotuList, apiDiyTemplateXiaoguotuDelete } from '@/api/product' apiDiyTemplateXiaoguotuList,
apiDiyTemplateXiaoguotuDelete
} from '@/api/product'
import { usePaging } from '@/hooks/usePaging' import { usePaging } from '@/hooks/usePaging'
import feedback from '@/utils/feedback' import feedback from '@/utils/feedback'
import EditPopup from './edit.vue' import EditPopup from './edit.vue'
import type { ElTable } from 'element-plus' import type { ElTable } from 'element-plus'
import useMultipleTabs from '@/hooks/useMultipleTabs' import useMultipleTabs from '@/hooks/useMultipleTabs'
import { getImageUrl } from "@/utils/getImgUrl"; import { getImageUrl } from '@/utils/getImgUrl'
import ColorPage from "../color/index.vue"; import ColorPage from '../color/index.vue'
const { removeTab } = useMultipleTabs() const { removeTab } = useMultipleTabs()
const route = useRoute(); const route = useRoute()
const router = useRouter(); const router = useRouter()
const goBack = () => { const goBack = () => {
removeTab(); removeTab()
router.go(-1); router.go(-1)
} }
const editRef = shallowRef<InstanceType<typeof EditPopup>>() const editRef = shallowRef<InstanceType<typeof EditPopup>>()
...@@ -112,26 +146,24 @@ const paramsData: any = reactive({ ...@@ -112,26 +146,24 @@ const paramsData: any = reactive({
diy_id: route.query.did diy_id: route.query.did
}) })
const { type } = defineProps(['type']); const { type } = defineProps(['type'])
type && (paramsData.type = type); type && (paramsData.type = type)
const { pager, getLists } = usePaging({ const { pager, getLists } = usePaging({
fetchFun: apiDiyTemplateXiaoguotuList, fetchFun: apiDiyTemplateXiaoguotuList,
params: paramsData params: paramsData
}) })
const handleAdd = async () => { const handleAdd = async () => {
showEdit.value = true; showEdit.value = true
await nextTick(); await nextTick()
editRef.value?.open('add', pager); editRef.value?.open('add', pager)
} }
const handleEdit = async (data: any) => { const handleEdit = async (data: any) => {
showEdit.value = true; showEdit.value = true
await nextTick(); await nextTick()
editRef.value?.open('edit', pager); editRef.value?.open('edit', pager)
editRef.value?.getDetail(data) editRef.value?.getDetail(data)
} }
...@@ -141,8 +173,5 @@ const handleDelete = async (id: number) => { ...@@ -141,8 +173,5 @@ const handleDelete = async (id: number) => {
getLists() getLists()
} }
getLists() getLists()
</script> </script>
src/views/user/setting.vue
...@@ -2,27 +2,43 @@ ...@@ -2,27 +2,43 @@
<template> <template>
<div class="user-setting"> <div class="user-setting">
<el-card class="!border-none" shadow="never"> <el-card class="!border-none" shadow="never">
<el-form ref="formRef" class="ls-form" :model="formData" :rules="rules" label-width="100px"> <el-form
ref="formRef"
class="ls-form"
:model="formData"
:rules="rules"
label-width="100px"
>
<el-form-item label="当前密码：" prop="password_3"> <el-form-item label="当前密码：" prop="password_3">
<div class="w-80"> <div class="w-80">
<el-input v-model.trim="formData.password_3" placeholder="修改密码时必填, 不修改密码时留空" type="password" <el-input
show-password /> v-model.trim="formData.password_3"
placeholder="修改密码时必填, 不修改密码时留空"
type="password"
show-password
/>
</div> </div>
</el-form-item> </el-form-item>
<el-form-item label="新的密码：" prop="password_1"> <el-form-item label="新的密码：" prop="password_1">
<div class="w-80"> <div class="w-80">
<el-input v-model.trim="formData.password_1" placeholder="修改密码时必填, 不修改密码时留空" type="password" <el-input
show-password /> v-model.trim="formData.password_1"
placeholder="修改密码时必填, 不修改密码时留空"
type="password"
show-password
/>
</div> </div>
</el-form-item> </el-form-item>
<el-form-item label="确定密码：" prop="password_2"> <el-form-item label="确定密码：" prop="password_2">
<div class="w-80"> <div class="w-80">
<el-input v-model.trim="formData.password_2" placeholder="修改密码时必填, 不修改密码时留空" type="password" <el-input
show-password /> v-model.trim="formData.password_2"
placeholder="修改密码时必填, 不修改密码时留空"
type="password"
show-password
/>
</div> </div>
</el-form-item> </el-form-item>
</el-form> </el-form>
...@@ -72,10 +88,8 @@ const rules = reactive<object>({ ...@@ -72,10 +88,8 @@ const rules = reactive<object>({
] ]
}) })
// 设置个人设置 // 设置个人设置
const setUser = async () => { const setUser = async () => {
if (formData.password_3 || formData.password_1 || formData.password_2) { if (formData.password_3 || formData.password_1 || formData.password_2) {
if (!formData.password_3) { if (!formData.password_3) {
return feedback.msgError('请输入当前密码') return feedback.msgError('请输入当前密码')
...@@ -107,8 +121,8 @@ const setUser = async () => { ...@@ -107,8 +121,8 @@ const setUser = async () => {
} }
await setUserInfo(formData) await setUserInfo(formData)
feedback.msgSuccess("操作成功"); feedback.msgSuccess('操作成功')
userStore.getUserInfo(); userStore.getUserInfo()
} }
// 提交数据 // 提交数据
...@@ -116,7 +130,6 @@ const handleSubmit = async () => { ...@@ -116,7 +130,6 @@ const handleSubmit = async () => {
await formRef.value?.validate() await formRef.value?.validate()
setUser() setUser()
} }
</script> </script>
<style lang="scss" scoped></style> <style lang="scss" scoped></style>
src/views/userSave/item/index.vue
...@@ -5,59 +5,105 @@ ...@@ -5,59 +5,105 @@
</el-card> </el-card>
<template v-if="data"> <template v-if="data">
<el-card class="!border-none mt-2" shadow="never"> <el-card class="!border-none mt-2" shadow="never">
<el-descriptions class="margin-top" :title="data.sku + ' ' + data.db_diy.title" :column="3" :border="true"> <el-descriptions
class="margin-top"
:title="data.sku + ' ' + data.db_diy.title"
:column="3"
:border="true"
>
<template #extra> <template #extra>
<div class="flex"> <div class="flex">
<div> <div>
<el-tag size="large" type="warning" v-if="data.xgt_status == 9">效果图待生成</el-tag> <el-tag size="large" type="warning" v-if="data.xgt_status == 9"
<el-tag size="large" type="success" v-else-if="data.xgt_status == 1">效果图已生成</el-tag> >效果图待生成</el-tag
>
<el-tag
size="large"
type="success"
v-else-if="data.xgt_status == 1"
>效果图已生成</el-tag
>
<el-tag size="large" type="danger" v-else>效果图失败</el-tag> <el-tag size="large" type="danger" v-else>效果图失败</el-tag>
</div> </div>
<div class="ml-3"> <div class="ml-3">
<el-tag size="large" type="warning" v-if="data.status == 9">总待生成</el-tag> <el-tag size="large" type="warning" v-if="data.status == 9"
<el-tag size="large" type="success" v-else-if="data.status == 1">总已生成</el-tag> >总待生成</el-tag
>
<el-tag size="large" type="success" v-else-if="data.status == 1"
>总已生成</el-tag
>
<el-tag size="large" type="danger" v-else>总失败</el-tag> <el-tag size="large" type="danger" v-else>总失败</el-tag>
</div> </div>
</div> </div>
</template> </template>
<el-descriptions-item label="SKU">{{
<el-descriptions-item label="SKU">{{ data.sku }}</el-descriptions-item> data.sku
<el-descriptions-item label="自定义编码">{{ data.bianma }}</el-descriptions-item> }}</el-descriptions-item>
<el-descriptions-item label="模板SKU">{{ data.db_diy.sku }}</el-descriptions-item> <el-descriptions-item label="自定义编码">{{
data.bianma
<el-descriptions-item label="用户昵称">{{ data.db_diy_user.name }}</el-descriptions-item> }}</el-descriptions-item>
<el-descriptions-item label="用户SKU">{{ data.db_diy_user.sku }}</el-descriptions-item> <el-descriptions-item label="模板SKU">{{
data.db_diy.sku
<el-descriptions-item label="回调地址">{{ data.callback }}</el-descriptions-item> }}</el-descriptions-item>
<el-descriptions-item label="创建时间">{{ data.create_date }}</el-descriptions-item>
<el-descriptions-item label="效果图完成时间">{{ data.xgt_update_date }}</el-descriptions-item> <el-descriptions-item label="用户昵称">{{
<el-descriptions-item label="总完成时间">{{ data.update_date }}</el-descriptions-item> data.db_diy_user.name
}}</el-descriptions-item>
<el-descriptions-item label="用户SKU">{{
data.db_diy_user.sku
}}</el-descriptions-item>
<el-descriptions-item label="回调地址">{{
data.callback
}}</el-descriptions-item>
<el-descriptions-item label="创建时间">{{
data.create_date
}}</el-descriptions-item>
<el-descriptions-item label="效果图完成时间">{{
data.xgt_update_date
}}</el-descriptions-item>
<el-descriptions-item label="总完成时间">{{
data.update_date
}}</el-descriptions-item>
</el-descriptions> </el-descriptions>
</el-card> </el-card>
<el-card class="!border-none mt-2" shadow="never"> <el-card class="!border-none mt-2" shadow="never">
<div class=" font-bold">用户设计图</div> <div class="font-bold">用户设计图</div>
<div class="mt-2"> <div class="mt-2">
<image-contain v-for="item in data.face_list" :src="getImageUrl(item.img_url || morenImg, 100)" <image-contain
:width="80" :height="80" :preview-src-list="[getImageUrl(item.img_url || morenImg)]" v-for="(item,index) in data.face_list"
preview-teleported fit="contain" /> :key="index"
:src="getImageUrl(item.img_url || morenImg, 100)"
:width="80"
:height="80"
:preview-src-list="[getImageUrl(item.img_url || morenImg)]"
preview-teleported
fit="contain"
/>
</div> </div>
</el-card> </el-card>
<el-card class="!border-none mt-2" shadow="never"> <el-card class="!border-none mt-2" shadow="never">
<div class=" font-bold">效果图</div> <div class="font-bold">效果图</div>
<div class="mt-4"> <div class="mt-4">
<image-contain v-for="item in data.xiaoguotu_list" :src="getImageUrl(item.img_url || morenImg, 100)" <image-contain
:width="80" :height="80" :preview-src-list="[getImageUrl(item.img_url || morenImg)]" v-for="(item,i) in data.xiaoguotu_list"
preview-teleported fit="contain" /> :key="i"
:src="getImageUrl(item.img_url || morenImg, 100)"
:width="80"
:height="80"
:preview-src-list="[getImageUrl(item.img_url || morenImg)]"
preview-teleported
fit="contain"
/>
</div> </div>
</el-card> </el-card>
<el-card class="!border-none mt-2" shadow="never"> <el-card class="!border-none mt-2" shadow="never">
<div class=" font-bold">尺码图</div> <div class="font-bold">尺码图</div>
<div class="flex mt-4"> <div class="flex mt-4">
<el-table class="mt-4" size="large" :data="data.chima_list"> <el-table class="mt-4" size="large" :data="data.chima_list">
<el-table-column label="标题" prop="title"></el-table-column> <el-table-column label="标题" prop="title"></el-table-column>
...@@ -65,7 +111,9 @@ ...@@ -65,7 +111,9 @@
<el-table-column label="文件路径"> <el-table-column label="文件路径">
<template #default="{ row }"> <template #default="{ row }">
<el-button link type="primary" v-if="row.img_url"> <el-button link type="primary" v-if="row.img_url">
<a :href="getImageUrl(row.img_url)" target="_blank">{{row.img_url}}</a> <a :href="getImageUrl(row.img_url)" target="_blank">{{
row.img_url
}}</a>
</el-button> </el-button>
<div v-else>未生成</div> <div v-else>未生成</div>
</template> </template>
...@@ -84,31 +132,29 @@ ...@@ -84,31 +132,29 @@
</div> </div>
</template> </template>
<script lang="ts" setup name="productFenlei"> <script lang="ts" setup name="productFenlei">
import type { ElTable } from 'element-plus' import type { ElTable } from 'element-plus'
import useMultipleTabs from '@/hooks/useMultipleTabs' import useMultipleTabs from '@/hooks/useMultipleTabs'
import { getImageUrl } from "@/utils/getImgUrl"; import { getImageUrl } from '@/utils/getImgUrl'
import { apiDiyUserSaveItem } from "@/api/member" import { apiDiyUserSaveItem } from '@/api/member'
const morenImg = 'https://foxpsd.com/diy/shop/images/xiaoguotu.jpg'; const morenImg = 'https://foxpsd.com/diy/shop/images/xiaoguotu.jpg'
const { removeTab } = useMultipleTabs() const { removeTab } = useMultipleTabs()
const router = useRouter(); const router = useRouter()
const route = useRoute(); const route = useRoute()
const goBack = () => { const goBack = () => {
removeTab(); removeTab()
router.go(-1); router.go(-1)
} }
const data = ref(); const data = ref()
const getData = async () => { const getData = async () => {
let res: any = await apiDiyUserSaveItem({ sku: route.query.sku }) const res: any = await apiDiyUserSaveItem({ sku: route.query.sku })
data.value = res.data; data.value = res.data
} }
const getHouzhui = (url: string): boolean => { const getHouzhui = (url: string): boolean => {
if (/\.(svg|tiff)$/.test(url)) { if (/\.(svg|tiff)$/.test(url)) {
return true return true
...@@ -118,13 +164,10 @@ const getHouzhui = (url: string): boolean => { ...@@ -118,13 +164,10 @@ const getHouzhui = (url: string): boolean => {
} }
onActivated(() => { onActivated(() => {
getData(); getData()
}) })
onMounted(() => { onMounted(() => {
getData(); getData()
}) })
</script> </script>
src/views/userSave/lists/index.vue
<template> <template>
<div class="article-lists"> <div class="article-lists">
<el-card class="!border-none" shadow="never"> <el-card class="!border-none" shadow="never">
<el-form ref="formRef" class="mb-[-16px]" @submit.native.prevent :model="queryParams" :inline="true"> <el-form
ref="formRef"
class="mb-[-16px]"
@submit.native.prevent
:model="queryParams"
:inline="true"
>
<el-form-item label="编号/标题"> <el-form-item label="编号/标题">
<el-input class="w-[280px]" v-model="queryParams.content" clearable @keyup.enter="resetPage" /> <el-input
class="w-[280px]"
v-model="queryParams.content"
clearable
@keyup.enter="resetPage"
/>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-button type="primary" @click="resetPage">查询</el-button> <el-button type="primary" @click="resetPage">查询</el-button>
...@@ -15,14 +26,29 @@ ...@@ -15,14 +26,29 @@
<el-card class="!border-none mt-4" shadow="never"> <el-card class="!border-none mt-4" shadow="never">
<div class="flex justify-between"> <div class="flex justify-between">
<div class="flex mb-4"> <div class="flex mb-4">
<el-button type="primary" @click="downUserSave(selectData.join(','))" :disabled="selectData.length>0?false:true">批量下载</el-button> <el-button
<el-button type="danger" @click="handleDelete(selectData.join(','))" :disabled="selectData.length>0?false:true">批量删除</el-button> type="primary"
@click="downUserSave(selectData.join(','))"
:disabled="selectData.length > 0 ? false : true"
>批量下载</el-button
>
<el-button
type="danger"
@click="handleDelete(selectData.join(','))"
:disabled="selectData.length > 0 ? false : true"
>批量删除</el-button
>
</div> </div>
<pagination v-model="pager" @change="getLists" /> <pagination v-model="pager" @change="getLists" />
</div> </div>
<el-table class="mt-4" @selection-change="handleSelectionChange" size="large" v-loading="pager.loading" <el-table
:data="pager.lists"> class="mt-4"
@selection-change="handleSelectionChange"
size="large"
v-loading="pager.loading"
:data="pager.lists"
>
<el-table-column type="selection" width="55" /> <el-table-column type="selection" width="55" />
<el-table-column label="SKU" width="200"> <el-table-column label="SKU" width="200">
<template #default="{ row }"> <template #default="{ row }">
...@@ -34,25 +60,41 @@ ...@@ -34,25 +60,41 @@
</div> </div>
<div v-copy="row.sku" class="flex items-center"> <div v-copy="row.sku" class="flex items-center">
<el-button link type="primary">复制</el-button> <el-button link type="primary">复制</el-button>
<icon class="ml-2" :size="14" color="#38f" name="el-icon-DocumentCopy" /> <icon
class="ml-2"
:size="14"
color="#38f"
name="el-icon-DocumentCopy"
/>
</div> </div>
</div> </div>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="基础信息" width="150" > <el-table-column label="基础信息" width="150">
<template #default="{ row }"> <template #default="{ row }">
<div v-if="row.db_diy">模板标题：{{ row.db_diy.title }}</div> <div v-if="row.db_diy">模板标题：{{ row.db_diy.title }}</div>
<div>自定义编码：{{row.bianma}}</div> <div>自定义编码：{{ row.bianma }}</div>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="用户设计图" min-width="150"> <el-table-column label="用户设计图" min-width="150">
<template #default="{ row }"> <template #default="{ row }">
<div class="flex flex-wrap relative" v-if="row.face_list.length > 0"> <div
<image-contain v-for="item in row.face_list" :src="getImageUrl(item.img_url || morenImg, 100)" class="flex flex-wrap relative"
:width="50" :height="50" :preview-src-list="[getImageUrl(item.img_url || morenImg)]" v-if="row.face_list.length > 0"
preview-teleported fit="contain" class="mr-2 mb-2"/> >
<image-contain
v-for="(item, index) in row.face_list"
:key="index"
:src="getImageUrl(item.img_url || morenImg, 100)"
:width="50"
:height="50"
:preview-src-list="[getImageUrl(item.img_url || morenImg)]"
preview-teleported
fit="contain"
class="mr-2 mb-2"
/>
</div> </div>
<div v-else>-</div> <div v-else>-</div>
</template> </template>
...@@ -60,35 +102,43 @@ ...@@ -60,35 +102,43 @@
<el-table-column label="效果图" min-width="150"> <el-table-column label="效果图" min-width="150">
<template #default="{ row }"> <template #default="{ row }">
<div class="flex flex-wrap relative" v-if="row.xiaoguotu_list.length > 0"> <div
<image-contain v-for="item in row.xiaoguotu_list" class="flex flex-wrap relative"
:src="getImageUrl(item.img_url || morenImg, 100)" :width="50" :height="50" v-if="row.xiaoguotu_list.length > 0"
:preview-src-list="[getImageUrl(item.img_url || morenImg)]" preview-teleported >
fit="contain" class="mr-2 mb-2"/> <image-contain
v-for="(item, index) in row.xiaoguotu_list"
:key="index"
:src="getImageUrl(item.img_url || morenImg, 100)"
:width="50"
:height="50"
:preview-src-list="[getImageUrl(item.img_url || morenImg)]"
preview-teleported
fit="contain"
class="mr-2 mb-2"
/>
</div> </div>
<div v-else>-</div> <div v-else>-</div>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="尺码图" min-width="150"> <el-table-column label="尺码图" min-width="150">
<template #default="{ row }"> <template #default="{ row }">
<div class="flex relative" v-if="row.chima_list.length > 0"> <div class="flex relative" v-if="row.chima_list.length > 0">
<router-link :to="`/userSave/lists/item?sku=${row.sku}`"> <router-link :to="`/userSave/lists/item?sku=${row.sku}`">
<el-button type="primary" link> <el-button type="primary" link> 点击查看 </el-button>
点击查看
</el-button>
</router-link> </router-link>
</div> </div>
<div v-else>-</div> <div v-else>-</div>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="效果图状态"> <el-table-column label="效果图状态">
<template #default="{ row }"> <template #default="{ row }">
<el-tag type="success" v-if="row.xgt_status == 1">已生成</el-tag> <el-tag type="success" v-if="row.xgt_status == 1">已生成</el-tag>
<el-tag type="warning" v-else-if="row.xgt_status == 9">待生成</el-tag> <el-tag type="warning" v-else-if="row.xgt_status == 9"
>待生成</el-tag
>
<el-tag type="danger" v-else>失败</el-tag> <el-tag type="danger" v-else>失败</el-tag>
</template> </template>
</el-table-column> </el-table-column>
...@@ -103,9 +153,18 @@ ...@@ -103,9 +153,18 @@
<el-table-column label="时间" width="180"> <el-table-column label="时间" width="180">
<template #default="{ row }"> <template #default="{ row }">
<div>创建时间：<div>{{ row.create_date }}</div></div> <div>
<div>效果图完成时间：<div>{{ row.xgt_update_date }}</div></div> 创建时间：
<div>总完成时间：<div>{{ row.update_date }}</div></div> <div>{{ row.create_date }}</div>
</div>
<div>
效果图完成时间：
<div>{{ row.xgt_update_date }}</div>
</div>
<div>
总完成时间：
<div>{{ row.update_date }}</div>
</div>
</template> </template>
</el-table-column> </el-table-column>
...@@ -113,9 +172,7 @@ ...@@ -113,9 +172,7 @@
<template #default="{ row }"> <template #default="{ row }">
<div class=""> <div class="">
<router-link :to="`/userSave/lists/item?sku=${row.sku}`"> <router-link :to="`/userSave/lists/item?sku=${row.sku}`">
<el-button type="primary" link> <el-button type="primary" link> 详情 </el-button>
详情
</el-button>
</router-link> </router-link>
</div> </div>
...@@ -139,22 +196,31 @@ ...@@ -139,22 +196,31 @@
</div> </div>
</el-card> </el-card>
<RenderChima v-if="showEdit" ref="editRef" @success="getLists" @close="showEdit = false" /> <RenderChima
v-if="showEdit"
ref="editRef"
@success="getLists"
@close="showEdit = false"
/>
</div> </div>
</template> </template>
<script lang="ts" setup name="productLists"> <script lang="ts" setup name="productLists">
import { apiDiyUserSaveList, apiDiyUserSaveDelete,apiDiyUserDownCreate} from "@/api/member" import {
apiDiyUserSaveList,
apiDiyUserSaveDelete,
apiDiyUserDownCreate
} from '@/api/member'
import { usePaging } from '@/hooks/usePaging' import { usePaging } from '@/hooks/usePaging'
import feedback from '@/utils/feedback' import feedback from '@/utils/feedback'
import { getImageUrl } from "@/utils/getImgUrl"; import { getImageUrl } from '@/utils/getImgUrl'
import RenderChima from "./renderChima.vue" import RenderChima from './renderChima.vue'
const showEdit = ref(false) const showEdit = ref(false)
const editRef = shallowRef<InstanceType<typeof RenderChima>>() const editRef = shallowRef<InstanceType<typeof RenderChima>>()
const morenImg = 'https://foxpsd.com/diy/shop/images/xiaoguotu.jpg'; const morenImg = 'https://foxpsd.com/diy/shop/images/xiaoguotu.jpg'
const queryParams = reactive({ const queryParams = reactive({
content: '', content: ''
}) })
const { pager, getLists, resetPage, resetParams } = usePaging({ const { pager, getLists, resetPage, resetParams } = usePaging({
...@@ -167,29 +233,25 @@ const handleSelectionChange = (val: any[]) => { ...@@ -167,29 +233,25 @@ const handleSelectionChange = (val: any[]) => {
selectData.value = val.map(({ sku }) => sku) selectData.value = val.map(({ sku }) => sku)
} }
const downUserSave =async (skus: string) => { const downUserSave = async (skus: string) => {
await feedback.confirm('确定要下载吗？') await feedback.confirm('确定要下载吗？')
await apiDiyUserDownCreate({ skus }) await apiDiyUserDownCreate({ skus })
feedback.msgSuccess("操作成功") feedback.msgSuccess('操作成功')
getLists() getLists()
} }
const handleDelete = async (skus: string) => { const handleDelete = async (skus: string) => {
await feedback.confirm('确定要删除？') await feedback.confirm('确定要删除？')
await apiDiyUserSaveDelete({ skus }) await apiDiyUserSaveDelete({ skus })
getLists() getLists()
} }
const handleAdd = async (row: any) => {
showEdit.value = true
const handleAdd = async (row:any) => { await nextTick()
showEdit.value = true; editRef.value?.open('add', row)
await nextTick();
editRef.value?.open('add',row);
} }
onActivated(() => { onActivated(() => {
getLists() getLists()
}) })
...@@ -197,8 +259,6 @@ onActivated(() => { ...@@ -197,8 +259,6 @@ onActivated(() => {
onMounted(() => { onMounted(() => {
getLists() getLists()
}) })
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
...@@ -206,7 +266,6 @@ onMounted(() => { ...@@ -206,7 +266,6 @@ onMounted(() => {
.title { .title {
font-weight: bold; font-weight: bold;
} }
} }
.foxpsd_box { .foxpsd_box {
...@@ -246,10 +305,7 @@ onMounted(() => { ...@@ -246,10 +305,7 @@ onMounted(() => {
margin-right: 5px; margin-right: 5px;
} }
} }
} }
} }
.nav_her_btn { .nav_her_btn {
...@@ -259,4 +315,5 @@ onMounted(() => { ...@@ -259,4 +315,5 @@ onMounted(() => {
font-size: 18px; font-size: 18px;
color: #38f; color: #38f;
cursor: pointer; cursor: pointer;
}</style> }
\ No newline at end of file </style>
src/views/userSave/lists/renderChima.vue
<template> <template>
<div class="edit-popup"> <div class="edit-popup">
<popup ref="popupRef" title="重新生成指定尺码" :async="true" width="800px" @confirm="handleSubmit" @close="handleClose"> <popup
<el-form ref="formRef" :model="formData" label-width="160px" :rules="formRules" class="w-[90%]" v-if="diy"> ref="popupRef"
title="重新生成指定尺码"
:async="true"
width="800px"
@confirm="handleSubmit"
@close="handleClose"
>
<el-form
ref="formRef"
:model="formData"
label-width="160px"
:rules="formRules"
class="w-[90%]"
v-if="diy"
>
<el-form-item label="选择尺码" prop="chima_id"> <el-form-item label="选择尺码" prop="chima_id">
<el-select v-model="formData.chima_id" placeholder="请选择要生成的尺码"> <el-select
<el-option :value="item.id" :label="'标题：'+item.title + ' 编码：' + item.bianma" v-model="formData.chima_id"
v-for="item in diy.chimaList"></el-option> placeholder="请选择要生成的尺码"
>
<el-option
v-for="(item, i) in diy.chimaList"
:value="item.id"
:label="'标题：' + item.title + ' 编码：' + item.bianma"
:key="i"
></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
...@@ -20,31 +40,32 @@ ...@@ -20,31 +40,32 @@
<el-form-item label="额外关联的数据" prop="posts_content"> <el-form-item label="额外关联的数据" prop="posts_content">
<div class="w-full"> <div class="w-full">
<el-input v-model="formData.posts_content" placeholder="JSON格式" type="textarea" <el-input
:autosize="{ minRows: 3, maxRows: 3 }" maxlength="200" show-word-limit clearable /> v-model="formData.posts_content"
placeholder="JSON格式"
type="textarea"
:autosize="{ minRows: 3, maxRows: 3 }"
maxlength="200"
show-word-limit
clearable
/>
<div>非必填，没有可以不写</div> <div>非必填，没有可以不写</div>
<div> <div>
<div>结构演示</div> <div>结构演示</div>
[ [ { "name":"素材",
{ "content":"https://img.foxpsd.com/images%2Fth3.jpg" } ]
"name":"素材",
"content":"https://img.foxpsd.com/images%2Fth3.jpg"
}
]
</div> </div>
</div> </div>
</el-form-item> </el-form-item>
</el-form> </el-form>
</popup> </popup>
</div> </div>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import type { FormInstance } from 'element-plus' import type { FormInstance } from 'element-plus'
import { apiDiyTemplateItem } from '@/api/product' import { apiDiyTemplateItem } from '@/api/product'
import { apiDiyUserSaveChimaRender } from "@/api/member"; import { apiDiyUserSaveChimaRender } from '@/api/member'
import Popup from '@/components/popup/index.vue' import Popup from '@/components/popup/index.vue'
const emit = defineEmits(['success', 'close']) const emit = defineEmits(['success', 'close'])
...@@ -54,9 +75,9 @@ const mode = ref('add') ...@@ -54,9 +75,9 @@ const mode = ref('add')
const formData = reactive({ const formData = reactive({
chima_id: '', chima_id: '',
sku:'', sku: '',
posts_content: '', posts_content: '',
sc_img_type:1 sc_img_type: 1
}) })
const formRules: any = reactive({ const formRules: any = reactive({
...@@ -69,15 +90,14 @@ const formRules: any = reactive({ ...@@ -69,15 +90,14 @@ const formRules: any = reactive({
] ]
}) })
const handleSubmit = async () => { const handleSubmit = async () => {
await formRef.value?.validate(); await formRef.value?.validate()
let obj: any = { ...toRaw(formData) }; const obj: any = { ...toRaw(formData) }
if(obj.posts_content){ if (obj.posts_content) {
obj.posts = JSON.parse(obj.posts_content); obj.posts = JSON.parse(obj.posts_content)
delete obj.posts_content; delete obj.posts_content
} }
await apiDiyUserSaveChimaRender(obj) await apiDiyUserSaveChimaRender(obj)
...@@ -85,11 +105,11 @@ const handleSubmit = async () => { ...@@ -85,11 +105,11 @@ const handleSubmit = async () => {
emit('success') emit('success')
} }
const userSaveItem = ref(); const userSaveItem = ref()
const diy = ref(); const diy = ref()
const getData = async (sku: string) => { const getData = async (sku: string) => {
let res = await apiDiyTemplateItem({ const res = await apiDiyTemplateItem({
sku sku
}) })
diy.value = res.data diy.value = res.data
...@@ -97,14 +117,13 @@ const getData = async (sku: string) => { ...@@ -97,14 +117,13 @@ const getData = async (sku: string) => {
} }
const open = (key = 'add', row: any) => { const open = (key = 'add', row: any) => {
userSaveItem.value = row; userSaveItem.value = row
formData.sku = row.sku; formData.sku = row.sku
getData(row.db_diy.sku) getData(row.db_diy.sku)
mode.value = key mode.value = key
popupRef.value?.open(); popupRef.value?.open()
} }
const setFormData = (data: Record<any, any>) => { const setFormData = (data: Record<any, any>) => {
for (const key in formData) { for (const key in formData) {
if (data[key] != null && data[key] != undefined) { if (data[key] != null && data[key] != undefined) {
...@@ -114,11 +133,8 @@ const setFormData = (data: Record<any, any>) => { ...@@ -114,11 +133,8 @@ const setFormData = (data: Record<any, any>) => {
} }
} }
const getDetail = async (row: Record<string, any>) => { const getDetail = async (row: Record<string, any>) => {
setFormData(row); setFormData(row)
} }
const handleClose = () => { const handleClose = () => {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment