Skip to content

T
topsun-baoshen-excel
Commit 304cb871 authored by 何远江's avatar 何远江
Browse files
Options

添加excel订单解析，优化页面，删除无用菜单

parent 10f577e1
Show whitespace changes
Inline Side-by-side
Showing with 944 additions and 390 deletions
Dockerfile 0 → 100644
View file @ 304cb871
FROM nginx
MAINTAINER tanghao@163.com
VOLUME /tmp
ENV LANG en_US.UTF-8
RUN echo "server { \
listen 80; \
client_max_body_size 50M; \
location /api/ { \
proxy_pass http://192.168.3.91:10000/; \
proxy_redirect off; \
proxy_set_header Host topsun-excel-order; \
proxy_set_header X-Real-IP \$remote_addr; \
proxy_set_header X-Forwarded-For \$proxy_add_x_forwarded_for; \
} \
#解决Router(mode: 'history')模式下，刷新路由地址不能找到页面的问题 \
location / { \
root /var/www/html/; \
index index.html index.htm; \
if (!-e \$request_filename) { \
rewrite ^(.*)\$ /index.html?s=\$1 last; \
break; \
} \
} \
access_log /var/log/nginx/access.log ; \
} " > /etc/nginx/conf.d/default.conf \
&& mkdir -p /var/www \
&& mkdir -p /var/www/html
ADD dist/ /var/www/html/
EXPOSE 80
EXPOSE 443
package.json
View file @ 304cb871
......@@ -19,6 +19,7 @@
"loadsh": "^0.0.4",
"luckyexcel": "^1.0.1",
"pinia": "^2.1.7",
"pinia-plugin-persistedstate": "^3.2.1",
"sass": "^1.69.5",
"vue": "^3.3.4",
"vue-router": "^4.2.5",
......
src/api/common.ts
View file @ 304cb871
import axios from 'axios'
import axios from '@/utils/http'
const formHeader = {
'Content-Type': 'application/x-www-form-urlencoded;charset=UTF-8'
}
......
src/api/customer.ts
View file @ 304cb871
import axios from 'axios'
import axios from '@/utils/http'
const formHeader = {
'Content-Type': 'application/x-www-form-urlencoded;charset=UTF-8'
}
......@@ -56,3 +57,15 @@ export const addUserOrderFileConf = (data: any) => {
export const editUserOrderFileConf = (data: any) => {
return axios.post('/api/userOrderFileConf/edit', data)
}
/**
* 获取用户
* @param data
* @returns
*/
export const getUserList = (params: any) => {
return axios.get('/api/sysUser/page', {
params,
headers: formHeader
})
}
src/api/email.ts
View file @ 304cb871
import axios from 'axios'
import axios from '@/utils/http'
const formHeader = {
'Content-Type': 'application/x-www-form-urlencoded;charset=UTF-8'
}
......
src/api/excel.ts
View file @ 304cb871
import axios from 'axios'
import axios from '@/utils/http'
const formHeader = {
'Content-Type': 'application/x-www-form-urlencoded;charset=UTF-8'
}
......@@ -71,9 +72,9 @@ export const getExcelOrderIndex = (fileId: string) => {
* @param {String} productCode
* @returns
*/
export const getVariableField = (productCode: any) => {
export const getVariableField = (excelOrderId: any) => {
return axios.get('/api/excel/variableField', {
params: { productCode },
params: { excelOrderId },
headers: formHeader
})
}
......
src/api/order.ts
View file @ 304cb871
import axios from 'axios'
import axios from '@/utils/http'
const formHeader = {
'Content-Type': 'application/x-www-form-urlencoded;charset=UTF-8'
}
......@@ -90,3 +91,27 @@ export const confirmExcelFileOrderById = (excelOrderId: string) => {
headers: formHeader
})
}
/** 根据订单文件获取订单字段配置 */
export const getConfByExcelOrderId = (excelOrderId: string) => {
return axios.get('/api/excelFileOrder/getConfByExcelOrderId', {
params: { excelOrderId },
headers: formHeader
})
}
/** 转换订单记录 */
export const convertOrderPage = (params: any) => {
return axios.get('/api/convertOrder/page', {
params,
headers: formHeader
})
}
/** 批量删除记录 */
export const convertOrderBatchDeleteById = (ids: any) => {
return axios.get('/api/convertOrder/batchDeleteById', {
params: { ids },
headers: formHeader
})
}
src/api/product.ts
View file @ 304cb871
import axios from 'axios'
import axios from '@/utils/http'
const formHeader = {
'Content-Type': 'application/x-www-form-urlencoded;charset=UTF-8'
}
......@@ -76,12 +76,12 @@ export const deleteProductCategorys = (ids: string) => {
}
/**
* 获取产品对照表
* 获取产品对照列表
* @param params
* @returns
*/
export const getProductCompareList = (params: any) => {
return axios.get('/api/productCompare/page', {
export const getExcelProdFileConfPage = (params: any) => {
return axios.get('/api/excelProductFileConf/page', {
params,
headers: formHeader
})
......@@ -92,6 +92,13 @@ export const getProductCompareList = (params: any) => {
* @param data
* @returns
*/
export const saveProductCompare = (data: any) => {
return axios.post('/api/productCompare/add', data)
export const saveExcelProdFileConf = (data: any) => {
return axios.post('/api/excelProductFileConf/add', data)
}
export const deleteExcelProdFileConfByIds = (ids: string) => {
return axios.get('/api/excelProductFileConf/batchDeleteByIds', {
params: {ids},
headers: formHeader
})
}
\ No newline at end of file
src/components/CustomerModal/CustomerModal.vue
View file @ 304cb871
......@@ -14,9 +14,7 @@
<el-form-item label="客户名称">
<el-input v-model="formState.customerName"></el-input>
</el-form-item>
<el-form-item label="客户类型">
<el-select v-model="formState.customerType"> </el-select>
</el-form-item>
<el-form-item>
<el-button @click="resetForm">重置</el-button>
<el-button @click="queryCustomer" type="primary">查询</el-button>
......@@ -27,11 +25,7 @@
<vxe-column type="checkbox" width="40"></vxe-column>
<!-- <vxe-column field="customerId" title="客户id"></vxe-column> -->
<vxe-column field="customerName" title="客户名称"></vxe-column>
<vxe-column field="customerType" title="客户类型">
<template #default="{ row }">
{{ row.customerType === 'brand' ? '品牌' : '工厂' }}
</template>
</vxe-column>
<vxe-column field="customerNickName" title="客户简称"></vxe-column>
</vxe-table>
<vxe-pager
......
src/components/ProductModal/ProductModal.vue
View file @ 304cb871
......@@ -16,9 +16,9 @@
<vxe-table ref="xTable" border :data="tableData" :loading="loading" size="mini" height="400">
<vxe-column type="checkbox" width="40"></vxe-column>
<vxe-column field="productId" title="产品id"></vxe-column>
<vxe-column field="productCode" title="产品编码" width="200"></vxe-column>
<vxe-column field="productName" title="产品名称"></vxe-column>
<vxe-column field="brandName" title="产品品牌"></vxe-column>
<vxe-column field="productCategoryId_dictText" title="产品类型" width="200"></vxe-column>
</vxe-table>
<vxe-pager
......
src/components/UserModal/UserModal.vue 0 → 100644
View file @ 304cb871
<template>
<vxe-modal
v-model="showEdit"
:z-index="1006"
@hide="onHide"
title="用户选择"
width="800"
esc-closable
mask-closable
show-footer
>
<template #default>
<el-form :model="formState" size="small" inline>
<el-form-item label="用户名称">
<el-input v-model="formState.nickName"></el-input>
</el-form-item>
<el-form-item>
<el-button @click="resetForm">重置</el-button>
<el-button @click="queryUser" type="primary">查询</el-button>
</el-form-item>
</el-form>
<vxe-table ref="xTable" border :data="tableData" :loading="loading" size="small" height="400">
<vxe-column type="checkbox" width="40"></vxe-column>
<vxe-column field="nickName" title="用户名称"></vxe-column>
<vxe-column field="phonenumber" title="联系电话"></vxe-column>
<vxe-column field="email" title="邮箱"></vxe-column>
</vxe-table>
<vxe-pager
size="small"
background
v-model:current-page="formState.currentPage"
v-model:page-size="formState.pageSize"
:total="formState.total"
@page-change="queryUser"
:layouts="['PrevPage', 'JumpNumber', 'NextPage', 'Sizes', 'FullJump', 'Total']"
>
</vxe-pager>
</template>
<template #footer>
<el-button type="primary" @click="confirmModal">确认</el-button>
</template>
</vxe-modal>
</template>
<script lang="ts">
import { defineComponent, ref, onMounted, reactive, watch } from 'vue'
import { getUserList } from '@/api/customer'
import type { VxeTableInstance } from 'vxe-table'
export default defineComponent({
name: 'UserModal',
props: {
visible: {
type: Boolean,
default: false
}
},
emits: ['confirm', 'update:visible'],
setup(props, { emit }) {
const loading = ref(false)
const showEdit = ref(false)
const xTable = ref<VxeTableInstance>()
const tableData = ref([])
const formState = reactive({
nickName: '',
currentPage: 1,
pageSize: 10,
total: 0
})
watch(
() => props.visible,
(val) => {
showEdit.value = val
}
)
const resetForm = () => {
}
const queryUser = async () => {
loading.value = true
try {
const { data } = await getUserList(formState)
tableData.value = data.result.records
formState.total = +data.result.total
} catch {}
loading.value = false
}
const confirmModal = () => {
const list = xTable.value?.getCheckboxRecords()
emit('confirm', list)
emit('update:visible', false)
}
const onHide = () => {
emit('update:visible', false)
}
onMounted(() => {
queryUser()
})
return {
showEdit,
xTable,
formState,
loading,
tableData,
resetForm,
onHide,
confirmModal,
queryUser
}
}
})
</script>
<style lang="scss" scoped></style>
src/router/index.ts
View file @ 304cb871
import { createRouter, createWebHistory } from 'vue-router'
import Layout from '@/layout/LayoutView.vue'
import type { App } from 'vue'
import { useUserStore } from '@/stores/user'
const baseRoutes = [
{
path: '/',
name: 'Root',
redirect: '/home'
redirect: '/order/list'
}
]
export const routes = [
{
path: '/home',
component: Layout,
hiddenChild: true,
meta: {
title: '首页'
},
children: [
{
path: '',
name: 'Home',
component: () => import('@/views/home/HomeView.vue')
}
]
},
// {
// path: '/home',
// component: Layout,
// hiddenChild: true,
// meta: {
// title: '首页'
// },
// children: [
// {
// path: '',
// name: 'Home',
// component: () => import('@/views/home/HomeView.vue')
// }
// ]
// },
{
path: '/order',
name: 'Order',
......@@ -50,6 +51,14 @@ export const routes = [
title: '订单转换'
}
},
{
path: '/order/conver',
name: 'OrderConver',
component: () => import('@/views/order/convertOrder/index.vue'),
meta: {
title: '转换记录'
}
},
{
path: '/order/customer',
name: 'OrderCustomer',
......@@ -89,40 +98,40 @@ export const routes = [
}
]
},
{
path: '/configure',
name: 'Configure',
component: Layout,
meta: {
title: '配置管理'
},
children: [
{
path: '/configure/color',
name: 'ConfigureColor',
component: () => import('@/views/configure/colors/ConfigureColor.vue'),
meta: {
title: '颜色管理'
}
},
{
path: '/configure/factory',
name: 'ConfigureFactory',
component: () => import('@/views/configure/factory/ConfigureFactory.vue'),
meta: {
title: '工厂管理'
}
},
{
path: '/configure/brand',
name: 'ConfigureBrand',
component: () => import('@/views/configure/brand/ConfigureBrand.vue'),
meta: {
title: '品牌管理'
}
}
]
},
// {
// path: '/configure',
// name: 'Configure',
// component: Layout,
// meta: {
// title: '配置管理'
// },
// children: [
// // {
// // path: '/configure/color',
// // name: 'ConfigureColor',
// // component: () => import('@/views/configure/colors/ConfigureColor.vue'),
// // meta: {
// // title: '颜色管理'
// // }
// // },
// {
// path: '/configure/factory',
// name: 'ConfigureFactory',
// component: () => import('@/views/configure/factory/ConfigureFactory.vue'),
// meta: {
// title: '工厂管理'
// }
// },
// {
// path: '/configure/brand',
// name: 'ConfigureBrand',
// component: () => import('@/views/configure/brand/ConfigureBrand.vue'),
// meta: {
// title: '品牌管理'
// }
// }
// ]
// },
{
path: '/product',
name: 'Product',
......@@ -139,14 +148,6 @@ export const routes = [
title: '产品列表'
}
},
{
path: '/product/category',
name: 'ProductCategory',
component: () => import('@/views/product/productCategory/ProductCategory.vue'),
meta: {
title: '产品类别'
}
},
{
path: '/product/compare',
name: 'ProductCompare',
......@@ -190,6 +191,20 @@ const router = createRouter({
routes: [...baseRoutes, ...routes]
})
router.beforeEach((to, from, next) => {
if (to.query.userId) {
const userStore = useUserStore()
userStore.setUserInfo(to.query.userId)
next({
replace: true,
path: to.path
})
}
next()
})
export function setupRouter(app: App) {
app.use(router)
}
......
src/stores/index.ts
View file @ 304cb871
import type { App } from 'vue';
import { createPinia } from 'pinia';
import type { App } from 'vue'
import { createPinia } from 'pinia'
import piniaPluginPersistedstate from 'pinia-plugin-persistedstate'
const store = createPinia();
const store = createPinia()
store.use(piniaPluginPersistedstate)
export function setupStore(app: App<Element>) {
app.use(store);
app.use(store)
}
export { store };
export { store }
src/stores/user.ts 0 → 100644
View file @ 304cb871
import type { Recordable } from '@/types/global'
import { defineStore } from 'pinia'
type StoreState = {
userId: string
}
export const useUserStore = defineStore('userStore', {
state: (): StoreState => ({
userId: ''
}),
getters: {
getUserInfo(): string {
return this.userId
}
},
actions: {
setUserInfo(id: any) {
this.userId = id
}
},persist: true
})
src/utils/http.ts 0 → 100644
View file @ 304cb871
import axios, { type InternalAxiosRequestConfig } from 'axios'
import { useUserStore } from '@/stores/user'
const service = axios.create()
service.interceptors.request.use((config) => {
const userStore = useUserStore()
if (userStore.getUserInfo) {
config.headers.set('Userid', userStore.getUserInfo)
}
return config
})
export default service
\ No newline at end of file
src/utils/query.ts 0 → 100644
View file @ 304cb871
import type { Recordable } from '@/types/global'
/**
* 处理查询参数模糊查询
* @param params
* @param field
*/
export function queryParamsFilter(params: Recordable, field?: string[]) {
const exclude = ['currentPage', 'pageSize', 'total', 'column', 'order'].concat(field || [])
const p = Object.assign({}, params)
for (const key in params) {
if (!exclude.includes(key)) {
p[key] = `*${p[key]}*`
}
}
return p
}
src/views/comment-excel/CommentExcel.vue
View file @ 304cb871
<template>
<ExcelOperate v-if="loading" />
<el-button class="page-back" type="primary" size="large" :icon="Back" circle @click="pageBack" />
</template>
<script lang="ts" setup>
import { onMounted, ref } from 'vue'
import { useRoute } from 'vue-router'
import { useRoute, useRouter } from 'vue-router'
import { getOrderFileById } from '@/api/order'
import { useCommentExcel } from '@/stores/commentExcel'
import ExcelOperate from './components/ExcelOperate/ExcelOperate.vue'
import { Back } from '@element-plus/icons-vue'
const loading = ref(false)
const route = useRoute()
const router = useRouter()
const { setFileInfo } = useCommentExcel()
// 获取文件信息及客户信息
......@@ -21,9 +24,19 @@ const queryFileInfo = async () => {
loading.value = true
}
onMounted(() => {
const pageBack = () => {
router.go(-1)
}
onMounted(() => {
route.query?.fileId && queryFileInfo()
})
</script>
<style lang="scss" scoped></style>
<style lang="scss" scoped>
.page-back {
position: fixed;
bottom: 40px;
right: 30px;
z-index: 1001;
}
</style>
src/views/customer/CustomerEmail/CustomerEmail.vue
View file @ 304cb871
......@@ -3,7 +3,7 @@
<p class="font-bold text-lg leading-10 border-b-2">客户邮箱管理</p>
<el-form class="pt-4" :inline="true" :model="formState">
<el-form-item label="客户">
<el-input v-model="formState.customerName" placeholder="" disabled>
<el-input v-model="formState.customerName" placeholder="" readonly>
<template #append>
<el-button :icon="MoreFilled" @click="openModal('search')"></el-button>
</template>
......
src/views/customer/CustomerList/CustomerList.vue
View file @ 304cb871
<template>
<div class="h-full flex flex-col bg-white p-2">
<p class="font-bold text-lg leading-10 border-b-2">客户列表</p>
<el-form class="pt-2" :model="formState" size="small" inline>
<p class="font-bold text-lg leading-10 border-b-2">工厂客户</p>
<el-form class="pt-2" :model="formState" inline>
<el-form-item label="客户名称">
<el-input v-model="formState.customerName"></el-input>
</el-form-item>
<el-form-item label="客户类型">
<el-select v-model="formState.customerType"> </el-select>
<el-form-item label="客户简称">
<el-input v-model="formState.customerNickName"></el-input>
</el-form-item>
<el-form-item>
<el-button @click="resetForm">重置</el-button>
......@@ -22,14 +22,8 @@
:loading="loading"
size="small"
>
<vxe-column type="checkbox" width="40"></vxe-column>
<!-- <vxe-column field="customerId" title="客户id"></vxe-column> -->
<vxe-column field="customerName" title="客户名称"></vxe-column>
<vxe-column field="customerType" title="客户类型">
<template #default="{ row }">
{{ row.customerType === 'brand' ? '品牌' : '工厂' }}
</template>
</vxe-column>
<vxe-column field="customerNickName" title="客户简称"></vxe-column>
<vxe-column field="action" title="操作" width="100">
<template #default="{ row }">
<el-button type="primary" text size="small" @click="toEmail(row)">查看邮箱</el-button>
......@@ -51,10 +45,11 @@
</template>
<script lang="ts" setup>
import { defineComponent, ref, onMounted, reactive, watch } from 'vue'
import { defineComponent, ref, onMounted, reactive, watch, unref } from 'vue'
import { getCustomerPage } from '@/api/customer'
import type { VxeTableInstance } from 'vxe-table'
import { useRouter } from 'vue-router'
import { queryParamsFilter } from '@/utils/query';
const loading = ref(false)
const router = useRouter()
......@@ -63,7 +58,7 @@ const xTable = ref<VxeTableInstance>()
const tableData = ref([])
const formState = reactive({
customerName: '',
customerType: '',
customerNickName: '',
currentPage: 1,
pageSize: 10,
total: 0
......@@ -82,7 +77,9 @@ const toEmail = (row: any) => {
const queryCustomer = async () => {
loading.value = true
try {
const { data } = await getCustomerPage(formState)
// 模糊查询
const { data } = await getCustomerPage(queryParamsFilter(unref(formState)))
tableData.value = data.result.records
formState.total = +data.result.total
} catch {}
......@@ -91,7 +88,7 @@ const queryCustomer = async () => {
const resetForm = () => {
Object.assign(formState, {
customerName: '',
customerType: ''
customerNickName: ''
})
}
......
src/views/customer/ResponsibleCustomer/ResponsibleCustomer.vue
View file @ 304cb871
......@@ -3,14 +3,18 @@
<p class="font-bold text-lg leading-10 border-b-2">负责客户配置</p>
<el-form class="pt-4" :inline="true" :model="formState">
<el-form-item label="客户">
<el-input v-model="formState.customerId_dictText" placeholder="" disabled>
<el-input v-model="formState.customerId_dictText" placeholder="" readonly>
<template #append>
<el-button :icon="MoreFilled" @click="openModal('search')"></el-button>
</template>
</el-input>
</el-form-item>
<el-form-item label="用户">
<el-input v-model="formState.userId_dictText" placeholder="" />
<el-input v-model="formState.userId_dictText" placeholder="">
<template #append>
<el-button :icon="MoreFilled" @click="openUserModal('search')"></el-button>
</template>
</el-input>
</el-form-item>
<el-form-item>
......@@ -58,7 +62,14 @@
</vxe-pager>
</div>
<vxe-modal :z-index="1005" v-model="showEdit" title="编辑&保存" destroy-on-close esc-closable @hide="onHide">
<vxe-modal
:z-index="1005"
v-model="showEdit"
title="编辑&保存"
destroy-on-close
esc-closable
@hide="onHide"
>
<template #default>
<el-form ref="formRef" label-width="90px" :model="formEdit" :rules="formRules">
<el-form-item label="客户" prop="customerId_dictText">
......@@ -70,9 +81,9 @@
</el-form-item>
<el-form-item label="用户" prop="userId_dictText">
<el-input v-model="formEdit.userId_dictText" disabled>
<!-- <template #append>
<el-button :icon="MoreFilled" @click="openModal('edit')"></el-button>
</template> -->
<template #append>
<el-button :icon="MoreFilled" @click="openUserModal('edit')"></el-button>
</template>
</el-input>
</el-form-item>
<el-form-item>
......@@ -84,6 +95,7 @@
</vxe-modal>
<CustomerModal v-model:visible="visibleModal" @confirm="confirmCustomer" />
<UserModal v-model:visible="visibleUserModal" @confirm="confirmUser" />
</div>
</template>
......@@ -94,14 +106,20 @@ import type { VxeTableInstance } from 'vxe-table'
import { MoreFilled } from '@element-plus/icons-vue'
import CustomerModal from '@/components/CustomerModal/CustomerModal.vue'
import UserModal from '@/components/UserModal/UserModal.vue'
import { useRoute } from 'vue-router'
import { getUserOrderFileConfPage, editUserOrderFileConf, addUserOrderFileConf, deleteUserOrderFileConfByIds } from '@/api/customer'
import {
getUserOrderFileConfPage,
editUserOrderFileConf,
addUserOrderFileConf,
deleteUserOrderFileConfByIds
} from '@/api/customer'
const route = useRoute()
const visibleModal = ref(false)
const loading = ref(false)
const saveLoading = ref(false)
const showEdit = ref(false)
const visibleUserModal = ref(false)
const formState = reactive({
customerId_dictText: '',
userId_dictText: '',
......@@ -117,12 +135,13 @@ const formRef = ref()
const xTable = ref<VxeTableInstance>()
const formRules = reactive({
userId_dictText: [{ required: true, message: '请选择邮箱客户', trigger: 'change' }],
customerId_dictText: [{ required: true, message: '请选择邮箱客户', trigger: 'change' }]
})
const formEdit = reactive<Record<string, any>>({
customerId_dictText: '',
userId_dictText: '',
customerId: '',
userId: '',
userId_dictText: ''
})
const tableData = ref([])
......@@ -131,14 +150,17 @@ const onHide = () => {
Object.assign(formEdit, {
customerId_dictText: '',
userId_dictText: '',
userId: '',
customerId: ''
})
}
const onReset = () => {
Object.assign(formState, {
customerName: '',
email: '',
customerId: ''
customerId: '',
customerId_dictText: '',
userId: '',
userId_dictText: ''
})
}
......@@ -146,6 +168,11 @@ const openModal = (type: string) => {
visibleModal.value = true
modalType.value = type
}
const openUserModal = (type: string) => {
visibleUserModal.value = true
modalType.value = type
}
const editRow = (row) => {
Object.assign(formEdit, row)
showEdit.value = true
......@@ -187,6 +214,18 @@ const confirmCustomer = (list: any) => {
}
}
const confirmUser = (list: any) => {
const [item] = list
if (!item) return
if (modalType.value == 'edit') {
formEdit.userId = item.userId
formEdit.userId_dictText = item.nickName
} else {
formState.userId = item.userId
formState.userId_dictText = item.nickName
}
}
const onQuery = async () => {
loading.value = true
try {
......
src/views/order/convertOrder/index.vue 0 → 100644
View file @ 304cb871
<template>
<div class="h-full flex flex-col bg-white p-2">
<p class="font-bold text-lg leading-10 border-b-2">转换订单记录</p>
<el-form class="pt-2" :model="formState" inline>
<el-form-item label="客户名称">
<el-input v-model="formState.customerId_dictText">
<template #append>
<el-button :icon="MoreFilled" @click="visibleModal = true"></el-button>
</template>
</el-input>
</el-form-item>
<el-form-item>
<el-button @click="resetForm">重置</el-button>
<el-button @click="queryConvert" type="primary">查询</el-button>
</el-form-item>
</el-form>
<vxe-toolbar>
<template #buttons>
<el-button type="danger" @click="removeRows">删除</el-button>
</template>
</vxe-toolbar>
<vxe-table
ref="xTable"
min-height="460"
border
:data="tableData"
:loading="loading"
size="small"
>
<vxe-column type="checkbox" width="40"></vxe-column>
<vxe-column field="customerId_dictText" title="客户名称"></vxe-column>
<vxe-column field="convertOrderId" title="convertOrderId"></vxe-column>
<vxe-column field="excelOrderId" title="excelOrderId"></vxe-column>
<vxe-column field="createTime" title="创建时间"></vxe-column>
<vxe-column field="action" title="操作" width="100">
<template #default="{ row }">
<el-button type="primary" text size="small" @click="toDetail(row)">查看</el-button>
</template>
</vxe-column>
</vxe-table>
<vxe-pager
size="small"
background
v-model:current-page="formState.currentPage"
v-model:page-size="formState.pageSize"
:total="formState.total"
@page-change="queryConvert"
:layouts="['PrevPage', 'JumpNumber', 'NextPage', 'Sizes', 'FullJump', 'Total']"
>
</vxe-pager>
<vxe-modal esc-closable v-model="visible" title="解析详情" width="80%" show-footer>
<vxe-table
border
size="mini"
height="500"
show-overflow="tooltip"
show-header-overflow="tooltip"
:data="convertData"
>
<vxe-column
width="160"
v-for="item in tableTitle"
:title="item"
:key="item"
:field="item"
/>
</vxe-table>
<template #footer>
<el-button @click="visible = false">关闭</el-button>
</template>
</vxe-modal>
<CustomerModal v-model:visible="visibleModal" @confirm="confirmCustomer" />
</div>
</template>
<script lang="ts" setup>
import { ref, onMounted, reactive, watch } from 'vue'
import { convertOrderBatchDeleteById, convertOrderPage } from '@/api/order'
import type { VxeTableInstance } from 'vxe-table'
import CustomerModal from '@/components/CustomerModal/CustomerModal.vue'
import { ElMessage } from 'element-plus'
import { MoreFilled } from '@element-plus/icons-vue'
const visibleModal = ref(false)
const loading = ref(false)
const visible = ref(false)
const xTable = ref<VxeTableInstance>()
const tableData = ref([])
const formState = reactive({
customerId_dictText: '',
customerId: '',
currentPage: 1,
pageSize: 10,
total: 0,
column: 'createTime',
order: 'desc'
})
const tableTitle = ref([])
const convertData = ref([])
const toDetail = (row: any) => {
const titles: string[] = []
const record = row.orders[0]
let flatdatas: any = null
// 获取表头
for (const key in record) {
if (key == 'productProperties') {
if (record[key].length) {
flatdatas = {}
record[key].forEach((v) => {
titles.push(v.productPropertiesTitle)
flatdatas[v.productPropertiesTitle] = v.productPropertiesValue
})
}
} else {
titles.push(key)
}
}
tableTitle.value = titles
convertData.value = row.orders.map((item) => {
return {
...item,
...flatdatas
}
})
// 打开弹窗
visible.value = true
}
const queryConvert = async () => {
loading.value = true
try {
const { data } = await convertOrderPage(formState)
tableData.value = data.result.records
formState.total = +data.result.total
} catch {}
loading.value = false
}
const resetForm = () => {
Object.assign(formState, {
customerId: '',
customerId_dictText: ''
})
}
const confirmCustomer = (list) => {
const [item] = list
if (!item) return
formState.customerId = item.customerId
formState.customerId_dictText = item.customerName
}
const removeRows = async () => {
const list = xTable.value?.getCheckboxRecords()
if (list?.length) {
const ids = list.map((v) => v.convertOrderId).join(',')
await convertOrderBatchDeleteById(ids)
ElMessage.success('删除成功')
queryConvert()
}
}
onMounted(() => {
queryConvert()
})
</script>
<style lang="scss" scoped></style>
src/views/order/orderChange/OrderChange.vue
View file @ 304cb871
......@@ -2,11 +2,15 @@
<div class="w-full h-full bg-white p-4">
<p class="font-bold text-lg leading-10 border-b-2">解析列表</p>
<el-form class="pt-4" :inline="true" :model="queryParams">
<el-form-item label="excelOrderId">
<!-- <el-form-item label="文件名称">
<el-input v-model="queryParams.excelOrderId" placeholder="" clearable />
</el-form-item>
<el-form-item label="templateFileId">
<el-input v-model="queryParams.templateFileId" placeholder="" clearable />
</el-form-item> -->
<el-form-item label="订单状态">
<el-select v-model="queryParams.status" placeholder="" clearable >
<template v-for="item in statusOptions">
<el-option :value="item.value" :label="item.label"></el-option>
</template>
</el-select>
</el-form-item>
<el-form-item>
......@@ -30,12 +34,24 @@
:data="tableData"
>
<vxe-column type="checkbox" width="50"></vxe-column>
<vxe-column field="fileId_dictText" title="文件名称"></vxe-column>
<vxe-column field="fileId_dictText" title="文件名称">
<template #default="{row}">
<el-link target="_blank" :href="'/api/sys/static/'+ row.fileId_dictText">{{ row.fileId_dictText }}</el-link>
</template>
</vxe-column>
<vxe-column field="status_dictText" title="订单状态" width="200"></vxe-column>
<vxe-column field="createTime" title="创建时间" width="180"></vxe-column>
<vxe-column field="action" title="操作" width="120">
<template #default="{ row }">
<el-link style="font-size: 12px" type="primary" @click="toDetail(row)">查看</el-link>
<el-link
class="ml-1"
style="font-size: 12px"
type="primary"
v-if="row.status == 'un_convert'"
@click="confirmChange(row)"
>转换</el-link
>
<el-link
class="ml-1"
style="font-size: 12px"
......@@ -63,62 +79,39 @@
<vxe-modal v-model="detailVisible" title="解析详情" width="80%" show-footer>
<vxe-table
border
size="mini"
height="500"
show-overflow="tooltip"
show-header-overflow="tooltip"
:data="detailTable"
border
:expand-config="expandConfig"
height="500"
>
<vxe-column title="行号" type="expand" width="120">
<vxe-column title="行号" width="120">
<template #default="{ row }">{{ row.sortNum }}</template>
<template #content="{ row, rowIndex }">
<div style="padding: 10px">
<template v-for="attchName of filterObjKeys(row.expendData)" :key="attchName">
<p>{{ attchName }}</p>
<vxe-table
:data="row.expendData[attchName]"
:header-row-style="{ background: '#f9f8f9' }"
min-height="120"
height="120"
size="mini"
show-overflow="tooltip"
show-header-overflow="tooltip"
style="width: 70vw"
border
>
<vxe-colgroup
v-for="key in filterObjKeys(row.expendData[attchName][0])"
:key="key"
:title="key"
>
<vxe-column :title="key" :field="key" width="200">
<template #header>
<div class="header-cell" @click="(e) => showPopover(e, key, attchName)">
<span>{{
allMapConfigs[attchName + '__' + key]?.orderFiled.fliedTitle || ''
}}</span>
<el-icon><Setting /></el-icon>
</div>
</template>
</vxe-column>
</vxe-colgroup>
</vxe-table>
</template>
</div>
</template>
</vxe-column>
<vxe-column title="数据区" width="120">
<template #default="{ row }">{{ row['数据区'] }}</template>
</vxe-column>
<template v-for="item in tableTitle" :key="item">
<vxe-colgroup :title="item">
<!-- 查看状态下直接显示 -->
<template v-if="currentRow.status == 'un_confirm'">
<vxe-column
v-for="item in tableTitle"
:key="item"
:title="item"
:field="item"
width="200"
/>
</template>
<!-- 转换下使用 -->
<template v-else>
<vxe-colgroup v-for="item in tableTitle" :key="item" :title="item">
<vxe-column :title="item" :field="item" width="200">
<template #header>
<div class="header-cell" @click="(e) => showPopover(e, item)">
<span>{{ allMapConfigs[item]?.orderFiled.fliedTitle || '' }}</span>
<el-icon><Setting /></el-icon>
<el-icon v-if="currentRow.status == 'un_convert'"><Setting /></el-icon>
</div>
</template>
</vxe-column>
......@@ -141,14 +134,24 @@
<el-row>
<el-col :span="24">
<el-form-item label="对应字段" prop="mapField">
<el-select v-model="currentConfigColumn.mapField" :teleported="false" clearable>
<el-select v-model="currentConfigColumn.mapField" placeholder="Select" :teleported="false">
<el-option-group v-for="group in allFields" :key="group.label" :label="group.label">
<el-option
v-for="item in group.options"
:key="item.filedName"
:label="item.fliedTitle"
:value="item.filedName"
/>
</el-option-group>
</el-select>
<!-- <el-select v-model="currentConfigColumn.mapField" :teleported="false" clearable>
<el-option
v-for="item in orderFieldList"
:key="item.filedName"
:value="item.filedName"
:label="item.fliedTitle"
></el-option>
</el-select>
</el-select> -->
</el-form-item>
</el-col>
<el-col :span="24" v-if="currentConfigColumn.mapField">
......@@ -164,7 +167,7 @@
</el-form-item>
</el-col>
<template v-for="params in currentScriptParamsList">
<template v-for="params in currentScriptParamsList" :key="params.fliedTitle">
<el-col :span="24">
<el-form-item :label="params.fliedTitle">
<el-input v-model="scriptPs[params.filedName]" />
......@@ -190,7 +193,10 @@
</el-popover>
<template #footer>
<el-button @click="confirmChange">确认转换</el-button>
<!-- <el-button @click="confirmChange" v-if="currentRow.status == 'un_convert'">确认转换</el-button> -->
<el-button @click="saveOrderField" v-if="currentRow.status == 'un_convert'" type="primary"
>保存</el-button
>
</template>
</vxe-modal>
</template>
......@@ -200,23 +206,25 @@ import { computed, onMounted, reactive, ref, watch } from 'vue'
import { Setting } from '@element-plus/icons-vue'
import { cloneDeep } from 'lodash-es'
import {
confirmExcelFileOrderById,
confirmExcelFileOrderById,
convertExcelFileOrder,
deleteExcelFileOrderById,
getExcelFileOrderPage,
unconvertExcelFileOrder
unconvertExcelFileOrder,
getConfByExcelOrderId,
saveConfExcelFileOrderPage
} from '@/api/order'
import { ElMessage, ElMessageBox, ClickOutside as vClickOutside } from 'element-plus'
import type { VxeTableInstance } from 'vxe-table'
import type { Recordable } from '@/types/global'
import { filterRunData } from '@/utils/excel'
import { apiGetOrderField, apiGetScript } from '@/api/excel'
import { apiGetOrderField, apiGetScript, getVariableField } from '@/api/excel'
import { apiDictList } from '@/api/common'
const loading = ref(false)
/**查询参数 */
const queryParams = reactive({
templateFileId: '',
excelOrderId: '',
status: '',
currentPage: 1,
pageSize: 10,
total: 0,
......@@ -225,7 +233,7 @@ const queryParams = reactive({
})
/**所有列映射配置 */
const allMapConfigs = reactive<Recordable>({})
const allMapConfigs = ref<Recordable>({})
/**当前表单映射字段配置 */
const currentConfigColumn = reactive({
title: '',
......@@ -256,25 +264,30 @@ const detailVisible = ref(false)
const detailTable = ref<Recordable[]>([])
/**表格title */
const tableTitle = ref<string[]>([])
const expandConfig = reactive({
visibleMethod({ row }) {
if (typeof row.expendData === 'object') {
return true
}
return false
}
})
const statusOptions = ref([])
const queryDict = async (code: string) => {
const { data } = await apiDictList({
dictCodes: code
})
statusOptions.value = data.result[code]
}
const popoverRef = ref()
const buttonRef = ref()
const popoverVisible = ref(false)
const showPopover = (e: any, title: string, groupTitle: string = '') => {
if (currentRow.status != 'un_convert') {
return
}
buttonRef.value = e.target
const t = groupTitle ? `${groupTitle}-${title}` : title
// 设置标题
currentConfigTitle.value = t
Object.assign(currentConfigColumn, { ...allMapConfigs[t], title, groupTitle })
Object.assign(currentConfigColumn, { ...allMapConfigs.value[t], title, groupTitle })
// 打开popover
popoverVisible.value = true
}
......@@ -296,7 +309,10 @@ watch(
(val) => {
// 如果有值设置 currentConfigColumn.orderFiled字段
if (val) {
const item = orderFieldList.value.find((v) => v.filedName == val)
let item = orderFieldList.value.find((v) => v.filedName == val)
if (!item) {
item = variableField.value.find((v) => v.filedName == val)
}
Reflect.set(currentConfigColumn, 'orderFiled', item)
} else {
Reflect.set(currentConfigColumn, 'orderFiled', {})
......@@ -306,6 +322,17 @@ watch(
}
)
const variableField = ref([])
const allFields = computed(() => {
return [{
label: '普通字段',
options: orderFieldList.value,
}, {
label: '变量字段',
options: variableField.value,
}]
})
/**重置popover配置表单 */
const resetConfigForm = () => {
Object.assign(currentConfigColumn, {
......@@ -336,7 +363,7 @@ const gScriptPs = (scriptNames: null | Recordable[] | undefined) => {
// 查询是否有已经设置过的值
const { title, groupTitle } = currentConfigColumn
const t = groupTitle ? `${groupTitle}__${title}` : title
const params = allMapConfigs[t].params
const params = allMapConfigs.value[t].params
scriptNames.forEach((item) => {
Reflect.set(scriptPs.value, item.filedName, params[item.filedName] || '')
})
......@@ -352,16 +379,11 @@ const confirmConfig = () => {
const { title, groupTitle } = currentConfigColumn
// 保存本地配置
title &&
Reflect.set(
allMapConfigs,
groupTitle ? `${groupTitle}__${title}` : title,
cloneDeep(currentConfigColumn)
)
title && Reflect.set(allMapConfigs.value, title, cloneDeep(currentConfigColumn))
// 关闭popover
popoverVisible.value = false
console.log('allMapConfigs', allMapConfigs)
console.log('allMapConfigs.value', allMapConfigs.value)
}
const getScriptList = async () => {
......@@ -373,6 +395,11 @@ const getOrderFields = async () => {
orderFieldList.value = data.result
}
const getOrderVariableField = async () => {
const { data } = await getVariableField(currentRow.excelOrderId)
variableField.value = data.result
}
/**确认解析/转换的订单的状态 */
const confirmOrderStatus = async (row: any) => {
if (row.status === 'un_confirm') {
......@@ -384,6 +411,8 @@ const confirmOrderStatus = async (row: any) => {
const { data } = await unconvertExcelFileOrder(row.excelOrderId)
if (data.code == 200) {
ElMessage.success(data.message || '操作成功！')
} else {
ElMessage.error(data.message || '操作失败')
}
} else if (row.status == 'converted') {
await ElMessageBox.confirm('是否确认转换后的订单？', '提示', {
......@@ -392,7 +421,7 @@ const confirmOrderStatus = async (row: any) => {
type: 'warning'
})
const {data} = await confirmExcelFileOrderById(row.excelOrderId)
const { data } = await confirmExcelFileOrderById(row.excelOrderId)
if (data.code == 200) {
ElMessage.success(data.message || '操作成功！')
} else {
......@@ -403,14 +432,36 @@ const confirmOrderStatus = async (row: any) => {
onQuery()
}
/**保存订单字段 */
const saveOrderField = async () => {
const params = {
templateFileId: currentRow.templateFileId,
confs: Object.values(allMapConfigs.value).filter((v) => {
if (v.title !== '') {
v.templateFileId = currentRow.templateFileId
return true
}
return false
})
}
await saveConfExcelFileOrderPage(params).then(({ data }) => {
if (data.code == 200) {
ElMessage.success(data.message || '保存成功！')
} else {
ElMessage.error(data.message || '保存失败！')
}
})
}
/** 确认订单转换 */
const confirmChange = async () => {
const confirmChange = async (row) => {
await ElMessageBox.confirm('是否确认订单转换？', '提示', {
confirmButtonText: '转换',
cancelButtonText: '取消',
type: 'warning'
})
const { data } = await convertExcelFileOrder(currentRow.excelOrderId)
const { data } = await convertExcelFileOrder(row.excelOrderId)
if (data.code == 200) {
ElMessage.success(data.message || '转换成功！')
detailVisible.value = false
......@@ -419,9 +470,32 @@ const confirmChange = async () => {
ElMessage.error(data.message || '转换失败！')
}
const toDetail = (row: any) => {
const toDetail = async (row: any) => {
allMapConfigs.value = {}
Object.assign(currentRow, row)
const { res, titles, configs } = filterRunData(row.orders)
await getOrderVariableField()
console.log('allFields', allFields)
const { data } = await getConfByExcelOrderId(row.excelOrderId)
if (data.result.length) {
const tmp = {
title: '',
content: '',
mapField: '',
scriptName: '',
groupTitle: '',
templateFileId: '',
excelOrderFiledConfId: '',
params: {},
orderFiled: {}
}
data.result.forEach((item: any) => {
item.params == null && (item.params = {})
item.orderFiled == null && (item.orderFiled = {})
configs[item.title] = Object.assign({}, tmp, item)
})
}
// 排除通过循环不显示的column
const excludeTitles = ['sortNum', '数据区', 'expendData']
detailTable.value = res
......@@ -432,7 +506,9 @@ const toDetail = (row: any) => {
Reflect.deleteProperty(configs, key)
})
Object.assign(allMapConfigs, configs)
Object.assign(allMapConfigs.value, configs)
console.log('allMapConfigs.value', allMapConfigs.value)
}
const filterObjKeys = (data: any) => {
......@@ -450,7 +526,9 @@ const removeRows = async () => {
}
}
const onReset = () => {}
const onReset = () => {
queryParams.status = ''
}
const onQuery = async () => {
loading.value = true
try {
......@@ -465,6 +543,7 @@ onMounted(() => {
onQuery()
getOrderFields()
getScriptList()
queryDict('excel_order_status')
})
</script>
<style lang="scss" scoped>
......
src/views/order/orderChange/components/orderDes.vue 0 → 100644
View file @ 304cb871
<template>
</template>
<script setup lang="ts">
</script>
<style lang="scss" scoped></style>
\ No newline at end of file
src/views/order/orderList/OrderList.vue
View file @ 304cb871
......@@ -26,20 +26,26 @@
size="small"
min-height="460"
border
show-overflow='ellipsis'
show-overflow="ellipsis"
:loading="loading"
:data="tableData"
>
<vxe-column type="checkbox" width="50"></vxe-column>
<!-- <vxe-column field="orderFileId" title="文件id" width="200"></vxe-column> -->
<vxe-column field="customerId_dictText" title="客户名称" width="120"></vxe-column>
<vxe-column field="filePath" title="原始文件地址"></vxe-column>
<vxe-column field="mergeFilePath" title="标注文件地址"></vxe-column>
<vxe-column title="原始文件地址">
<template #default="{row}">
<el-link target="_blank" :href="'/api/sys/static/'+ row.filePath">{{ row.filePath }}</el-link>
</template>
</vxe-column>
<vxe-column title="标注文件地址">
<template #default="{row}">
<el-link target="_blank" :href="'/api/sys/static/'+ row.mergeFilePath">{{ row.mergeFilePath }}</el-link>
</template>
</vxe-column>
<vxe-column field="createTime" title="创建时间" width="180"></vxe-column>
<vxe-column field="action" title="操作" width="80">
<template #default="{row}">
<el-button type="primary" text size="small" @click="toDetail2(row)">查看</el-button>
<!-- <el-button type="primary" text size="small" @click="toDetail2(row)">查看新</el-button> -->
<template #default="{ row }">
<el-link type="primary" style="font-size: 12px;" :href="'/comment-excel?fileId=' + row.orderFileId" target="_blank">查看</el-link>
</template>
</vxe-column>
</vxe-table>
......@@ -63,8 +69,8 @@ import { onMounted, reactive, ref } from 'vue'
import { getOrderFilePage, deleteOrderFiles } from '@/api/order'
import { ElMessage } from 'element-plus'
import type { VxeTableInstance } from 'vxe-table'
import { useRouter } from 'vue-router';
import { useRouter } from 'vue-router'
import { queryParamsFilter } from '@/utils/query'
const router = useRouter()
const loading = ref(false)
......@@ -85,7 +91,7 @@ const tableData = ref([])
const removeRows = async () => {
const list = xTable.value?.getCheckboxRecords()
if (list?.length) {
const ids = list.map(v => v.orderFileId).join(',')
const ids = list.map((v) => v.orderFileId).join(',')
await deleteOrderFiles(ids)
ElMessage.success('删除成功')
onQuery()
......@@ -109,11 +115,16 @@ const toDetail2 = (row: any) => {
}
})
}
const onReset = () => {}
const onReset = () => {
Object.assign(formState, {
filePath: '',
mergeFilePath: ''
})
}
const onQuery = async () => {
loading.value = true
try {
const { data } = await getOrderFilePage(formState)
const { data } = await getOrderFilePage(queryParamsFilter(formState))
tableData.value = data.result.records
formState.total = +data.result.total
} catch {}
......
src/views/product/productCompare/ProductCompare.vue
View file @ 304cb871
......@@ -3,10 +3,21 @@
<p class="font-bold text-lg leading-10 border-b-2">产品对照管理</p>
<el-form class="pt-4" :inline="true" :model="formState">
<el-form-item label="产品名称">
<el-input v-model="formState.productName" placeholder="产品名称" clearable />
<el-input v-model="formState.productId_dictText" readonly placeholder="产品名称" clearable>
<template #append>
<el-button :icon="MoreFilled" @click="openModal('prod', 'search')" />
</template>
</el-input>
</el-form-item>
<el-form-item label="客户名称">
<el-input v-model="formState.customerName" placeholder="客户名称" clearable />
<el-input v-model="formState.customerId_dictText" readonly placeholder="客户名称" clearable>
<template #append>
<el-button :icon="MoreFilled" @click="openModal('cust', 'search')" />
</template>
</el-input>
</el-form-item>
<el-form-item label="产品描述">
<el-input v-model="formState.excelFiled" placeholder="产品描述" clearable />
</el-form-item>
<el-form-item>
......@@ -18,39 +29,27 @@
<div class="">
<vxe-toolbar>
<template #buttons>
<!-- <vxe-button @click="allAlign = 'left'">居左</vxe-button> -->
<el-button type="primary" @click="showEdit = true">新增</el-button>
<el-button type="danger" @click="deleteRows">删除</el-button>
</template>
</vxe-toolbar>
<vxe-table
ref="xTable"
size="small"
size="mini"
min-height="460"
border
:loading="loading"
:data="tableData"
>
<vxe-column type="checkbox" width="50"></vxe-column>
<!-- <vxe-column field="productCompareId" title="产品对照id" width="200"></vxe-column> -->
<vxe-column field="productName" title="产品名称" width="200"></vxe-column>
<vxe-column field="customerName" title="客户名称" width="200"></vxe-column>
<vxe-column field="fileds" title="产品对照字段配置">
<vxe-column field="productId_dictText" title="产品名称" width="200"></vxe-column>
<vxe-column field="customerId_dictText" title="客户名称" width="200"></vxe-column>
<vxe-column field="excelFiled" title="产品描述"></vxe-column>
<vxe-column title="操作" width="90">
<template #default="{ row }">
<span
class="inline-block mr-2"
v-for="item in row.fileds"
:key="item.productCompareFiledId"
>
{{ `${item.productFiledTitle}=${item.productFiledValue}` }}
</span>
<el-link type="primary" style="font-size: 12px" @click="toEdit(row)">修改</el-link>
</template>
</vxe-column>
<!-- <vxe-column field="action" title="操作" width="100">
<template #default="{ row }">
<el-button type="primary" text size="small" @click="editRow(row)">修改</el-button>
</template>
</vxe-column> -->
</vxe-table>
<vxe-pager
......@@ -67,7 +66,7 @@
<vxe-modal
v-model="showEdit"
width="700"
width="400"
title="编辑&保存"
destroy-on-close
esc-closable
......@@ -84,68 +83,50 @@
:rules="formRules"
>
<el-row :gutter="24">
<el-col :span="12">
<el-form-item label="产品名称" prop="productName">
<el-input v-model="formEdit.productName" disabled>
<el-col :span="24">
<el-form-item label="产品名称" prop="productId_dictText">
<el-input v-model="formEdit.productId_dictText" disabled>
<template #append>
<el-button :icon="MoreFilled" @click="prodVisible = true" />
<el-button :icon="MoreFilled" @click="openModal('prod', 'edit')" />
</template>
</el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="客户名称" prop="customerName">
<el-input v-model="formEdit.customerName" disabled>
<el-col :span="24">
<el-form-item label="客户名称" prop="customerId_dictText">
<el-input v-model="formEdit.customerId_dictText" disabled>
<template #append>
<el-button :icon="MoreFilled" @click="customerVisible = true" />
<el-button :icon="MoreFilled" @click="openModal('cust', 'edit')" />
</template>
</el-input>
</el-form-item>
</el-col>
</el-row>
<p class="font-bold border-b-2 mb-2 text-base">对照字段配置</p>
<el-scrollbar height="300" class="no-rule-container">
<template v-for="(item, idx) in formEdit.fileds">
<el-row>
<el-form-item label="产品字段">
<el-select
v-model="item.productFiled"
@change="(v) => productFiledChange(v, item)"
>
<template v-for="field in orderFields">
<el-option
:disabled="!!field.disabled"
:label="field.fliedTitle"
:value="field.filedName"
></el-option>
</template>
</el-select>
<el-col :span="24">
<el-form-item label="产品单位" prop="customerUnit">
<el-input v-model="formEdit.customerUnit"></el-input>
</el-form-item>
<el-form-item label="字段值">
<el-input v-model="item.productFiledValue"></el-input>
</el-col>
<el-col :span="24">
<el-form-item label="单位" prop="unit">
<el-input v-model="formEdit.unit"></el-input>
</el-form-item>
<el-form-item>
<el-button
v-if="idx === 0"
type="primary"
:icon="Plus"
circle
@click="addField"
></el-button>
<el-button
v-else-if="idx !== 0"
type="danger"
:icon="Delete"
circle
@click="removeField(idx)"
></el-button>
</el-col>
<el-col :span="24">
<el-form-item label="换算值" prop="unitRatio">
<el-input type="number" v-model="formEdit.unitRatio"></el-input>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="产品描述" prop="excelFiled">
<el-input
style="width: 250px"
type="textarea"
:rows="5"
v-model="formEdit.excelFiled"
></el-input>
</el-form-item>
</el-col>
</el-row>
</template>
</el-scrollbar>
<el-row type="flex" justify="center">
<el-button size="default" type="primary" @click="onSubmit" :loading="saveLoading"
......@@ -167,11 +148,13 @@
<script lang="ts" setup>
import { computed, onMounted, reactive, ref, unref, watch } from 'vue'
import { getProductCompareList, saveProductCompare } from '@/api/product'
import { apiGetOrderField } from '@/api/excel'
import {
deleteExcelProdFileConfByIds,
getExcelProdFileConfPage,
saveExcelProdFileConf
} from '@/api/product'
import { ElMessage } from 'element-plus'
import type { VxeTableInstance } from 'vxe-table'
import { MoreFilled, Delete, Plus } from '@element-plus/icons-vue'
import ProductModal from '@/components/ProductModal/ProductModal.vue'
import CustomerModal from '@/components/CustomerModal/CustomerModal.vue'
......@@ -182,53 +165,62 @@ const loading = ref(false)
const saveLoading = ref(false)
const showEdit = ref(false)
const formState = reactive({
productName: '',
customerName: '',
productId_dictText: '',
productId: '',
customerId: '',
customerId_dictText: '',
excelFiled: '',
currentPage: 1,
pageSize: 10,
total: 0
})
const orderFields = ref<Record<string, any>>([])
const formRef = ref()
const xTable = ref<VxeTableInstance>()
const formRules = reactive({
productName: [{ required: true, message: '请输入产品名称', trigger: 'change' }]
productId_dictText: [{ required: true, message: '请输入产品名称', trigger: 'change' }],
excelFiled: [{ required: true, message: '请输入产品描述', trigger: 'change' }]
})
const formEdit = reactive({
productCompareId: null,
customerId: '',
customerName: '',
productName: '',
customerId_dictText: '',
productId_dictText: '',
productId: '',
fileds: [
{
productCompareFiledId: null,
productCompareId: null,
productFiled: '',
productFiledTitle: '',
productFiledValue: ''
}
]
})
const selectedFields = computed(() => {
return formEdit.fileds.map((v) => v.productFiled)
excelFiled: '',
customerUnit: '',
unit: '',
unitRatio: ''
})
watch(
selectedFields,
(val) => {
orderFields.value.forEach((item: any) => {
if (val.includes(item.filedName)) {
item.disabled = true
const deleteRows = async () => {
const ids = xTable.value
?.getCheckboxRecords()
.map((item) => {
return item.excelProductFiledConfId
})
.join(',')
const { data } = await deleteExcelProdFileConfByIds(ids as string)
if (data.code === 200) {
ElMessage.success(data.message || '删除成功！')
onQuery()
} else {
item.disabled = false
ElMessage.error(data.message || '删除失败！')
}
})
},
{ deep: true }
)
}
const toEdit = (row: any) => {
Object.assign(formEdit, row)
showEdit.value = true
}
const modaltype = ref('search')
const openModal = (modal, type) => {
if (modal == 'prod') {
prodVisible.value = true
} else {
customerVisible.value = true
}
modaltype.value = type
}
const tableData = ref([])
const onHide = () => {
......@@ -236,53 +228,30 @@ const onHide = () => {
Object.assign(formEdit, {
productCompareId: null,
customerId: '',
customerName: '',
productName: '',
customerId_dictText: '',
productId_dictText: '',
productId: '',
fileds: [
{
productCompareFiledId: null,
productCompareId: null,
productFiled: '',
productFiledTitle: '',
productFiledValue: ''
}
]
excelFiled: ''
})
}
const addField = () => {
formEdit.fileds.splice(1, 0, {
productCompareFiledId: null,
productCompareId: null,
productFiled: '',
productFiledTitle: '',
productFiledValue: ''
const onReset = () => {
Object.assign(formState, {
customerId: '',
customerId_dictText: '',
productId: '',
productId_dictText: '',
excelFiled: ''
})
}
const removeField = (idx: number) => formEdit.fileds.splice(idx, 1)
const productFiledChange = (v: string | undefined, item: any) => {
if (v) {
item.productFiledTitle = orderFields.value.find((_) => _.filedName == v)?.fliedTitle || ''
}
}
const onReset = () => {}
// 表单提交
const onSubmit = async () => {
await formRef.value.validate()
saveLoading.value = true
const params = {
productCompare: {
productCompareId: formEdit.productCompareId,
customerId: formEdit.customerId,
productId: formEdit.productId
},
fileds: formEdit.fileds
}
try {
await saveProductCompare(params)
await saveExcelProdFileConf(formEdit)
ElMessage.success('操作成功！')
showEdit.value = false
onQuery()
......@@ -295,19 +264,28 @@ const confirmModal = (list: any, type: 'prod' | 'customer') => {
if (!item) return
const form = unref(formEdit)
if (type === 'prod') {
console.log('type', type, item)
if (modaltype.value == 'edit') {
form.productId = item.productId
form.productName = item.productName
form.productId_dictText = item.productName
} else {
formState.productId = item.productId
formState.productId_dictText = item.productName
}
} else {
if (modaltype.value == 'edit') {
form.customerId = item.customerId
form.customerName = item.customerName
form.customerId_dictText = item.customerName
} else {
formState.customerId = item.customerId
formState.customerId_dictText = item.customerName
}
}
}
const onQuery = async () => {
loading.value = true
try {
const { data } = await getProductCompareList(formState)
const { data } = await getExcelProdFileConfPage(formState)
tableData.value = data.result.records
formState.total = +data.result.total
} catch {}
......@@ -316,9 +294,6 @@ const onQuery = async () => {
onMounted(() => {
onQuery()
apiGetOrderField().then(({ data }) => {
orderFields.value = data.result
})
})
</script>
<style lang="scss" scoped></style>
src/views/product/productList/ProductList.vue
View file @ 304cb871
......@@ -3,10 +3,7 @@
<p class="font-bold text-lg leading-10 border-b-2">产品管理</p>
<el-form class="pt-4" :inline="true" :model="formState">
<el-form-item label="产品名称">
<el-input v-model="formState.productName" placeholder="颜色名称" clearable />
</el-form-item>
<el-form-item label="产品品牌">
<el-input v-model="formState.brandName" placeholder="颜色名称" clearable />
<el-input v-model="formState.productName" placeholder="产品名称" clearable />
</el-form-item>
......@@ -17,12 +14,6 @@
</el-form>
<div class="">
<vxe-toolbar>
<template #buttons>
<!-- <vxe-button @click="allAlign = 'left'">居左</vxe-button> -->
<el-button type="primary" @click="showEdit = true">新增</el-button>
</template>
</vxe-toolbar>
<vxe-table
ref="xTable"
size="small"
......@@ -32,17 +23,9 @@
:data="tableData"
>
<vxe-column type="checkbox" width="50"></vxe-column>
<!-- <vxe-column field="productId" title="id" width="200"></vxe-column> -->
<vxe-column field="productName" title="产品名称" width="200"></vxe-column>
<vxe-column field="productStatus" title="产品状态" width="200"></vxe-column>
<vxe-column field="productUnit" title="产品单位" width="200"></vxe-column>
<vxe-column field="brandName" title="品牌名称" width="120"></vxe-column>
<vxe-column field="prodcutType" title="产品类型" show-overflow></vxe-column>
<vxe-column field="action" title="操作" width="100">
<template #default="{ row }">
<el-button type="primary" text size="small" @click="editRow(row)">修改</el-button>
</template>
</vxe-column>
<vxe-column field="productCode" title="产品编码" width="200"></vxe-column>
<vxe-column field="productName" title="产品名称"></vxe-column>
<vxe-column field="productCategoryId_dictText" title="产品类型" width="200"></vxe-column>
</vxe-table>
<vxe-pager
......@@ -101,6 +84,7 @@ import { apiDictFindById } from '@/api/common'
import { ElMessage } from 'element-plus'
import BrandModal from '@/components/BrandModal/BrandModal.vue'
import type { VxeTableInstance } from 'vxe-table'
import { queryParamsFilter } from '@/utils/query'
const brandVisible = ref(false)
const loading = ref(false)
......@@ -108,7 +92,6 @@ const saveLoading = ref(false)
const showEdit = ref(false)
const formState = reactive({
productName: '',
brandName: '',
currentPage: 1,
pageSize: 10,
total: 0
......@@ -119,7 +102,6 @@ const formRef = ref()
const xTable = ref<VxeTableInstance>()
const formRules = reactive({
productName: [{ required: true, message: '请输入产品名称', trigger: 'change' }]
// colorCode: [{ required: true, message: '请输入颜色编码', trigger: 'change' }]
})
const formEdit = reactive({
productId: '',
......@@ -147,7 +129,9 @@ const onHide = () => {
})
}
const onReset = () => {}
const onReset = () => {
formState.productName = ''
}
const editRow = (row) => {
Object.assign(formEdit, row)
......@@ -175,7 +159,7 @@ const onSubmit = async () => {
const onQuery = async () => {
loading.value = true
try {
const { data } = await getProductList(formState)
const { data } = await getProductList(queryParamsFilter(formState))
tableData.value = data.result.records
formState.total = +data.result.total
} catch {}
......
yarn.lock
View file @ 304cb871
......@@ -2635,6 +2635,11 @@ pify@^2.3.0:
resolved "https://registry.npmmirror.com/pify/-/pify-2.3.0.tgz"
integrity sha512-udgsAY+fTnvv7kI7aaxbqwWNb0AHiB0qBO89PZKPkoTmGOgdbrHDKD+0B2X4uTfJ/FT1R09r9gTsjUjNJotuog==
pinia-plugin-persistedstate@^3.2.1:
version "3.2.1"
resolved "https://registry.npmmirror.com/pinia-plugin-persistedstate/-/pinia-plugin-persistedstate-3.2.1.tgz#66780602aecd6c7b152dd7e3ddc249a1f7a13fe5"
integrity sha512-MK++8LRUsGF7r45PjBFES82ISnPzyO6IZx3CH5vyPseFLZCk1g2kgx6l/nW8pEBKxxd4do0P6bJw+mUSZIEZUQ==
pinia@^2.1.7:
version "2.1.7"
resolved "https://registry.npmmirror.com/pinia/-/pinia-2.1.7.tgz"
......
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