Skip to content

O
ops_2024_vue
Commit aaa1adfc authored by limengyang's avatar limengyang
Browse files
Options

feat(lmy):0402优化

parent 53e45829
Hide whitespace changes
Inline Side-by-side
Showing with 1757 additions and 1803 deletions
src/api/regionalSpotManage/index.ts
View file @ aaa1adfc
import { tmallabHttp } from '/@/utils/http/axios'; import { tmallabHttp } from '/@/utils/http/axios';
import { ContentTypeEnum } from '/@/enums/httpEnum';
enum Api { enum Api {
List = '/system/productNegotiated/getList', GetStatus = '/system/opsProduct/IsOpsSupplier',
BrandList = '/regionalSpotManage/commit', List = '/system/opsProduct/getList',
GroupList = '/system/opsProduct/getTypeList',
BrandList = '/system/supplierBrandQualification/getApproveList',
ProductList = '/system/productNegotiated/getProductList',
GetAreaList = '/system/opsProduct/getAreaList', GetAreaList = '/system/opsProduct/getAreaList',
OpsAddProduct = '/system/opsProduct/opsAddProduct', OpsAddProduct = '/system/opsProduct/opsAddProduct',
GetGhsAreaList = '/system/opsProduct/getGhsAreaList', GetGhsAreaList = '/system/opsProduct/getGhsAreaList',
...@@ -16,71 +20,95 @@ enum Api { ...@@ -16,71 +20,95 @@ enum Api {
/** /**
* @description: 区域现货管理列表 * @description: 区域现货管理列表
*/ */
export const regionalSpotManageListApi = (data) => export const regionalSpotManageGetStatusApi = () => tmallabHttp.post({ url: Api.GetStatus });
tmallabHttp.post({ url: Api.List, data }, { errorMessageMode: 'message'});
/**
* @description: 区域现货管理列表
*/
export const regionalSpotManageListApi = (data) =>
tmallabHttp.post({ url: Api.List, data }, { errorMessageMode: 'message' });
/** /**
* @description: 获取品牌列表 * @description: 获取品牌列表
*/ */
export const regionalSpotManageBrandListApi = (data) => export const regionalSpotManageBrandListApi = (data) =>
tmallabHttp.post({ url: Api.BrandList,data }, { errorMessageMode: 'message'}); tmallabHttp.post({ url: Api.BrandList, data });
/**
* @description: 获取分组列表
*/
export const regionalSpotManageGroupListApi = (data) =>
tmallabHttp.post({ url: Api.GroupList, data });
/**
* @description: 获取左边穿梭框商品列表
*/
export const regionalSpotManageProductListApi = (data) =>
tmallabHttp.post({ url: Api.ProductList, data });
/** /**
* @description: 获取现货区域列表 * @description: 获取现货区域列表
*/ */
export const regionalSpotManageGetAreaListApi = (data) => export const regionalSpotManageGetAreaListApi = (data) =>
tmallabHttp.post({ url: Api.GetAreaList,data },{ errorMessageMode: 'message' }); tmallabHttp.post({ url: Api.GetAreaList, data });
/** /**
* @description: 新增商品接口 * @description: 新增商品接口
*/ */
export const regionalSpotManageOpsAddProductApi = (data) => export const regionalSpotManageOpsAddProductApi = (data) =>
tmallabHttp.post({ url: Api.OpsAddProduct, data },{ errorMessageMode: 'message' }); tmallabHttp.post({ url: Api.OpsAddProduct, data }, { errorMessageMode: 'message' });
/** /**
* @description: 获取已开通区域 * @description: 获取已开通区域
*/ */
export const regionalSpotManageGetGhsAreaListApi = (data) => export const regionalSpotManageGetGhsAreaListApi = (data) =>
tmallabHttp.post({ url: Api.GetGhsAreaList, data },{ errorMessageMode: 'message' }); tmallabHttp.post({ url: Api.GetGhsAreaList, data });
/** /**
* @description: 单条/批量删除 * @description: 单条/批量删除
*/ */
export const regionalSpotManageOpsDeleteProductApi = (data) => export const regionalSpotManageOpsDeleteProductApi = (data) =>
tmallabHttp.post({ url: Api.OpsDeleteProduct, data },{ errorMessageMode: 'message' }); tmallabHttp.post({ url: Api.OpsDeleteProduct, data }, { errorMessageMode: 'message' });
/** /**
* @description: 增加区域 * @description: 增加区域
*/ */
export const regionalSpotManageOpsEditProductApi = (data) => export const regionalSpotManageOpsEditProductApi = (data) =>
tmallabHttp.post({ url: Api.OpsEditProduct, data },{ errorMessageMode: 'message' }); tmallabHttp.post({ url: Api.OpsEditProduct, data }, { errorMessageMode: 'message' });
/** /**
* @description: 批量上传 * @description: 批量上传
*/ */
export const regionalSpotManageUploadOpsProductApi = (data) => export const regionalSpotManageUploadOpsProductApi = (data) =>
tmallabHttp.post({ url: Api.UploadOpsProduct, data },{ errorMessageMode: 'message' }); tmallabHttp.post(
{
url: Api.UploadOpsProduct,
data,
headers: { 'Content-Type': ContentTypeEnum.FORM_DATA },
},
{ errorMessageMode: 'message' },
);
/** /**
* @description: 任务中心获取列表 * @description: 任务中心获取列表
*/ */
export const taskCenterQueryListApi = (data) => export const taskCenterQueryListApi = (data) =>
tmallabHttp.post({ url: Api.RevokeExcelUpload, data },{ errorMessageMode: 'message' }); tmallabHttp.post({ url: Api.RevokeExcelUpload, data }, { errorMessageMode: 'message' });
/** /**
* @description: 撤销 * @description: 撤销
*/ */
export const taskCenterRevokeExcelUploadApi = (data) => export const taskCenterRevokeExcelUploadApi = (data) =>
tmallabHttp.post({ url: Api.RevokeExcelUpload, data },{ errorMessageMode: 'message' }); tmallabHttp.post({ url: Api.RevokeExcelUpload, data }, { errorMessageMode: 'message' });
/** /**
* @description: 任务中心获取列表--平台商品批量页签 * @description: 任务中心获取列表--平台商品批量页签
*/ */
export const platformProBatchGetListApi = (data) => export const platformProBatchGetListApi = (data) =>
tmallabHttp.post({ url: Api.PlatformProBatchList, data },{ errorMessageMode: 'message' }); tmallabHttp.post({ url: Api.PlatformProBatchList, data }, { errorMessageMode: 'message' });
/** /**
* @description: 任务中心获取列表--平台商品批量页签--操作记录详情 * @description: 任务中心获取列表--平台商品批量页签--操作记录详情
*/ */
export const platformProBatchGetDetailApi = (data) => export const platformProBatchGetDetailApi = (data) =>
tmallabHttp.post({ url: Api.PlatformProBatchGetDetail, data },{ errorMessageMode: 'message' }); tmallabHttp.post({ url: Api.PlatformProBatchGetDetail, data }, { errorMessageMode: 'message' });
src/design/ant/index.less
View file @ aaa1adfc
...@@ -69,5 +69,5 @@ span.anticon:not(.app-iconify) { ...@@ -69,5 +69,5 @@ span.anticon:not(.app-iconify) {
margin-left: 24px; margin-left: 24px;
} }
.ant-modal-body { .ant-modal-body {
margin-top: 20px; padding: 20px !important;
} }
src/main.ts
View file @ aaa1adfc
...@@ -41,7 +41,7 @@ async function bootstrap() { ...@@ -41,7 +41,7 @@ async function bootstrap() {
app.use(Antd); app.use(Antd);
app.mount('#app'); app.mount('#app');
app.use(Antd) app.use(Antd);
} }
bootstrap(); bootstrap();
src/views/regionalSpotManage/components/addProduct.vue
View file @ aaa1adfc
<script lang="ts" setup> <script lang="ts" setup>
import { ref, computed } from 'vue'; import { ref, computed } from 'vue';
import { message } from 'ant-design-vue'; import { message } from 'ant-design-vue';
import { Input, Button } from 'ant-design-vue'; import { Input, Button } from 'ant-design-vue';
import { RightOutlined, LeftOutlined } from '@ant-design/icons-vue'; import { RightOutlined, LeftOutlined } from '@ant-design/icons-vue';
const emit = defineEmits(['close']); const emit = defineEmits(['close']);
import { import {
regionalSpotManageBrandListApi, regionalSpotManageBrandListApi,
regionalSpotManageGetAreaListApi, regionalSpotManageProductListApi,
regionalSpotManageOpsAddProductApi, regionalSpotManageGetAreaListApi,
} from '/@/api/regionalSpotManage'; regionalSpotManageOpsAddProductApi,
import { getAuthCache } from '/@/utils/auth'; } from '/@/api/regionalSpotManage';
const userInfo: any = getAuthCache('USER__INFO__'); import { getAuthCache } from '/@/utils/auth';
const ghsCode = userInfo.supplier.ghsCode; const userInfo: any = getAuthCache('USER__INFO__');
let searchBrand = ref(''); const ghsCode = userInfo.supplier.ghsCode;
let searchItemNo = ref(''); const searchBrand = ref('');
let searchBrandList = ref<any[]>([]); const searchItemNo = ref('');
const handleSearch = async (value) => { const searchBrandList = ref<any[]>([]);
const res = await regionalSpotManageBrandListApi({ brand: value }); const handleSearch = async (value) => {
if (res.code === 20000) { const res = await regionalSpotManageBrandListApi({ brand: value });
searchBrandList.value = res.data; if (res.success) {
} else { searchBrandList.value = res.data;
searchBrandList.value = []; } else {
} searchBrandList.value = [];
}; }
const closeModal = () => { };
emit('close', false); const closeModal = () => {
}; emit('close', false);
const leftData = ref<any[]>([]); };
const leftColumns = [ const leftLoading = ref(false);
{ const leftData = ref<any[]>([]);
title: '商品名称', const leftColumns = [
dataIndex: 'productName', {
key: 'productName', title: '商品名称',
width: '25%', key: 'productName',
align: 'center', width: '25%',
}, align: 'center',
{ title: '品牌', dataIndex: 'brand', key: 'brand', width: '25%', align: 'center' }, },
{ title: '货号', dataIndex: 'goodsNo', key: 'goodsNo', width: '20%', align: 'center' }, { title: '品牌', dataIndex: 'brand', key: 'brand', width: '25%', align: 'center' },
{ title: '规格', dataIndex: 'spec', key: 'spec', width: '20%', align: 'center' }, { title: '货号', dataIndex: 'goodsNo', key: 'goodsNo', width: '20%', align: 'center' },
]; { title: '规格', dataIndex: 'spec', key: 'spec', width: '20%', align: 'center' },
const pagination = ref({ ];
size: 'small', const pagination = ref({
pageSize: 10, size: 'small',
current: 1, pageSize: 10,
total: 0, current: 1,
showTotal: (total) => `共 ${total} 条`, total: 0,
hideOnSinglePage: false, showTotal: (total) => `共 ${total} 条`,
showQuickJumper: true, hideOnSinglePage: false,
showSizeChanger: true, showQuickJumper: true,
pageSizeOptions: ['10', '20', '30', '50', '100'], showSizeChanger: true,
onChange: (current) => { pageSizeOptions: ['10', '20', '30', '50', '100'],
pagination.value.current = current; onChange: (current) => {
getLeftData(); pagination.value.current = current;
}, getLeftData();
onShowSizeChange: (size) => { },
pagination.value.pageSize = size; onShowSizeChange: (size) => {
getLeftData(); pagination.value.pageSize = size;
}, getLeftData();
}); },
const getLeftData = () => { });
leftData.value = [ const reset = () => {
{ searchBrand.value = '';
productName: '测试产品1', searchItemNo.value = '';
brand: '测试品牌1', pagination.value.current = 1;
goodsNo: '213651', getLeftData();
spec: '100ml', };
sysid: '1', const getLeftData = async () => {
}, const param = {
{ pageIndex: pagination.value.current,
productName: '测试产品2', pageSize: pagination.value.pageSize,
brand: '测试品牌2', ghsCode: ghsCode,
goodsNo: '213652', productName: '',
spec: '100ml', brand: searchBrand.value,
sysid: '2', goodsNo: searchItemNo.value,
}, };
{ leftLoading.value = true;
productName: '测试产品3', const res = await regionalSpotManageProductListApi(param);
brand: '测试品牌3', if (res.success) {
goodsNo: '213653', leftData.value = res.data;
spec: '100ml', } else {
sysid: '3', leftData.value = [];
}, }
{ leftLoading.value = false;
productName: '测试产品4', if (rightData.value.length > 0) {
brand: '测试品牌4', for (let i = 0; i < rightData.value.length; i++) {
goodsNo: '213654', if (
spec: '100ml', leftData.value.findIndex(
sysid: '4', (v) =>
}, v.brand + v.goodsNo + v.spec ===
{ rightData.value[i].brand + rightData.value[i].goodsNo + rightData.value[i].spec,
productName: '测试产品5', ) !== -1
brand: '测试品牌5', ) {
goodsNo: '213655', leftData.value.find(
spec: '100ml', (v) =>
sysid: '5', v.brand + v.goodsNo + v.spec ===
choice: true, rightData.value[i].brand + rightData.value[i].goodsNo + rightData.value[i].spec,
}, ).choice = true;
{ }
productName: '测试产品6', }
brand: '测试品牌6', }
goodsNo: '213656', leftData.value = [...leftData.value];
spec: '100ml', pagination.value.total = leftData.value.length;
sysid: '6', };
choice: true, const selectedRowKeys = ref<any[]>([]);
}, const selectedRows = ref<any[]>([]);
]; const rowSelection = computed(() => {
if (rightData.value.length > 0) { return {
for (let i = 0; i < rightData.value.length; i++) { selectedRowKeys: selectedRowKeys.value,
if ( onChange: (RowKeys, Rows) => {
leftData.value.findIndex( selectedRowKeys.value = RowKeys;
(v) => selectedRows.value = Rows;
v.brand + v.goodsNo + v.spec === },
rightData.value[i].brand + rightData.value[i].goodsNo + rightData.value[i].spec, getCheckboxProps: (record) => ({
) !== -1 disabled: record.choice === true,
) { }),
leftData.value.find( };
(v) => });
v.brand + v.goodsNo + v.spec === const toRight = () => {
rightData.value[i].brand + rightData.value[i].goodsNo + rightData.value[i].spec, let arr = JSON.parse(JSON.stringify(selectedRows.value));
).choice = true; rightData.value = [...arr, ...rightData.value];
} for (let i = 0; i < selectedRows.value.length; i++) {
} if (
} leftData.value.findIndex(
leftData.value = [...leftData.value]; (v) =>
pagination.value.total = leftData.value.length; v.brand + v.goodsNo + v.spec ===
}; selectedRows.value[i].brand +
let selectedRowKeys = ref<any[]>([]); selectedRows.value[i].goodsNo +
let selectedRows = ref<any[]>([]); selectedRows.value[i].spec,
const rowSelection = computed(() => { ) !== -1
return { ) {
selectedRowKeys: selectedRowKeys.value, leftData.value.find(
onChange: (RowKeys, Rows) => { (v) =>
selectedRowKeys.value = RowKeys; v.brand + v.goodsNo + v.spec ===
selectedRows.value = Rows; selectedRows.value[i].brand +
}, selectedRows.value[i].goodsNo +
getCheckboxProps: (record) => ({ selectedRows.value[i].spec,
disabled: record.choice === true, ).choice = true;
}), }
}; }
}); leftData.value = [...leftData.value];
const toRight = () => { selectedRowKeys.value = [];
console.log(selectedRows.value); selectedRows.value = [];
let arr = JSON.parse(JSON.stringify(selectedRows.value)); };
rightData.value = [...arr, ...rightData.value]; const rightData = ref<any[]>([]);
for (let i = 0; i < selectedRows.value.length; i++) { const rightSelectedRowKeys = ref<any[]>([]);
if ( const rightSelectedRows = ref<any[]>([]);
leftData.value.findIndex( const rightRowSelection = computed(() => {
(v) => return {
v.brand + v.goodsNo + v.spec === selectedRowKeys: rightSelectedRowKeys.value,
selectedRows.value[i].brand + onChange: (RowKeys, Rows) => {
selectedRows.value[i].goodsNo + rightSelectedRowKeys.value = RowKeys;
selectedRows.value[i].spec, rightSelectedRows.value = Rows;
) !== -1 },
) { };
leftData.value.find( });
(v) => const toLeft = () => {
v.brand + v.goodsNo + v.spec === for (let i = 0; i < rightSelectedRows.value.length; i++) {
selectedRows.value[i].brand + if (
selectedRows.value[i].goodsNo + leftData.value.findIndex(
selectedRows.value[i].spec, (v) =>
).choice = true; v.brand + v.goodsNo + v.spec ===
} rightSelectedRows.value[i].brand +
} rightSelectedRows.value[i].goodsNo +
leftData.value = [...leftData.value]; rightSelectedRows.value[i].spec,
selectedRowKeys.value = []; ) !== -1
selectedRows.value = []; ) {
}; leftData.value.find(
const rightData = ref<any[]>([]); (v) =>
const rightSelectedRowKeys = ref<any[]>([]); v.brand + v.goodsNo + v.spec ===
const rightSelectedRows = ref<any[]>([]); rightSelectedRows.value[i].brand +
const rightRowSelection = computed(() => { rightSelectedRows.value[i].goodsNo +
return { rightSelectedRows.value[i].spec,
selectedRowKeys: rightSelectedRowKeys.value, ).choice = false;
onChange: (RowKeys, Rows) => { rightData.value.splice(
rightSelectedRowKeys.value = RowKeys; rightData.value.findIndex(
rightSelectedRows.value = Rows; (v) =>
}, v.brand + v.goodsNo + v.spec ==
}; rightSelectedRows.value[i].brand +
}); rightSelectedRows.value[i].goodsNo +
const toLeft = () => { rightSelectedRows.value[i].spec,
for (let i = 0; i < rightSelectedRows.value.length; i++) { ),
if ( 1,
leftData.value.findIndex( );
(v) => } else {
v.brand + v.goodsNo + v.spec === rightData.value.splice(
rightSelectedRows.value[i].brand + rightData.value.findIndex(
rightSelectedRows.value[i].goodsNo + (v) =>
rightSelectedRows.value[i].spec, v.brand + v.goodsNo + v.spec ==
) !== -1 rightSelectedRows.value[i].brand +
) { rightSelectedRows.value[i].goodsNo +
leftData.value.find( rightSelectedRows.value[i].spec,
(v) => ),
v.brand + v.goodsNo + v.spec === 1,
rightSelectedRows.value[i].brand + );
rightSelectedRows.value[i].goodsNo + }
rightSelectedRows.value[i].spec, }
).choice = false; leftData.value = [...leftData.value];
rightData.value.splice( rightData.value = [...rightData.value];
rightData.value.findIndex( rightSelectedRowKeys.value = [];
(v) => rightSelectedRows.value = [];
v.brand + v.goodsNo + v.spec == };
rightSelectedRows.value[i].brand + const rowClassName = () => {
rightSelectedRows.value[i].goodsNo + return 'table-back';
rightSelectedRows.value[i].spec, };
), const loading = ref(false);
1, const addressLoading = ref(false);
); const goNext = async () => {
} else { if (!rightData.value.length) return message.error('请先选择商品');
rightData.value.splice( addressVisible.value = true;
rightData.value.findIndex( addressLoading.value = true;
(v) => const res = await regionalSpotManageGetAreaListApi({});
v.brand + v.goodsNo + v.spec == if (res.success) {
rightSelectedRows.value[i].brand + areaList.value = res.data;
rightSelectedRows.value[i].goodsNo + } else {
rightSelectedRows.value[i].spec, areaList.value = [];
), }
1, addressLoading.value = false;
); };
} // ==================================================
} const confirmLoading = ref(false);
leftData.value = [...leftData.value]; const addressVisible = ref(false);
rightData.value = [...rightData.value]; const checkboxValue = ref([]);
rightSelectedRowKeys.value = []; interface AreaIds {
rightSelectedRows.value = []; city?: string;
}; cityId?: number;
const rowClassName = () => { creationTime?: string;
return 'table-back'; creator?: string;
}; id?: number;
let loading = ref(false); province?: string;
let addressLoading = ref(false); provinceId?: number;
const goNext = async () => { }
if (!rightData.value.length) return message.error('请先选择商品'); const areaList = ref<AreaIds[]>([]);
addressVisible.value = true; const handleCancel = () => {
addressLoading.value = true; addressVisibleClose();
const res = await regionalSpotManageGetAreaListApi({}); };
if (res.code === 20000) { const goPrevious = () => {
areaList.value = res.data; addressVisibleClose();
} else { };
areaList.value = []; const addressVisibleClose = () => {
} addressVisible.value = false;
addressLoading.value = false; checkboxValue.value = [];
}; };
// ================================================== const confirm = async () => {
const confirmLoading = ref(false); if (!checkboxValue.value.length) return message.error('请选择现货区域');
const addressVisible = ref(false); const param = ref<{ [key: string]: any }>({
const checkboxValue = ref([]); products: [],
const areaList = ref<any[]>([ areas: '',
{ });
id: '0', param.value.products = rightData.value.map((v) => {
provinceId: '0', return {
province: '北京市', goodsNo: v.goodsNo,
cityId: 0, brand: v.brand,
city: '市辖区', spec: v.spec,
creator: '', ghscode: ghsCode,
creationTime: '', };
}, });
{ param.value.areas = checkboxValue.value;
id: '1', confirmLoading.value = true;
provinceId: '1', const res = await regionalSpotManageOpsAddProductApi(param.value);
province: '河北省', if (res.success) {
cityId: 1, message.success('新增成功');
city: '保定市', addressVisibleClose();
creator: '', emit('close', false, 'refresh');
creationTime: '', } else {
}, message.error(res.message);
{ }
id: '2', confirmLoading.value = false;
provinceId: '2', };
province: '河北省', </script>
cityId: 2,
city: '石家庄市', <template>
creator: '', <a-modal
creationTime: '', :visible="true"
}, title="新增区域现货商品"
{ :width="1200"
id: '3', @cancel="closeModal"
provinceId: '3', :maskClosable="false"
province: '河北省', :keyboard="false"
cityId: 3, >
city: '秦皇岛市', <template #footer>
creator: '', <a-button key="back" @click="closeModal">取消</a-button>
creationTime: '', <a-button key="submit" type="primary" :loading="loading" @click="goNext">下一步</a-button>
}, </template>
{ <div>
id: '4', <span>品牌名称：</span>
provinceId: '4', <a-select
province: '河北省', v-model:value="searchBrand"
cityId: 3, show-search
city: '承德市', placeholder="请输入品牌名称"
creator: '', style="width: 200px"
creationTime: '', :default-active-first-option="false"
}, :show-arrow="false"
]); :filter-option="false"
const handleCancel = () => { :not-found-content="null"
addressVisibleClose(); @search="handleSearch"
}; >
const goPrevious = () => { <a-select-option
addressVisibleClose(); v-for="item in searchBrandList"
}; :key="item.brand"
const addressVisibleClose = () => { :label="item.brand"
addressVisible.value = false; :value="item.brand"
checkboxValue.value = []; >
}; {{ item.brand }}
const confirm = async () => { </a-select-option>
if (!checkboxValue.value.length) return message.error('请选择现货区域'); </a-select>
const param = ref<{ [key: string]: any }>({ <span style="margin-left: 15px">货号：</span>
products: [], <Input
areas: '', v-model:value="searchItemNo"
}); allow-clear
param.value.products = rightData.value.map((v) => { placeholder="请输入货号"
return { style="width: 200px"
goodsNo: v.goodsNo, />
brand: v.brand, <Button @click="reset" style="margin-left: 10px">重置</Button>
spec: v.spec, <Button @click="getLeftData" type="primary" style="margin-left: 10px">查询</Button>
ghscode: ghsCode, </div>
}; <div class="main">
}); <div class="left">
param.value.areas = checkboxValue.value.join; <div class="header">
console.log(param.value); <div>筛选结果商品</div>
confirmLoading.value = true; <span>{{ selectedRowKeys.length }}/{{ pagination.total }}</span>
const res = await regionalSpotManageOpsAddProductApi(param.value); </div>
if (res.code === 20000) { <div class="table">
message.success('新增成功'); <a-table
addressVisibleClose(); bordered
emit('close', false); :data-source="leftData"
} else { :columns="leftColumns"
message.error(res.message); :pagination="pagination"
} :row-selection="rowSelection"
confirmLoading.value = false; :rowKey="(record) => record.brand + record.goodsNo + record.spec"
}; :scroll="{ x: false, y: 280 }"
</script> :rowClassName="rowClassName"
:loading="leftLoading"
<template> >
<a-modal <template #bodyCell="{ column, record }">
:visible="true" <template v-if="column.key === 'productName'">
title="新增区域现货商品" <span>{{ record.chineseName ? record.chineseName : record.englishName }}</span>
:width="1200" </template>
@cancel="closeModal" </template>
:maskClosable="false" </a-table>
:keyboard="false" </div>
> </div>
<template #footer> <div class="operate">
<a-button key="back" @click="closeModal">取消</a-button> <div style="margin-top: 200px; display: flex">
<a-button key="submit" type="primary" :loading="loading" @click="goNext">下一步</a-button> <a-button
</template> @click="toLeft"
<div> type="primary"
<span>品牌名称：</span> :disabled="rightSelectedRowKeys.length === 0"
<a-select style="display: block; margin-bottom: 10px; margin-right: 10px"
v-model:value="searchBrand" >
show-search <template #icon>
placeholder="请输入品牌名称" <LeftOutlined />
style="width: 200px" </template>
:default-active-first-option="false" </a-button>
:show-arrow="false" <a-button
:filter-option="false" @click="toRight"
:not-found-content="null" type="primary"
@search="handleSearch" style="display: block"
> :disabled="selectedRowKeys.length === 0"
<a-select-option >
v-for="item in searchBrandList" <template #icon>
:key="item.value" <RightOutlined />
:label="item.label" </template>
:value="item.value" </a-button>
> </div>
{{ item.label }} </div>
</a-select-option> <div class="right">
</a-select> <div class="header">
<span style="margin-left: 15px">货号：</span> <div>被选中商品</div>
<Input <span>{{ rightSelectedRowKeys.length }}/{{ rightData.length }}</span>
v-model:value="searchItemNo" </div>
allow-clear <div class="table">
placeholder="请输入货号" <a-table
style="width: 200px" :data-source="rightData"
/> :columns="leftColumns"
<Button style="margin-left: 10px">重置</Button> :pagination="false"
<Button @click="getLeftData" type="primary" style="margin-left: 10px">查询</Button> :rowKey="(record) => record.brand + record.goodsNo + record.spec"
</div> :scroll="{ x: false, y: 280 }"
<div class="main"> :rowClassName="rowClassName"
<div class="left"> :row-selection="rightRowSelection"
<div class="header"> >
<div>筛选结果商品</div> <template #bodyCell="{ column, record }">
<span>{{ selectedRowKeys.length }}/{{ pagination.total }}</span> <template v-if="column.key === 'productName'">
</div> <span>{{ record.chineseName ? record.chineseName : record.englishName }}</span>
<div class="table"> </template>
<a-table </template>
bordered </a-table>
:data-source="leftData" </div>
:columns="leftColumns" </div>
:pagination="pagination" </div>
:row-selection="rowSelection" </a-modal>
:rowKey="(record) => record.brand + record.goodsNo + record.spec" <a-modal
:scroll="{ x: false, y: 280 }" v-model:visible="addressVisible"
:rowClassName="rowClassName" title="新增区域现货商品"
:loading="loading" @cancel="handleCancel"
> @ok="confirm"
<!-- <template #bodyCell="{ column, record }"> :width="1200"
<template v-if="column.key === 'productName'"> :maskClosable="false"
<span>{{ record.chineseName ? record.chineseName : record.englishName }}</span> :keyboard="false"
</template> >
</template> --> <template #footer>
</a-table> <a-button :loading="confirmLoading" @click="handleCancel">取消</a-button>
</div> <a-button :loading="confirmLoading" @click="goPrevious">上一步</a-button>
</div> <a-button type="primary" :loading="confirmLoading" @click="confirm">提交</a-button>
<div class="operate"> </template>
<div style="margin-top: 200px; display: flex"> <a-alert type="warning">
<a-button <template #message>
@click="toLeft" <span style="color: red">特别提醒：</span
type="primary" >北京市-直辖市；天津市-直辖市。本次设置为，北京市-直辖市；四川省-成都市。提交后，商品现货区域将更新为
:disabled="rightSelectedRowKeys.length === 0" 北京市-直辖市；天津市-直辖市；四川省-成都市。
style="display: block; margin-bottom: 10px; margin-right: 10px" </template>
> </a-alert>
<template #icon> <a-spin v-if="addressLoading" style="height: 150px; width: 100%; line-height: 150px" />
<LeftOutlined /> <div v-else>
</template> <p style="margin-top: 15px">选择现货区域：</p>
</a-button> <a-checkbox-group v-model:value="checkboxValue" style="width: 100%">
<a-button <a-row>
@click="toRight" <a-col :span="6" v-for="(item, index) in areaList" :key="index">
type="primary" <a-checkbox :value="item.cityId">{{ item.province }}-{{ item.city }}</a-checkbox>
style="display: block" </a-col>
:disabled="selectedRowKeys.length === 0" </a-row>
> </a-checkbox-group>
<template #icon> </div>
<RightOutlined /> </a-modal>
</template> </template>
</a-button>
</div> <style lang="less" scoped>
</div> .main {
<div class="right"> display: flex;
<div class="header"> justify-content: space-around;
<div>被选中商品</div> width: 100%;
<span>{{ rightSelectedRowKeys.length }}/{{ rightData.length }}</span> margin-top: 15px;
</div> .left {
<div class="table"> width: 45%;
<a-table border: 1px solid #ddd;
:data-source="rightData" height: 450px;
:columns="leftColumns" .header {
:pagination="false" display: flex;
:rowKey="(record) => record.brand + record.goodsNo + record.spec" justify-content: space-between;
:scroll="{ x: false, y: 280 }" align-items: center;
:rowClassName="rowClassName" padding: 0 10px;
:row-selection="rightRowSelection" height: 60px;
/> background: #f3f6f9;
</div> }
</div> }
</div> .right {
</a-modal> width: 45%;
<a-modal border: 1px solid #ddd;
v-model:visible="addressVisible" height: 450px;
title="新增区域现货商品" .header {
@cancel="handleCancel" display: flex;
@ok="confirm" justify-content: space-between;
:width="1200" align-items: center;
:maskClosable="false" padding: 0 10px;
:keyboard="false" height: 60px;
> background: #f3f6f9;
<template #footer> }
<a-button :loading="confirmLoading" @click="handleCancel">取消</a-button> }
<a-button :loading="confirmLoading" @click="goPrevious">上一步</a-button> .operate {
<a-button type="primary" :loading="confirmLoading" @click="confirm">提交</a-button> width: 10%;
</template> height: 450px;
<a-alert type="warning"> display: flex;
<template #message> justify-content: center;
<span style="color: red">特别提醒：</span align-content: center;
>北京市-直辖市；天津市-直辖市。本次设置为，北京市-直辖市；四川省-成都市。提交后，商品现货区域将更新为 }
北京市-直辖市；天津市-直辖市；四川省-成都市。 }
</template> /deep/.table-back {
</a-alert> background-color: #fff;
<a-spin v-if="addressLoading" style="height: 150px; width: 100%; line-height: 150px" /> }
<div v-else> </style>
<p style="margin-top: 15px">选择现货区域：</p>
<a-checkbox-group v-model:value="checkboxValue" style="width: 100%">
<a-row>
<a-col :span="6" v-for="(item, index) in areaList" :key="index">
<a-checkbox :value="item.id">{{ item.province }}-{{ item.city }}</a-checkbox>
</a-col>
</a-row>
</a-checkbox-group>
</div>
</a-modal>
</template>
<style lang="less" scoped>
.main {
display: flex;
justify-content: space-around;
width: 100%;
margin-top: 15px;
.left {
width: 45%;
border: 1px solid #ddd;
height: 450px;
.header {
display: flex;
justify-content: space-between;
align-items: center;
padding: 0 10px;
height: 60px;
background: #f3f6f9;
}
}
.right {
width: 45%;
border: 1px solid #ddd;
height: 450px;
.header {
display: flex;
justify-content: space-between;
align-items: center;
padding: 0 10px;
height: 60px;
background: #f3f6f9;
}
}
.operate {
width: 10%;
height: 450px;
display: flex;
justify-content: center;
align-content: center;
}
}
/deep/.table-back {
background-color: #fff;
}
</style>
src/views/regionalSpotManage/components/downLoadTask.vue
View file @ aaa1adfc
<script lang="ts" setup> <script lang="ts" setup>
import { ref, onMounted } from 'vue'; import { ref, onMounted } from 'vue';
const config = import.meta.env const config = import.meta.env;
import { import { taskCenterQueryListApi } from '/@/api/regionalSpotManage';
taskCenterQueryListApi, onMounted(async () => {
} from '/@/api/regionalSpotManage'; getList();
onMounted(async () => { });
getList() let list = ref<any[]>([]);
}); let listLoading = ref(false);
let list = ref<any[]>([]) const downLoad = (url) => {
let listLoading = ref(false) window.open(config.VITE_GLOB_API_URL + '/system/' + url, '_blank');
const downLoad = (url) => { };
window.open(config.VITE_GLOB_API_URL + '/system/' + url, '_blank') const getList = async () => {
} listLoading.value = true;
const getList = async () => { const res = await taskCenterQueryListApi({ type: 1 });
listLoading.value = true if (res.success) {
const res = await taskCenterQueryListApi({type:1}) list.value = res.data;
if (res.code === 20000) { } else {
list.value = res.data list.value = [];
} else { }
list.value = [] listLoading.value = false;
} };
listLoading.value = false </script>
}
</script> <template>
<div>
<template> <a-button @click="getList" type="primary">刷新数据</a-button>
<div> </div>
<a-button @click="getList" type="primary">刷新数据</a-button> <a-table
</div> :data-source="list"
<a-table :loading="listLoading"
:data-source="list" bordered
:loading="listLoading" :rowKey="(record) => record.sysid"
bordered style="margin-top: 15px"
:rowKey="(record) => record.sysid" >
style="margin-top: 15px" <a-table-column title="操作时间" align="center" :width="100">
> <template #default="{ record }">
<a-table-column title="操作时间" align="center" :width="100"> {{ record.createTime }}
<template v-slot="{record}"> </template>
{{ record.createTime }} </a-table-column>
</template> <a-table-column title="类型" align="center" :width="100">
</a-table-column> <template #default="{ record }">
<a-table-column title="类型" align="center" :width="100"> {{ record.type }}
<template v-slot="{record}"> </template>
{{ record.type }} </a-table-column>
</template> <a-table-column title="导出状态" align="center" :width="100">
</a-table-column> <template #default="{ record }">
<a-table-column title="导出状态" align="center" :width="100"> <p>{{ record.status == 0 ? '待进行 ' : record.status == 1 ? '进行中' : '已完成' }}</p>
<template v-slot="{record}"> </template>
<p>{{ record.status == 0 ? '待进行 ': (record.status == 1 ? '进行中' : '已完成') }}</p> </a-table-column>
</template> <a-table-column title="数据量" align="center" :width="100">
</a-table-column> <template #default="{ record }">
<a-table-column title="数据量" align="center" :width="100"> {{ record.successNum }}
<template v-slot="{record}"> </template>
{{ record.successNum }} </a-table-column>
</template> <a-table-column title="操作人" align="center" :width="100">
</a-table-column> <template #default="{ record }">
<a-table-column title="操作人" align="center" :width="100"> {{ record.createName }}
<template v-slot="{record}"> </template>
{{ record.createName }} </a-table-column>
</template> <a-table-column title="操作" align="center" :width="200">
</a-table-column> <template #default="{ record }">
<a-table-column title="操作" align="center" :width="200"> <Button v-if="record.fileUrl" type="link" @click="downLoad(record.fileUrl)"
<template v-slot="{record}"> >下载文件</Button
<Button v-if="record.fileUrl" type="link" @click="downLoad(record.fileUrl)">下载文件</Button> >
<span v-else>——</span> <span v-else>——</span>
</template> </template>
</a-table-column> </a-table-column>
</a-table> </a-table>
</template> </template>
<style lang="less" scoped> <style lang="less" scoped></style>
</style>
src/views/regionalSpotManage/components/list.vue
View file @ aaa1adfc
<script lang="ts" setup> <script lang="ts" setup>
import { ref, onMounted } from 'vue'; import { ref, onMounted } from 'vue';
import { import {
Form, Form,
FormItem, FormItem,
Input, Input,
Button, Button,
Select, Select,
SelectOption, SelectOption,
Row, Row,
Col, Col,
message, message,
} from 'ant-design-vue'; } from 'ant-design-vue';
import { UploadOutlined } from '@ant-design/icons-vue'; import { UploadOutlined } from '@ant-design/icons-vue';
import { useRouter } from 'vue-router'; import { useRouter } from 'vue-router';
import { getAuthCache } from '/@/utils/auth'; import { getAuthCache } from '/@/utils/auth';
import { import {
regionalSpotManageBrandListApi, regionalSpotManageBrandListApi,
regionalSpotManageListApi, regionalSpotManageGroupListApi,
regionalSpotManageGetAreaListApi, regionalSpotManageListApi,
regionalSpotManageGetGhsAreaListApi, regionalSpotManageGetAreaListApi,
regionalSpotManageOpsDeleteProductApi, regionalSpotManageGetGhsAreaListApi,
regionalSpotManageOpsEditProductApi, regionalSpotManageOpsDeleteProductApi,
regionalSpotManageUploadOpsProductApi, regionalSpotManageOpsEditProductApi,
} from '/@/api/regionalSpotManage'; regionalSpotManageUploadOpsProductApi,
import addProductModal from './addProduct.vue'; } from '/@/api/regionalSpotManage';
const config = import.meta.env; import addProductModal from './addProduct.vue';
const userInfo: any = getAuthCache('USER__INFO__'); const config = import.meta.env;
const ghsCode = userInfo.supplier.ghsCode; const userInfo: any = getAuthCache('USER__INFO__');
const router = useRouter(); const ghsCode = userInfo.supplier.ghsCode;
const list = ref<any[]>([]); const router = useRouter();
onMounted(async () => { const list = ref<any[]>([]);
getList(); onMounted(async () => {
getAllAreaList(); getList();
}); getAllAreaList();
const searchForm = ref<{ getGroupOption();
brandList: any; });
goodsNo: any; const searchForm = ref<{
areaIds: any; brands: any;
types: any; goodsNo: any;
}>({ areaIds: any;
brandList: [], types: any;
goodsNo: '', }>({
areaIds: [], brands: [],
types: [], goodsNo: '',
}); areaIds: [],
const areaIdsOption = ref([ types: [],
{ label: '区域1', value: '区域1' }, });
{ label: '区域2', value: '区域2' }, interface AreaIds {
]); city?: string;
const typesOption = ref([ cityId?: number;
{ label: '组1', value: '组1' }, creationTime?: string;
{ label: '组2', value: '组2' }, creator?: string;
]); id?: number;
let searchBrandList = ref<any[]>([]); province?: string;
const handleSearch = async (value) => { provinceId?: number;
const res = await regionalSpotManageBrandListApi({ brand: value }); }
if (res.code === 20000) { const areaIdsOption = ref<AreaIds[]>([]);
searchBrandList.value = res.data; const typesOption = ref([]);
} else { const searchBrandList = ref<any[]>([]);
searchBrandList.value = []; const handleSearch = async (value) => {
} const res = await regionalSpotManageBrandListApi({ brand: value });
}; if (res.success) {
let listLoading = ref(false); searchBrandList.value = res.data;
const pagination = ref({ } else {
pageSize: 10, searchBrandList.value = [];
current: 1, }
total: 0, };
showTotal: (total) => `共 ${total} 条`, const listLoading = ref(false);
hideOnSinglePage: false, const pagination = ref({
showQuickJumper: true, pageSize: 10,
showSizeChanger: true, current: 1,
pageSizeOptions: ['10', '20', '30', '50', '100'], total: 0,
onChange: (current) => { showTotal: (total) => `共 ${total} 条`,
pagination.value.current = current; hideOnSinglePage: false,
getList(); showQuickJumper: true,
}, showSizeChanger: true,
onShowSizeChange: (size) => { pageSizeOptions: ['10', '20', '30', '50', '100'],
pagination.value.pageSize = size; onChange: (current) => {
getList(); pagination.value.current = current;
}, getList();
}); },
const getList = async () => { onShowSizeChange: (size) => {
const pager = ref({ pagination.value.pageSize = size;
pageIndex: 1, getList();
pageSize: 10, },
}); });
const param = ref({ const getList = async () => {
...searchForm.value, const pager = ref({
...pager.value, pageIndex: 1,
}); pageSize: 10,
param.value.areaIds = param.value.areaIds ? param.value.areaIds : []; });
param.value.types = param.value.types ? param.value.types : []; const param = ref({
listLoading.value = true; ...searchForm.value,
const res = await regionalSpotManageListApi(param.value); ...pager.value,
if (res.code === 20000) { });
list.value = res.data; param.value.areaIds = param.value.areaIds ? param.value.areaIds : [];
pagination.value.total = res.data[0].total; param.value.types = param.value.types ? param.value.types : [];
} else { listLoading.value = true;
list.value = []; const res = await regionalSpotManageListApi(param.value);
pagination.value.total = 0; if (res.success) {
} list.value = res.data;
listLoading.value = false; pagination.value.total = res.data[0].total;
list.value = [ } else {
{ list.value = [];
productName: '测试商品', pagination.value.total = 0;
brand: '测试品牌', }
goodsNo: '45641', listLoading.value = false;
spec: '100ml', };
productStatus: '上架', const onRset = () => {
sysid: '1', searchForm.value.brands = [];
}, searchForm.value.goodsNo = '';
{ searchForm.value.areaIds = [];
productName: 'ffff', searchForm.value.types = [];
brand: 'fff', getList();
goodsNo: 'fff', };
spec: 'ff', const onSearch = () => {
productStatus: '上架', pagination.value.current = 1;
sysid: '2', getList();
}, };
];
}; const showModal = ref(false);
const onRset = () => { const addProduct = () => {
searchForm.value.brandList = []; showModal.value = true;
searchForm.value.goodsNo = ''; };
searchForm.value.areaIds = []; // 关闭新增商品弹窗
searchForm.value.types = []; const closeVisible = (val, action) => {
getList(); showModal.value = val;
}; if (action) {
const onSearch = () => { onSearch();
pagination.value.pageSize = 1; }
getList(); };
};
const curItem = ref<{ [key: string]: any }>({});
let showModal = ref(false);
const addProduct = () => { // =========查看区域现货 statr ===========
showModal.value = true; const loading1 = ref(false);
}; const visible = ref(false);
// 关闭新增商品弹窗 const regionalSpotGoods = ref([]);
const closeVisible = (val) => { const viewCurrent = async (val) => {
showModal.value = val; curItem.value = val;
}; visible.value = true;
const param = ref<{ [key: string]: any }>({
let curItem = ref<{ [key: string]: any }>({}); products: [
{
// =========查看区域现货 statr =========== goodsNo: val.goodsNo,
const loading1 = ref(false); brand: val.brand,
const visible = ref(false); spec: val.spec,
const regionalSpotGoods = ref([]); ghscode: ghsCode,
const viewCurrent = async (val) => { },
curItem.value = val; ],
visible.value = true; });
const param = ref<{ [key: string]: any }>({ loading1.value = true;
products: [ const result = await getAreaList(param.value);
{ regionalSpotGoods.value = result;
goodsNo: val.goodsNo, loading1.value = false;
brand: val.brand, };
spec: val.spec, const getAreaList = async (param) => {
ghscode: ghsCode, const res = await regionalSpotManageGetGhsAreaListApi(param);
}, if (res.success) {
], return res.data;
}); } else {
console.log(param.value); return [];
loading1.value = true; }
const result = await getAreaList(param.value); };
regionalSpotGoods.value = result; // ==========查看区域现货 end =============
loading1.value = false;
}; const selectedRowKeys = ref([]);
const getAreaList = async (param) => { const selectedRows = ref<any[]>([]);
const res = await regionalSpotManageGetGhsAreaListApi(param); const onSelectChange = (Keys, Rows) => {
if (res.code === 20000) { selectedRowKeys.value = Keys;
return res.data; selectedRows.value = Rows;
} else { };
return []; // ===============增加区域 start=======================
} const addVisible = ref(false);
}; const addAreaLoading = ref(false);
// ==========查看区域现货 end ============= const addCheckboxValue = ref<number[]>([]);
const addArea = async (row) => {
let selectedRowKeys = ref([]); curItem.value = row;
let selectedRows = ref<any[]>([]); addVisible.value = true;
const onSelectChange = (Keys, Rows) => { addAreaLoading.value = true;
selectedRowKeys.value = Keys; const param = ref<{ [key: string]: any }>({
selectedRows.value = Rows; products: [
}; {
// ===============增加区域 start======================= goodsNo: row.goodsNo,
let addVisible = ref(false); brand: row.brand,
let addAreaLoading = ref(false); spec: row.spec,
let addCheckboxValue = ref(['0']); ghscode: ghsCode,
const addArea = async (row) => { },
curItem.value = row; ],
addVisible.value = true; });
addAreaLoading.value = true; const result = await getAreaList(param.value);
const param = ref<{ [key: string]: any }>({ delAreaList.value = result;
products: [ const curArr = delAreaList.value.map((it) => it.cityCode);
{ for (const k of allAreaList.value) {
goodsNo: row.goodsNo, if (curArr.includes(k.cityId)) {
brand: row.brand, addCheckboxValue.value.push(k.cityId);
spec: row.spec, k.disabled = true;
ghscode: ghsCode, }
}, }
], addAreaLoading.value = false;
}); };
const result = await getAreaList(param.value); const addVisibleCancel = () => {
delAreaList.value = result; addVisible.value = false;
const curArr = delAreaList.value.map((it) => it.id); addCheckboxValue.value = [];
for (const k of allAreaList.value) { };
if (curArr.includes(k.id)) { const confirmAddLoading = ref(false);
addCheckboxValue.value.push(k.id); const confirmAddArea = async () => {
k.disabled = true; const param = ref<{ [key: string]: any }>({
} products: [
} {
addAreaLoading.value = false; goodsNo: curItem.value.goodsNo,
}; brand: curItem.value.brand,
const addVisibleCancel = () => { spec: curItem.value.spec,
addVisible.value = false; ghscode: ghsCode,
addCheckboxValue.value = []; },
}; ],
let confirmAddLoading = ref(false); areas: addCheckboxValue.value,
const confirmAddArea = async () => { });
const param = ref<{ [key: string]: any }>({ confirmAddLoading.value = true;
products: [ const res = await regionalSpotManageOpsEditProductApi(param.value);
{ if (res.success) {
goodsNo: curItem.value.goodsNo, message.success('添加区域成功');
brand: curItem.value.brand, addVisibleCancel();
spec: curItem.value.spec, } else {
ghscode: ghsCode, message.error(res.message);
}, }
], confirmAddLoading.value = false;
areas: addCheckboxValue.value.join, };
}); // ===============增加区域 end=======================
confirmAddLoading.value = true;
const res = await regionalSpotManageOpsEditProductApi(param.value); // ================区域现货商品删除 start=====================
if (res.success) { const delVisible = ref(false);
message.success('添加区域成功'); const delLoading = ref(false);
} else { const deleteNum = ref(0);
message.error(res.message); const radioValue = ref(1);
} const delAreaList = ref<any[]>([]); //已添加的区域
confirmAddLoading.value = false; const delCheckboxValue = ref([]);
}; const del = async (val) => {
// ===============增加区域 end======================= curItem.value = val;
deleteNum.value = 1;
// ================区域现货商品删除 start===================== delVisible.value = true;
let delVisible = ref(false); const param = ref<{ [key: string]: any }>({
let delLoading = ref(false); products: [
let deleteNum = ref(0); {
let radioValue = ref(1); goodsNo: val.goodsNo,
let delAreaList = ref<any[]>([ brand: val.brand,
{ spec: val.spec,
id: '0', ghscode: ghsCode,
provinceId: '0', },
province: '北京市', ],
cityId: 0, });
city: '市辖区', delLoading.value = true;
creator: '', const res = await getAreaList(param.value);
creationTime: '', if (res) {
}, delAreaList.value = res;
{ }
id: '1', delLoading.value = false;
provinceId: '1', };
province: '河北省', const delVisibleCancel = () => {
cityId: 1, delVisible.value = false;
city: '保定市', deleteNum.value = 0;
creator: '', radioValue.value = 1;
creationTime: '', delCheckboxValue.value = [];
}, isBatchDel.value = false;
]); //已添加的区域 };
let delCheckboxValue = ref([]); const delConfirLoading = ref(false);
const del = async (val) => { const confirmDel = async () => {
curItem.value = val; if (!delAreaList.value.length) return message.error('暂无可删除区域');
deleteNum.value = 1; if (radioValue.value === 2 && !delCheckboxValue.value.length)
delVisible.value = true; return message.error('请选择需要删除的现货区域');
const param = ref<{ [key: string]: any }>({ const param = ref<{ [key: string]: any }>({
products: [ products: [],
{ areas: '',
goodsNo: val.goodsNo, isAll: false,
brand: val.brand, });
spec: val.spec, if (isBatchDel.value) {
ghscode: ghsCode, param.value.products = selectedRows.value.map((v) => {
}, return {
], goodsNo: v.goodsNo,
}); brand: v.brand,
console.log(param.value); spec: v.spec,
// delLoading.value = true ghscode: ghsCode,
// const result = await getAreaList(param.value) };
// delAreaList.value = result });
// delLoading.value = false } else {
}; param.value.products = [
const delVisibleCancel = () => { {
delVisible.value = false; goodsNo: curItem.value.goodsNo,
deleteNum.value = 0; brand: curItem.value.brand,
radioValue.value = 1; spec: curItem.value.spec,
delCheckboxValue.value = []; ghscode: ghsCode,
isBatchDel.value = false; },
}; ];
let delConfirLoading = ref(false); }
const confirmDel = async () => { if (radioValue.value === 1) {
if (radioValue.value === 2 && !delCheckboxValue.value.length) param.value.isAll = true;
return message.error('请选择需要删除的现货区域'); param.value.areas = delAreaList.value.map((v) => v.cityCode);
const param = ref<{ [key: string]: any }>({ } else if (radioValue.value === 2) {
products: [], param.value.areas = delCheckboxValue.value;
areas: '', }
isAll: false, delConfirLoading.value = true;
}); const res = await regionalSpotManageOpsDeleteProductApi(param.value);
if (isBatchDel.value) { if (res.success) {
param.value.products = selectedRows.value.map((v) => { message.success('删除成功');
return { } else {
goodsNo: v.goodsNo, message.success(res.message);
brand: v.brand, }
spec: v.spec, delConfirLoading.value = false;
ghscode: ghsCode, };
}; // 批量删除
}); const isBatchDel = ref(false);
} else { const batchDel = async () => {
param.value.products = [ if (!selectedRowKeys.value.length) return message.error('请勾选商品');
{ isBatchDel.value = true;
goodsNo: curItem.value.goodsNo, deleteNum.value = selectedRows.value.length;
brand: curItem.value.brand, delVisible.value = true;
spec: curItem.value.spec, const param = ref<{ [key: string]: any }>({
ghscode: ghsCode, products: [],
}, });
]; param.value.products = selectedRows.value.map((v) => {
} return {
if (radioValue.value === 1) { goodsNo: v.goodsNo,
param.value.isAll = true; brand: v.brand,
param.value.areas = delAreaList.value.map((v) => v.id); spec: v.spec,
} else if (radioValue.value === 2) { ghscode: ghsCode,
param.value.areas = delCheckboxValue.value; };
} });
delConfirLoading.value = true; delLoading.value = true;
const res = await regionalSpotManageOpsDeleteProductApi(param.value); const res = await getAreaList(param.value);
if (res.success) { if (res.success) {
message.success('删除成功'); delAreaList.value = res.data;
} else { }
message.success(res.message); delLoading.value = false;
} };
delConfirLoading.value = false; // ================区域现货商品删除 end=====================
};
// 批量删除 const allAreaList = ref<any[]>([]);
let isBatchDel = ref(false); const getAllAreaList = async () => {
const batchDel = () => { const res = await regionalSpotManageGetAreaListApi({});
if (!selectedRowKeys.value.length) return message.error('请勾选商品'); if (res.success) {
isBatchDel.value = true; allAreaList.value = res.data;
deleteNum.value = selectedRows.value.length; areaIdsOption.value = JSON.parse(JSON.stringify(res.data));
delVisible.value = true; } else {
const param = ref<{ [key: string]: any }>({ allAreaList.value = [];
products: [], }
}); };
param.value.products = selectedRows.value.map((v) => { const getGroupOption = async () => {
return { const res = await regionalSpotManageGroupListApi({});
goodsNo: v.goodsNo, if (res.success) {
brand: v.brand, typesOption.value = res.data;
spec: v.spec, } else {
ghscode: ghsCode, typesOption.value = [];
}; }
}); };
// delLoading.value = true // =====================批量导入 start=======================
// const result = await getAreaList(param.value) const productExcelList = ref<any[]>([]);
// delAreaList.value = result const importVisible = ref(false);
// delLoading.value = false const impotrCheckboxValue = ref([]);
}; const batchImport = () => {
// ================区域现货商品删除 end===================== importVisible.value = true;
allAreaList.value.forEach((v) => {
let allAreaList = ref<any[]>([ v.disabled = false;
{ });
id: '0', };
provinceId: '0', const productExcelBeforeUpload = (file, fileList) => {
province: '北京市', const isLt8M = file.size / 1024 / 1024 <= 8;
cityId: 0, const extension = file.name.substring(file.name.lastIndexOf('.') + 1);
city: '市辖区', if (!isLt8M) {
creator: '', message.error('上传文件大小不能超过 8MB!');
creationTime: '', return false;
disabled: true, }
}, if (extension !== 'xls' && extension !== 'xlsx') {
{ message.error('只能上传excel的文件');
id: '1', return false;
provinceId: '1', }
province: '河北省', let curFileList = [...fileList];
cityId: 1, curFileList = curFileList.slice(-1);
city: '保定市', productExcelList.value = curFileList;
creator: '', return false;
creationTime: '', };
}, const productExcelRemove = () => {
{ productExcelList.value = [];
id: '2', };
provinceId: '2', const downLoad = () => {
province: '河北省', window.open(config.VITE_GLOB_API_URL, '_blank');
cityId: 2, };
city: '石家庄市', let importLoading = ref(false);
creator: '', const confirmImport = async () => {
creationTime: '', if (!productExcelList.value.length) return message.error('请上传文件');
}, if (!impotrCheckboxValue.value.length) return message.error('请选择现货区域');
{ const param: FormData = new FormData();
id: '3', param.append('ghsCode', ghsCode);
provinceId: '3', param.append('file', productExcelList.value[0]);
province: '河北省', param.append('areaIds', impotrCheckboxValue.value as any);
cityId: 3, importLoading.value = true;
city: '秦皇岛市', const res = await regionalSpotManageUploadOpsProductApi(param);
creator: '', if (res.success) {
creationTime: '', message.success('批量导入成功');
}, } else {
{ message.error(res.message);
id: '4', }
provinceId: '4', importLoading.value = false;
province: '河北省', };
cityId: 3, const importCancel = () => {
city: '承德市', importVisible.value = false;
creator: '', impotrCheckboxValue.value = [];
creationTime: '', productExcelList.value = [];
}, };
]); // =====================批量导入 end=======================
const getAllAreaList = async () => { const goTaskCenter = () => {
const res = await regionalSpotManageGetAreaListApi({}); router.push({
if (res.success) { path: '/product/taskCenter',
allAreaList.value = res.data; });
} else { };
allAreaList.value = []; </script>
}
}; <template>
<div>
// =====================批量导入 start======================= <div class="body-box">
let productExcelList = ref<any[]>([]); <Form
let importVisible = ref(false); :model="searchForm"
const impotrCheckboxValue = ref([]); :label-col="{ span: 6 }"
const batchImport = () => { :wrapper-col="{ span: 18 }"
importVisible.value = true; class="top-search"
allAreaList.value.forEach((v) => { >
v.disabled = false; <Row :gutter="20">
}); <Col :xxl="4" :xl="6" :lg="8" :sm="12" :xs="24">
}; <FormItem label="品牌名称" name="brandList">
const productExcelBeforeUpload = (file, fileList) => { <!-- <Input v-model:value="searchForm.brands" allow-clear placeholder="请输入品牌名称" /> -->
const isLt8M = file.size / 1024 / 1024 <= 8; <a-select
const extension = file.name.substring(file.name.lastIndexOf('.') + 1); v-model:value="searchForm.brands"
if (!isLt8M) { show-search
message.error('上传文件大小不能超过 8MB!'); mode="multiple"
return false; placeholder="请输入品牌名称"
} style="width: 100%"
if (extension !== 'xls' && extension !== 'xlsx') { :default-active-first-option="false"
message.error('只能上传excel的文件'); :show-arrow="false"
return false; :filter-option="false"
} :not-found-content="null"
let curFileList = [...fileList]; :maxTagCount="1"
curFileList = curFileList.slice(-1); @search="handleSearch"
productExcelList.value = curFileList; >
return false; <a-select-option
}; v-for="item in searchBrandList"
const productExcelRemove = () => { :key="item.brand"
productExcelList.value = []; :label="item.brand"
}; :value="item.brand"
const downLoad = () => { >
window.open(config.VITE_GLOB_API_URL, '_blank'); {{ item.brand }}
}; </a-select-option>
let importLoading = ref(false); </a-select>
const confirmImport = async () => { </FormItem>
if (!productExcelList.value.length) return message.error('请上传文件'); </Col>
if (!impotrCheckboxValue.value.length) return message.error('请选择现货区域'); <Col :xxl="4" :xl="6" :lg="8" :sm="12" :xs="24">
const param: FormData = new FormData(); <FormItem label="货号" name="goodsNo">
param.append('ghsCode', ghsCode); <Input v-model:value="searchForm.goodsNo" allow-clear placeholder="请输入货号" />
param.append('file', productExcelList.value[0]); </FormItem>
param.append('areaIds', impotrCheckboxValue.value.join(',')); </Col>
importLoading.value = true; <Col :xxl="4" :xl="6" :lg="8" :sm="12" :xs="24">
const res = await regionalSpotManageUploadOpsProductApi(param); <FormItem label="现货区域" name="areaIds">
if (res.code === 20000) { <Select
message.success('批量导入成功'); v-model:value="searchForm.areaIds"
} else { allowClear
message.error(res.message); mode="multiple"
} placeholder="请选择现货区域"
importLoading.value = false; :maxTagCount="1"
}; style="width: 100%"
const importCancel = () => { >
importVisible.value = false; <SelectOption
impotrCheckboxValue.value = []; v-for="(item, index) in areaIdsOption"
productExcelList.value = []; :key="index"
}; :value="item.cityId"
// =====================批量导入 end======================= >{{ item.province }}-{{ item.city }}</SelectOption
const goTaskCenter = () => { >
router.push({ </Select>
path: '/taskCenter', </FormItem>
}); </Col>
}; <Col :xxl="4" :xl="6" :lg="8" :sm="12" :xs="24">
</script> <FormItem label="商品分组" name="types">
<Select
<template> v-model:value="searchForm.types"
<div> allowClear
<div class="body-box"> mode="multiple"
<Form placeholder="请选择商品分组"
:model="searchForm" :maxTagCount="1"
:label-col="{ span: 6 }" style="width: 100%"
:wrapper-col="{ span: 18 }" >
class="top-search" <SelectOption v-for="(item, index) in typesOption" :key="index" :value="item">{{
> item
<Row :gutter="20"> }}</SelectOption>
<Col :xxl="4" :xl="6" :lg="8" :sm="12" :xs="24"> </Select>
<FormItem label="品牌名称" name="brandList"> </FormItem>
<!-- <Input v-model:value="searchForm.brandList" allow-clear placeholder="请输入品牌名称" /> --> </Col>
<a-select <Col :span="24" style="display: flex; justify-content: space-between">
v-model:value="searchForm.brandList" <div>
show-search <Button type="primary" style="margin: 0 5px" @click="onSearch">查询</Button>
mode="multiple" <Button style="margin: 0 5px" @click="onRset">重置</Button>
placeholder="请输入品牌名称" <Button type="primary" @click="addProduct" style="margin: 0 5px">新增商品</Button>
style="width: 100%" <Button type="primary" @click="batchImport" style="margin: 0 5px">批量导入</Button>
:default-active-first-option="false" <Button type="primary" @click="batchDel" style="margin: 0 5px">批量删除</Button>
:show-arrow="false" </div>
:filter-option="false" <Button @click="goTaskCenter" style="margin: 0 5px">任务中心日志</Button>
:not-found-content="null" </Col>
@search="handleSearch" </Row>
> </Form>
<a-select-option <a-table
v-for="item in searchBrandList" :data-source="list"
:key="item.value" :loading="listLoading"
:label="item.label" bordered
:value="item.value" :pagination="pagination"
> :rowKey="(record) => record.brand + record.goodsNo + record.spec"
{{ item.label }} :row-selection="{
</a-select-option> selectedRowKeys: selectedRowKeys,
</a-select> onChange: onSelectChange,
</FormItem> columnWidth: 65,
</Col> }"
<Col :xxl="4" :xl="6" :lg="8" :sm="12" :xs="24"> style="margin-top: 15px"
<FormItem label="货号" name="goodsNo"> >
<Input v-model:value="searchForm.goodsNo" allow-clear placeholder="请输入货号" /> <a-table-column title="商品名称" align="center" :width="100">
</FormItem> <template #default="{ record }">
</Col> {{ record.productName }}
<Col :xxl="4" :xl="6" :lg="8" :sm="12" :xs="24"> </template>
<FormItem label="现货区域" name="areaIds"> </a-table-column>
<Select <a-table-column title="品牌" align="center" :width="100">
v-model:value="searchForm.areaIds" <template #default="{ record }">
allowClear {{ record.brand }}
mode="multiple" </template>
placeholder="请选择现货区域" </a-table-column>
style="width: 100%" <a-table-column title="货号" align="center" :width="100">
> <template #default="{ record }">
<SelectOption {{ record.goodsNo }}
v-for="(item, index) in areaIdsOption" </template>
:key="index" </a-table-column>
:value="item.value" <a-table-column title="规格" align="center" :width="100">
>{{ item.label }}</SelectOption <template #default="{ record }">
> {{ record.spec }}
</Select> </template>
</FormItem> </a-table-column>
</Col> <a-table-column title="当前现货区域" align="center" :width="100">
<Col :xxl="4" :xl="6" :lg="8" :sm="12" :xs="24"> <template #default="{ record }">
<FormItem label="商品分组" name="types"> <Button type="link" @click="viewCurrent(record)">查看区域现货</Button>
<Select </template>
v-model:value="searchForm.types" </a-table-column>
allowClear <a-table-column title="上架状态" align="center" :width="100">
mode="multiple" <template #default="{ record }">
placeholder="请选择商品分组" {{ record.productStatus }}
style="width: 100%" </template>
> </a-table-column>
<SelectOption <a-table-column title="操作" align="center" :width="200">
v-for="(item, index) in typesOption" <template #default="{ record }">
:key="index" <Button type="link" @click="addArea(record)">增加区域</Button>
:value="item.value" <Button type="link" style="margin-left: 5px" @click="del(record)">删除</Button>
>{{ item.label }}</SelectOption </template>
> </a-table-column>
</Select> </a-table>
</FormItem> </div>
</Col> <addProductModal v-if="showModal" @close="closeVisible" />
<Col :span="24" style="display: flex; justify-content: space-between"> <a-modal
<div> v-model:visible="visible"
<Button type="primary" style="margin: 0 5px" @click="onSearch">查询</Button> title="商品可提供现货区域查看"
<Button style="margin: 0 5px" @click="onRset">重置</Button> :width="600"
<Button type="primary" @click="addProduct" style="margin: 0 5px">新增商品</Button> @ok="visible = false"
<Button type="primary" @click="batchImport" style="margin: 0 5px">批量导入</Button> :footer="null"
<Button type="primary" @click="batchDel" style="margin: 0 5px">批量删除</Button> :maskClosable="false"
</div> okText="提交"
<Button @click="goTaskCenter" style="margin: 0 5px">任务中心日志</Button> >
</Col> <div>商品名称：{{ curItem.productName }}</div>
</Row> <div>商品品牌：{{ curItem.brand }}</div>
</Form> <div>商品货号：{{ curItem.goodsNo }}</div>
<a-table <div>商品规格：{{ curItem.spec }}</div>
:data-source="list" <a-table
:loading="listLoading" :data-source="regionalSpotGoods"
bordered bordered
:pagination="pagination" :loading="loading1"
:rowKey="(record) => record.sysid" :pagination="false"
:row-selection="{ :rowKey="(record) => record.sysid"
selectedRowKeys: selectedRowKeys, style="margin-top: 15px"
onChange: onSelectChange, >
columnWidth: 65, <a-table-column title="区域" align="center" :width="100">
}" <template #default="{ record }">{{ record.provinceName }}-{{ record.cityName }}</template>
style="margin-top: 15px" </a-table-column>
> <a-table-column title="添加时间" align="center" :width="100">
<a-table-column title="商品名称" align="center" :width="100"> <template #default="{ record }">
<template v-slot="{ record }"> {{ record.createTime }}
{{ record.productName }} </template>
</template> </a-table-column>
</a-table-column> <a-table-column title="添加人" align="center" :width="100">
<a-table-column title="品牌" align="center" :width="100"> <template #default="{ record }">
<template v-slot="{ record }"> {{ record.createName }}
{{ record.brand }} </template>
</template> </a-table-column>
</a-table-column> </a-table>
<a-table-column title="货号" align="center" :width="100"> </a-modal>
<template v-slot="{ record }"> <!-- 删除 -->
{{ record.goodsNo }} <a-modal
</template> v-model:visible="delVisible"
</a-table-column> title="区域现货商品删除"
<a-table-column title="规格" align="center" :width="100"> :width="650"
<template v-slot="{ record }"> :maskClosable="false"
{{ record.spec }} :keyboard="false"
</template> @cancel="delVisibleCancel"
</a-table-column> @ok="confirmDel"
<a-table-column title="当前现货区域" align="center" :width="100"> :confirmLoading="delConfirLoading"
<template v-slot="{ record }"> okText="提交"
<Button type="link" @click="viewCurrent(record)">查看区域现货</Button> >
</template> <p
</a-table-column> >您已选中 <span style="color: #1684fc">{{ deleteNum }}条</span> 商品</p
<a-table-column title="上架状态" align="center" :width="100"> >
<template v-slot="{ record }"> <a-spin v-if="delLoading" style="height: 150px; width: 100%; line-height: 150px" />
{{ record.productStatus }} <p v-else
</template> >选择需要删除的现货区域：
</a-table-column> <a-radio-group v-model:value="radioValue">
<a-table-column title="操作" align="center" :width="200"> <a-radio :value="1">全部区域</a-radio>
<template #default="{ record }"> <a-radio :value="2">部分区域</a-radio>
<Button type="link" @click="addArea(record)">增加区域</Button> </a-radio-group>
<Button type="link" style="margin-left: 5px" @click="del(record)">删除</Button> <a-checkbox-group
</template> v-model:value="delCheckboxValue"
</a-table-column> :disabled="radioValue === 1"
</a-table> style="width: 100%; margin-top: 15px"
</div> >
<addProductModal v-if="showModal" @close="closeVisible" /> <a-row>
<a-modal <a-col :span="6" v-for="(item, index) in delAreaList" :key="index">
v-model:visible="visible" <a-checkbox :value="item.cityCode"
title="商品可提供现货区域查看" >{{ item.provinceName }}-{{ item.cityName }}</a-checkbox
:width="600" >
@ok="visible = false" </a-col>
:footer="null" </a-row>
:maskClosable="false" </a-checkbox-group>
okText="提交" </p>
> </a-modal>
<div style="margin-top: -35px">商品名称：{{ curItem.productName }}</div> <!-- 增加区域 -->
<div>商品品牌：{{ curItem.brand }}</div> <a-modal
<div>商品货号：{{ curItem.goodsNo }}</div> v-model:visible="addVisible"
<div>商品规格：{{ curItem.spec }}</div> title="现货商品增加区域"
<a-table :width="700"
:data-source="regionalSpotGoods" :maskClosable="false"
bordered @cancel="addVisibleCancel"
:loading="loading1" @ok="confirmAddArea"
:pagination="false" okText="提交"
:rowKey="(record) => record.sysid" :confirmLoading="confirmAddLoading"
style="margin-top: 15px" >
> <div>商品名称：{{ curItem.productName }}</div>
<a-table-column title="区域" align="center" :width="100"> <div>商品品牌：{{ curItem.brand }}</div>
<template v-slot="{ record }"> {{ record.provinceName }}-{{ record.cityName }} </template> <div>商品货号：{{ curItem.goodsNo }}</div>
</a-table-column> <div>商品规格：{{ curItem.spec }}</div>
<a-table-column title="添加时间" align="center" :width="100"> <p style="margin-top: 15px">选择可提供现货的区域：</p>
<template v-slot="{ record }"> <a-checkbox-group v-model:value="addCheckboxValue" style="width: 100%">
{{ record.createTime }} <a-row>
</template> <a-col :span="6" v-for="(item, index) in allAreaList" :key="index">
</a-table-column> <a-checkbox :value="item.cityId" :disabled="item.disabled"
<a-table-column title="添加人" align="center" :width="100"> >{{ item.province }}-{{ item.city }}</a-checkbox
<template v-slot="{ record }"> >
{{ record.createName }} </a-col>
</template> </a-row>
</a-table-column> </a-checkbox-group>
</a-table> </a-modal>
</a-modal> <!-- 批量导入 -->
<!-- 删除 --> <a-modal
<a-modal v-model:visible="importVisible"
v-model:visible="delVisible" title="区域现货商品批量导入"
title="区域现货商品删除" :width="700"
:width="650" :maskClosable="false"
:maskClosable="false" okText="提交"
:keyboard="false" @ok="confirmImport"
@cancel="delVisibleCancel" @cancel="importCancel"
@ok="confirmDel" :confirmLoading="importLoading"
:confirmLoading="delConfirLoading" >
okText="提交" <a-alert type="warning">
> <template #message>
<p <span style="color: red">特别提醒：</span
>您已选中 <span style="color: #1684fc">{{ deleteNum }}条</span> 商品</p >若商品之前已设置现货区域，则本次设置为在之前设置基础上新增。例如，原来商品设置为
> 北京市-直辖市；天津市-直辖市。本次设置为，北京市-直辖市；四川省-成都市。提交后，商品现货区域将更新为
<a-spin v-if="delLoading" style="height: 150px; width: 100%; line-height: 150px" /> 北京市-直辖市；天津市-直辖市；四川省-成都市。
<p v-else </template>
>选择需要删除的现货区域： </a-alert>
<a-radio-group v-model:value="radioValue"> <div style="margin-top: 15px; display: flex; align-items: center">
<a-radio :value="1">全部区域</a-radio> <span>上传商品文件：</span>
<a-radio :value="2">部分区域</a-radio> <a-upload
</a-radio-group> accept=".xls,.xlsx"
<a-checkbox-group :file-list="productExcelList"
v-model:value="delCheckboxValue" :before-upload="productExcelBeforeUpload"
:disabled="radioValue === 1" @remove="productExcelRemove"
style="width: 100%; margin-top: 15px" >
> <a-button><upload-outlined />上传文件</a-button>
<a-row> </a-upload>
<a-col :span="6" v-for="(item, index) in delAreaList" :key="index"> <span style="margin-left: 15px">
<a-checkbox :value="item.id">{{ item.province }}-{{ item.city }}</a-checkbox> 下载
</a-col> <a @click="downLoad">区域现货商品上传模板</a>
</a-row> </span>
</a-checkbox-group> </div>
</p> <p style="margin-top: 15px">选择现货区域：</p>
</a-modal> <a-checkbox-group v-model:value="impotrCheckboxValue" style="width: 100%">
<!-- 增加区域 --> <a-row>
<a-modal <a-col :span="6" v-for="(item, index) in allAreaList" :key="index">
v-model:visible="addVisible" <a-checkbox :value="item.cityId" :disabled="item.disabled"
title="现货商品增加区域" >{{ item.province }}-{{ item.city }}</a-checkbox
:width="700" >
:maskClosable="false" </a-col>
@cancel="addVisibleCancel" </a-row>
@ok="confirmAddArea" </a-checkbox-group>
okText="提交" </a-modal>
:confirmLoading="confirmAddLoading" </div>
> </template>
<div style="margin-top: -35px">商品名称：{{ curItem.productName }}</div>
<div>商品品牌：{{ curItem.brand }}</div> <style lang="less" scoped>
<div>商品货号：{{ curItem.goodsNo }}</div> .body-box {
<div>商品规格：{{ curItem.spec }}</div> .top-search {
<p style="margin-top: 15px">选择可提供现货的区域：</p> margin-top: 15px;
<a-checkbox-group v-model:value="addCheckboxValue" style="width: 100%"> }
<a-row> }
<a-col :span="6" v-for="(item, index) in allAreaList" :key="index"> </style>
<a-checkbox :value="item.id" :disabled="item.disabled"
>{{ item.province }}-{{ item.city }}</a-checkbox
>
</a-col>
</a-row>
</a-checkbox-group>
</a-modal>
<!-- 批量导入 -->
<a-modal
v-model:visible="importVisible"
title="区域现货商品批量导入"
:width="700"
:maskClosable="false"
okText="提交"
@ok="confirmImport"
@cancel="importCancel"
:confirmLoading="importLoading"
>
<a-alert type="warning">
<template #message>
<span style="color: red">特别提醒：</span
>若商品之前已设置现货区域，则本次设置为在之前设置基础上新增。例如，原来商品设置为
北京市-直辖市；天津市-直辖市。本次设置为，北京市-直辖市；四川省-成都市。提交后，商品现货区域将更新为
北京市-直辖市；天津市-直辖市；四川省-成都市。
</template>
</a-alert>
<div style="margin-top: 15px; display: flex; align-items: center">
<span>上传商品文件：</span>
<a-upload
accept=".xls,.xlsx"
:file-list="productExcelList"
:before-upload="productExcelBeforeUpload"
@remove="productExcelRemove"
>
<a-button><upload-outlined />上传文件</a-button>
</a-upload>
<span style="margin-left: 15px">
下载
<a @click="downLoad">区域现货商品上传模板</a>
</span>
</div>
<p style="margin-top: 15px">选择现货区域：</p>
<a-checkbox-group v-model:value="impotrCheckboxValue" style="width: 100%">
<a-row>
<a-col :span="6" v-for="(item, index) in allAreaList" :key="index">
<a-checkbox :value="item.id" :disabled="item.disabled"
>{{ item.province }}-{{ item.city }}</a-checkbox
>
</a-col>
</a-row>
</a-checkbox-group>
</a-modal>
</div>
</template>
<style lang="less" scoped>
.body-box {
.top-search {
margin-top: 15px;
}
}
</style>
src/views/regionalSpotManage/components/platformProBatch.vue
View file @ aaa1adfc
<script lang="ts" setup> <script lang="ts" setup>
import { ref, onMounted } from 'vue'; import { ref, onMounted } from 'vue';
import { import {
platformProBatchGetListApi, platformProBatchGetListApi,
platformProBatchGetDetailApi platformProBatchGetDetailApi,
} from '/@/api/regionalSpotManage'; } from '/@/api/regionalSpotManage';
import { message } from 'ant-design-vue'; import { message } from 'ant-design-vue';
onMounted(async () => { onMounted(async () => {
getList() getList();
}); });
let list = ref<any[]>([ let list = ref<any[]>([]);
{ let listLoading = ref(false);
createTime: '2024/12/12 12:22:22', const pagination = ref({
operateModule: '平台商品管理-议价商品', pageSize: 10,
type: '批量导入议价商品', current: 1,
operateNum: 8882, total: 0,
successNum: 8882, showTotal: (total) => `共 ${total} 条`,
failNum: 0, hideOnSinglePage: false,
operateName: '赵欣雨' showQuickJumper: true,
} showSizeChanger: true,
]) pageSizeOptions: ['10', '20', '30', '50', '100'],
let listLoading = ref(false) onChange: (current) => {
const pagination = ref({ pagination.value.current = current;
pageSize: 10, getList();
current: 1, },
total: 0, onShowSizeChange: (size) => {
showTotal: total => `共 ${total} 条`, pagination.value.pageSize = size;
hideOnSinglePage: false, getList();
showQuickJumper: true, },
showSizeChanger: true, });
pageSizeOptions: ['10', '20', '30', '50', '100'], const search = () => {
onChange: (current) => { pagination.value.current = 1;
pagination.value.current = current getList();
getList() };
}, const getList = async () => {
onShowSizeChange: (size) => { const param = ref<{ [key: string]: any }>({
pagination.value.pageSize = size currentPage: pagination.value.current,
getList() pageSize: pagination.value.pageSize,
} });
}) listLoading.value = true;
const search = () => { const res = await platformProBatchGetListApi(param);
pagination.value.current = 1 if (res.success) {
getList() list.value = res.data;
} pagination.value.total = res.data[0].total;
const getList = async () => { } else {
const param = ref<{ [key: string]: any }>({ list.value = [];
currentPage: pagination.value.current, pagination.value.total = 0;
pageSize: pagination.value.pageSize }
}) listLoading.value = false;
listLoading.value = true };
const res = await platformProBatchGetListApi(param) let curItem = ref<{ [key: string]: any }>({});
if (res.code === 20000) { let visible = ref(false);
list.value = res.data let operationList = ref<any[]>([]);
pagination.value.total = res.data[0].total let detailLoading = ref(false);
} else { const viewRecord = (item) => {
list.value = [] curItem.value = item;
pagination.value.total = 0 visible.value = true;
} getDetails(item);
listLoading.value = false };
} const getDetails = async (item) => {
let curItem = ref<{ [key: string]: any }>({}); const param = ref<{ [key: string]: any }>({
let visible = ref(false) sysid: item.sysid,
let operationList = ref<any[]>([]) type: '',
let detailLoading = ref(false) });
const viewRecord = (item) => { detailLoading.value = true;
curItem.value = item const res = await platformProBatchGetDetailApi(param);
visible.value = true if (res.success) {
getDetails(item) operationList.value = res.data;
} } else {
const getDetails = async (item) => { operationList.value = [];
const param = ref<{ [key: string]: any }>({ }
sysid: item.sysid, detailLoading.value = false;
type: '' };
})
detailLoading.value = true // =================导出========================
const res = await platformProBatchGetDetailApi(param) let exportLoading = ref(false);
if (res.code === 20000) { const exportExcel = async () => {
operationList.value = res.data handleDownload([
} else { {
operationList.value = [] brand: '生工',
} category: '',
detailLoading.value = false createTime: '2024-03-29 14:42:35',
} discount: null,
expirationDate: null,
// =================导出======================== failReason: '该商品在商品目录不存在;',
let exportLoading = ref(false) identificationType: '商品议价',
const exportExcel = async () => { itemNo: 'G508013-0001',
handleDownload([ negotiationPrice: 5000,
{ operateSysid: 13877,
"brand": "生工", platforms: ['北京协和医院'],
"category": "", productName: '微孔板迷你离心机，500~3000 rpm',
"createTime": "2024-03-29 14:42:35", spec: '1 /PK',
"discount": null, status: false,
"expirationDate": null, sysid: 83466873,
"failReason": "该商品在商品目录不存在;", total: 32,
"identificationType": "商品议价", type: 2,
"itemNo": "G508013-0001", },
"negotiationPrice": 5000, ]);
"operateSysid": 13877, const param = ref<{ [key: string]: any }>({
"platforms": [ sysid: curItem.value.sysid,
"北京协和医院" type: '',
], });
"productName": "微孔板迷你离心机，500~3000 rpm", exportLoading.value = true;
"spec": "1 /PK", const res = await platformProBatchGetDetailApi(param);
"status": false, if (res.success) {
"sysid": 83466873, handleDownload(res.data);
"total": 32, } else {
"type": 2 message.error('暂无数据');
} }
]) exportLoading.value = false;
const param = ref<{ [key: string]: any }>({ };
sysid: curItem.value.sysid, const handleDownload = (list) => {
type: '' import('/@/vendor/Export2Excel').then((excel) => {
}) let tHeader = [
exportLoading.value = true '商品名称',
const res = await platformProBatchGetDetailApi(param) '品牌',
if (res.code === 20000) { '货号',
handleDownload(res.data) '包装规格',
} else { '平台',
message.error('暂无数据') '状态',
} '失败原因',
exportLoading.value = false '执行时间',
} ];
const handleDownload = (list) => { let filterVal = [
import('/@/vendor/Export2Excel').then(excel => { 'productName',
let tHeader = ['商品名称', '品牌', '货号', '包装规格', '平台', '状态', '失败原因', '执行时间'] 'brand',
let filterVal = ['productName', 'brand', 'itemNo', 'spec', 'platforms', 'status', 'failReason', 'createTime'] 'itemNo',
list.forEach(item => { 'spec',
if(item.status) { 'platforms',
item.status = '成功' 'status',
} else { 'failReason',
item.status = '失败' 'createTime',
} ];
if(item.platforms) { list.forEach((item) => {
item.platforms = item.platforms.join(',') if (item.status) {
} else { item.status = '成功';
item.platforms = '' } else {
} item.status = '失败';
}); }
const data = formatJson(filterVal, list) if (item.platforms) {
excel.export_json_to_excel({ item.platforms = item.platforms.join(',');
header: tHeader as any, } else {
data: data as any, item.platforms = '';
filename: '操作记录详情' as any, }
autoWidth: true as any, });
bookType: 'xlsx' as any, const data = formatJson(filterVal, list);
XlsWidth: null as any, excel.export_json_to_excel({
searchList: [] as any header: tHeader as any,
}) data: data as any,
}) filename: '操作记录详情' as any,
} autoWidth: true as any,
const formatJson = (filterVal, jsonData) => { bookType: 'xlsx' as any,
return jsonData.map(v => filterVal.map(j => { XlsWidth: null as any,
return v[j] searchList: [] as any,
})) });
} });
</script> };
const formatJson = (filterVal, jsonData) => {
<template> return jsonData.map((v) =>
<div> filterVal.map((j) => {
<a-button @click="search" type="primary">刷新数据</a-button> return v[j];
</div> }),
<a-table );
:data-source="list" };
:loading="listLoading" </script>
:pagination="pagination"
bordered <template>
:rowKey="(record) => record.sysid" <div>
style="margin-top: 15px" <a-button @click="search" type="primary">刷新数据</a-button>
> </div>
<a-table-column title="操作时间" align="center" :width="100"> <a-table
<template v-slot="{record}"> :data-source="list"
{{ record.createTime }} :loading="listLoading"
</template> :pagination="pagination"
</a-table-column> bordered
<a-table-column title="功能模块" align="center" :width="100"> :rowKey="(record) => record.sysid"
<template v-slot="{record}"> style="margin-top: 15px"
{{ record.operateModule }} >
</template> <a-table-column title="操作时间" align="center" :width="100">
</a-table-column> <template #default="{ record }">
<a-table-column title="类型" align="center" :width="100"> {{ record.createTime }}
<template v-slot="{record}"> </template>
{{ record.type }} </a-table-column>
</template> <a-table-column title="功能模块" align="center" :width="100">
</a-table-column> <template #default="{ record }">
<a-table-column title="操作数量" align="center" :width="100"> {{ record.operateModule }}
<template v-slot="{record}"> </template>
<a-button v-if="record.operateNum" type="link" @click="viewRecord(record)">{{ record.operateNum }}</a-button> </a-table-column>
<span v-else>/</span> <a-table-column title="类型" align="center" :width="100">
</template> <template #default="{ record }">
</a-table-column> {{ record.type }}
<a-table-column title="解析成功数量" align="center" :width="100"> </template>
<template v-slot="{record}"> </a-table-column>
<span v-if="record.successNum">{{ record.successNum }}</span> <a-table-column title="操作数量" align="center" :width="100">
<span v-else>/</span> <template #default="{ record }">
</template> <a-button v-if="record.operateNum" type="link" @click="viewRecord(record)">{{
</a-table-column> record.operateNum
<a-table-column title="解析失败数量" align="center" :width="100"> }}</a-button>
<template v-slot="{record}"> <span v-else>/</span>
<span v-if="record.failNum">{{ record.failNum }}</span> </template>
<span v-else>/</span> </a-table-column>
</template> <a-table-column title="解析成功数量" align="center" :width="100">
</a-table-column> <template #default="{ record }">
<a-table-column title="操作人" align="center" :width="100"> <span v-if="record.successNum">{{ record.successNum }}</span>
<template v-slot="{record}"> <span v-else>/</span>
{{ record.operateName }} </template>
</template> </a-table-column>
</a-table-column> <a-table-column title="解析失败数量" align="center" :width="100">
</a-table> <template #default="{ record }">
<a-modal v-model:visible="visible" title="操作记录详情" :width="1200" :maskClosable="false" :keyboard="false"> <span v-if="record.failNum">{{ record.failNum }}</span>
<template #footer> <span v-else>/</span>
<a-button type="primary" :loading="exportLoading" @click="exportExcel">导出数据</a-button> </template>
</template> </a-table-column>
<a-table <a-table-column title="操作人" align="center" :width="100">
:data-source="operationList" <template #default="{ record }">
:loading="detailLoading" {{ record.operateName }}
bordered </template>
:rowKey="(record) => record.sysid" </a-table-column>
style="margin-top: -15px" </a-table>
> <a-modal
<a-table-column title="商品名称" align="center" :width="100"> v-model:visible="visible"
<template v-slot="{record}"> title="操作记录详情"
{{ record.productName }} :width="1200"
</template> :maskClosable="false"
</a-table-column> :keyboard="false"
<a-table-column title="品牌" align="center" :width="100"> >
<template v-slot="{record}"> <template #footer>
{{ record.brand }} <a-button type="primary" :loading="exportLoading" @click="exportExcel">导出数据</a-button>
</template> </template>
</a-table-column> <a-table
<a-table-column title="货号" align="center" :width="100"> :data-source="operationList"
<template v-slot="{record}"> :loading="detailLoading"
{{ record.itemNo }} bordered
</template> :rowKey="(record) => record.sysid"
</a-table-column> style="margin-top: -15px"
<a-table-column title="包装规格" align="center" :width="100"> >
<template v-slot="{record}"> <a-table-column title="商品名称" align="center" :width="100">
{{ record.spec }} <template #default="{ record }">
</template> {{ record.productName }}
</a-table-column> </template>
<a-table-column title="平台" align="center" :width="150"> </a-table-column>
<template v-slot="{record}"> <a-table-column title="品牌" align="center" :width="100">
<span v-if="record.platforms && record.platforms.length > 1" :title="record.platforms.join(',')">{{ record.platforms[0] + '...' }}</span> <template #default="{ record }">
<span v-else>{{ record.platforms ? record.platforms[0] : '' }}</span> {{ record.brand }}
</template> </template>
</a-table-column> </a-table-column>
<a-table-column title="状态" align="center" :width="100"> <a-table-column title="货号" align="center" :width="100">
<template v-slot="{record}"> <template #default="{ record }">
{{ record.status ? '成功' : '失败' }} {{ record.itemNo }}
</template> </template>
</a-table-column> </a-table-column>
<a-table-column title="失败原因" :width="150"> <a-table-column title="包装规格" align="center" :width="100">
<template v-slot="{record}"> <template #default="{ record }">
<span class="opinionClass" :title="record.failReason">{{ record.failReason }}</span> {{ record.spec }}
</template> </template>
</a-table-column> </a-table-column>
<a-table-column title="执行时间" align="center" :width="100"> <a-table-column title="平台" align="center" :width="150">
<template v-slot="{record}"> <template #default="{ record }">
{{ record.createTime }} <span
</template> v-if="record.platforms && record.platforms.length > 1"
</a-table-column> :title="record.platforms.join(',')"
</a-table> >{{ record.platforms[0] + '...' }}</span
</a-modal> >
</template> <span v-else>{{ record.platforms ? record.platforms[0] : '' }}</span>
</template>
<style lang="less" scoped> </a-table-column>
.opinionClass { <a-table-column title="状态" align="center" :width="100">
word-break: break-all; <template #default="{ record }">
text-overflow: ellipsis; {{ record.status ? '成功' : '失败' }}
display: -webkit-box; </template>
-webkit-box-orient: vertical; </a-table-column>
-webkit-line-clamp: 2; <a-table-column title="失败原因" :width="150">
overflow: hidden; <template #default="{ record }">
} <span class="opinionClass" :title="record.failReason">{{ record.failReason }}</span>
</style> </template>
</a-table-column>
<a-table-column title="执行时间" align="center" :width="100">
<template #default="{ record }">
{{ record.createTime }}
</template>
</a-table-column>
</a-table>
</a-modal>
</template>
<style lang="less" scoped>
.opinionClass {
word-break: break-all;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
}
</style>
src/views/regionalSpotManage/components/upLoadTask.vue
View file @ aaa1adfc
<script lang="ts" setup> <script lang="ts" setup>
import { ref, onMounted } from 'vue'; import { ref, onMounted } from 'vue';
import { message } from 'ant-design-vue'; import { message } from 'ant-design-vue';
const config = import.meta.env; const config = import.meta.env;
import { import {
taskCenterQueryListApi, taskCenterQueryListApi,
taskCenterRevokeExcelUploadApi, taskCenterRevokeExcelUploadApi,
} from '/@/api/regionalSpotManage'; } from '/@/api/regionalSpotManage';
onMounted(async () => { onMounted(async () => {
getList(); getList();
}); });
let list = ref<any[]>([]); let list = ref<any[]>([]);
let listLoading = ref(false); let listLoading = ref(false);
const downLoad = (url) => { const downLoad = (url) => {
window.open(config.VITE_GLOB_API_URL + '/system/excelFile/' + url, '_blank'); window.open(config.VITE_GLOB_API_URL + '/system/excelFile/' + url, '_blank');
}; };
const downloadFail = (record) => { const downloadFail = (record) => {
if (record.failNum === 0) return; if (record.failNum === 0) return;
let href = let href =
config.VITE_GLOB_API_URL + config.VITE_GLOB_API_URL +
'/excel/excelNew/fail/download?sysid=' + '/excel/excelNew/fail/download?sysid=' +
record.sysid + record.sysid +
'&type=' + '&type=' +
record.type.slice(2, 6); record.type.slice(2, 6);
window.open(href, 'blank'); window.open(href, 'blank');
}; };
const cancel = async (record) => { const cancel = async (record) => {
const param = ref<{ [key: string]: any }>({ const param = ref<{ [key: string]: any }>({
sysid: record.sysid, sysid: record.sysid,
}); });
const res = await taskCenterRevokeExcelUploadApi(param.value); const res = await taskCenterRevokeExcelUploadApi(param.value);
if (res.code === 20000) { if (res.success) {
message.success('操作成功'); message.success('操作成功');
getList(); getList();
} else { } else {
message.error(res.message); message.error(res.message);
} }
}; };
const getList = async () => { const getList = async () => {
listLoading.value = true; listLoading.value = true;
const res = await taskCenterQueryListApi({ type: 0 }); const res = await taskCenterQueryListApi({ type: 0 });
if (res.code === 20000) { if (res.success) {
list.value = res.data; list.value = res.data;
} else { } else {
list.value = []; list.value = [];
} }
listLoading.value = false; listLoading.value = false;
}; };
</script> </script>
<template> <template>
<div> <div>
<a-button @click="getList" type="primary">刷新数据</a-button> <a-button @click="getList" type="primary">刷新数据</a-button>
</div> </div>
<a-table <a-table
:data-source="list" :data-source="list"
:loading="listLoading" :loading="listLoading"
bordered bordered
:rowKey="(record) => record.sysid" :rowKey="(record) => record.sysid"
style="margin-top: 15px" style="margin-top: 15px"
> >
<a-table-column title="操作时间" align="center" :width="100"> <a-table-column title="操作时间" align="center" :width="100">
<template #default="{ record }"> <template #default="{ record }">
{{ record.createTime }} {{ record.createTime }}
</template> </template>
</a-table-column> </a-table-column>
<a-table-column title="类型" align="center" :width="100"> <a-table-column title="类型" align="center" :width="100">
<template #default="{ record }"> <template #default="{ record }">
{{ record.type }} {{ record.type }}
</template> </template>
</a-table-column> </a-table-column>
<a-table-column title="状态" align="center" :width="100"> <a-table-column title="状态" align="center" :width="100">
<template #default="{ record }"> <template #default="{ record }">
<p>{{ <p>{{
record.isRevoke record.isRevoke
? '已撤销' ? '已撤销'
: record.status == 0 : record.status == 0
? '待进行' ? '待进行'
: record.status == 1 : record.status == 1
? '进行中' ? '进行中'
: '已完成' : '已完成'
}}</p> }}</p>
</template> </template>
</a-table-column> </a-table-column>
<a-table-column title="操作数据" align="center" :width="100"> <a-table-column title="操作数据" align="center" :width="100">
<template #default="{ record }"> <template #default="{ record }">
{{ record.sproductNumpec }} {{ record.sproductNumpec }}
</template> </template>
</a-table-column> </a-table-column>
<a-table-column title="成功数据" align="center" :width="100"> <a-table-column title="成功数据" align="center" :width="100">
<template #default="{ record }"> <template #default="{ record }">
{{ record.successNum }} {{ record.successNum }}
</template> </template>
</a-table-column> </a-table-column>
<a-table-column title="错误数据" align="center" :width="100"> <a-table-column title="错误数据" align="center" :width="100">
<template #default="{ record }"> <template #default="{ record }">
{{ record.failNum }} {{ record.failNum }}
</template> </template>
</a-table-column> </a-table-column>
<a-table-column title="操作人" align="center" :width="100"> <a-table-column title="操作人" align="center" :width="100">
<template #default="{ record }"> <template #default="{ record }">
{{ record.createName }} {{ record.createName }}
</template> </template>
</a-table-column> </a-table-column>
<a-table-column title="操作" align="center" :width="200"> <a-table-column title="操作" align="center" :width="200">
<template #default="{ record }"> <template #default="{ record }">
<Button type="link" @click="downLoad(record.fileUrl)">下载源文件</Button> <Button type="link" @click="downLoad(record.fileUrl)">下载源文件</Button>
<Button type="link" v-if="record.failNum" @click="downloadFail(record)" <Button type="link" v-if="record.failNum" @click="downloadFail(record)"
>下载错误数据</Button >下载错误数据</Button
> >
<Button type="link" v-if="record.status == 0 && !record.isRevoke" @click="cancel(record)" <Button type="link" v-if="record.status == 0 && !record.isRevoke" @click="cancel(record)"
>撤销</Button >撤销</Button
> >
</template> </template>
</a-table-column> </a-table-column>
</a-table> </a-table>
</template> </template>
<style lang="less" scoped></style> <style lang="less" scoped></style>
src/views/regionalSpotManage/index.vue
View file @ aaa1adfc
<script lang="ts" setup> <script lang="ts" setup>
import ManageList from './components/list.vue'; import { ref, onMounted } from 'vue';
</script> import { regionalSpotManageGetStatusApi } from '/@/api/regionalSpotManage';
import ManageList from './components/list.vue';
<template> const show = ref(false);
<ManageList /> const loading = ref(false);
</template> onMounted(async () => {
loading.value = true;
<style lang="less" scoped> const res = await regionalSpotManageGetStatusApi().catch(() => (loading.value = false));
if (res.success) {
</style> show.value = true;
}
loading.value = false;
});
</script>
<template>
<div>
<ManageList />
<!-- <a-spin v-if="loading" style="height: 150px; width: 100%; line-height: 150px" />
<ManageList v-if="show && !loading" />
<div v-if="!show && !loading" class="status">
<img src="../../assets/images/logo.png" alt="" srcset="" />
</div> -->
</div>
</template>
<style lang="less" scoped>
.status {
height: 100vh;
img {
width: 100%;
height: 100vh;
object-fit: contain;
}
}
</style>
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