This commit is contained in:
parent
802e75fa7b
commit
fd02219251
@ -1,6 +1,7 @@
|
||||
export const WEBSITES = {
|
||||
UNKNOWN: 0,
|
||||
COACHOUTLET: 1,
|
||||
US_COACH_OUTLET: 1,
|
||||
CN_COACH: 2
|
||||
}
|
||||
|
||||
export const WEBSITE_OPTIONS = [
|
||||
@ -9,7 +10,11 @@ export const WEBSITE_OPTIONS = [
|
||||
value: WEBSITES.UNKNOWN
|
||||
},
|
||||
{
|
||||
label: 'coachoutlet',
|
||||
value: WEBSITES.COACHOUTLET
|
||||
label: '美国coach outlet',
|
||||
value: WEBSITES.US_COACH_OUTLET
|
||||
},
|
||||
{
|
||||
label: '中国coach',
|
||||
value: WEBSITES.CN_COACH
|
||||
}
|
||||
]
|
||||
@ -11,9 +11,14 @@ const routes = [
|
||||
component: ()=>import('@/views/Watcher/index.vue')
|
||||
},
|
||||
{
|
||||
path: '/product',
|
||||
name: 'product',
|
||||
component: ()=>import('@/views/Product/index.vue')
|
||||
path: '/us-coach',
|
||||
name: 'us-coach',
|
||||
component: ()=>import('@/views/Product/US.vue')
|
||||
},
|
||||
{
|
||||
path: '/cn-coach',
|
||||
name: 'cn-coach',
|
||||
component: ()=>import('@/views/Product/CN.vue')
|
||||
},
|
||||
{
|
||||
path: '/pusher',
|
||||
|
||||
304
src/views/Product/CN.vue
Normal file
304
src/views/Product/CN.vue
Normal file
@ -0,0 +1,304 @@
|
||||
<template>
|
||||
<div class="h-full m-4 bg-white rounded-2 shadow-lg p-8 flex flex-col justify-between space-y-4 overscroll-auto">
|
||||
<div class="flex justify-between">
|
||||
<div class="flex items-center space-x-16">
|
||||
</div>
|
||||
<div class="flex space-x-4">
|
||||
<a-input placeholder="请输入关键词" v-model:value="query.keyword" @pressEnter="search"></a-input>
|
||||
<a-button type="primary" :disabled="loading" @click="search">搜索</a-button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="h-full border-0 border-t-1 border-solid border-gray-300 pt-4 overscroll-auto ">
|
||||
<a-spin :spinning="loading" :indicator="indicator">
|
||||
<a-table :dataSource="data.list" :columns="columns" :custom-row="customRow" :pagination="false" @change="tableChange" rowKey="pid" @expand="expand">
|
||||
<template #bodyCell="{ column, record }">
|
||||
<template v-if="column.key === 'name'">
|
||||
<a v-if="record.name !== '' " :href="record.link" target="_blank">{{record.name}}</a>
|
||||
<span v-else>正在抓取信息</span>
|
||||
</template>
|
||||
<template v-else-if="column.key === 'updatedAt'">
|
||||
<span>{{moment(record.updatedAt).format('YYYY-MM-DD HH:mm:ss')}}</span>
|
||||
</template>
|
||||
<template v-else-if="column.key === 'cnyPrice'">
|
||||
<div class="flex space items-center">
|
||||
<span>{{record.cnyPrice}}</span>
|
||||
<CaretUpOutlined class="text-red" v-if="record.priceStatus === PRICE_STATUS.UP"/>
|
||||
<CaretDownOutlined class="text-green" v-if="record.priceStatus === PRICE_STATUS.DOWN"/>
|
||||
</div>
|
||||
</template>
|
||||
<template v-else-if="column.key === 'dwPrice'">
|
||||
<div class="flex space-x-4">
|
||||
<a-input-number @click.stop v-if="editData.edit && editData.param==='dwPrice' && editData.data.pid === record.pid" v-model:value="editData.data.dwPrice" @pressEnter="doUpdate"></a-input-number>
|
||||
<span v-else @dblclick="onEdit(record, 'dwPrice')">{{record.dwPrice}}</span>
|
||||
<SaveOutlined class="cursor-pointer" v-if="editData.edit && editData.param==='dwPrice' && editData.data.pid === record.pid" v-model:value="editData.data.dwPrice" @click="doUpdate"/>
|
||||
<!-- <FormOutlined v-else class="cursor-pointer" @click="onEdit(record, 'dwPrice')"/>-->
|
||||
</div>
|
||||
</template>
|
||||
<template v-else-if="column.key === 'rate'">
|
||||
{{record.rate.toFixed(2)}}%
|
||||
</template>
|
||||
<template v-else-if="column.key === 'image'">
|
||||
<a-image
|
||||
:width="100"
|
||||
:src="record.image"
|
||||
/>
|
||||
</template>
|
||||
<template v-else-if="column.key === 'cnyPrice'">
|
||||
<a-popover >
|
||||
<template #content>
|
||||
<div class="whitespace-pre">{{record.calMark}}</div>
|
||||
</template>
|
||||
<span class="cursor-pointer">{{parseFloat(record.cnyPrice).toFixed(2)}}</span>
|
||||
</a-popover>
|
||||
</template>
|
||||
<template v-else-if="column.key === 'orderable'">
|
||||
<span :class="[record.orderable ? '':'text-red']">{{record.orderable?'是':'否'}}</span>
|
||||
</template>
|
||||
<template v-else-if="column.key === 'remark'">
|
||||
<div class="flex space-x-4">
|
||||
<a-input @click.stop v-if="editData.edit && editData.param==='remark' && editData.data.pid === record.pid" v-model:value="editData.data.remark" @pressEnter="doUpdate"></a-input>
|
||||
<span v-else @dblclick="onEdit(record, 'remark')">{{record.remark || '----'}}</span>
|
||||
<SaveOutlined class="cursor-pointer" v-if="editData.edit && editData.param==='remark' && editData.data.pid === record.pid" v-model:value="editData.data.remark" @click="doUpdate"/>
|
||||
<!-- <FormOutlined v-else class="cursor-pointer" @click="onEdit(record, 'dwPrice')"/>-->
|
||||
</div>
|
||||
</template>
|
||||
<template v-else-if="column.key === 'link'">
|
||||
<a :href="`https://www.coach.com.cn/products/${record.pid}`" target="_blank">跳转</a>
|
||||
</template>
|
||||
</template>
|
||||
|
||||
<template #expandedRowRender="{ record }">
|
||||
<a-spin :spinning="!record.historyPrices">
|
||||
<div class="px-4">
|
||||
<div class="text-xl">历史价格</div>
|
||||
<div class="flex space-x-16 my-2 text-lg" v-for="h in record.historyPrices">
|
||||
<div>{{moment(h.createdAt).format('YYYY-MM-DD HH:mm:ss')}}</div>
|
||||
<div>￥{{h.usPrice}}</div>
|
||||
</div>
|
||||
<div class="text-xl mt-4">得物价格（CNY）</div>
|
||||
<div v-if="record.dwHistoryPrices?.length>0" class="flex space-x-16 my-2 text-lg" v-for="h in record.dwHistoryPrices">
|
||||
<div>{{moment(h.createdAt).format('YYYY-MM-DD HH:mm:ss')}}</div>
|
||||
<div>￥{{h.dwPrice}}</div>
|
||||
</div>
|
||||
<div class="text-lg" v-else >暂无</div>
|
||||
</div>
|
||||
</a-spin>
|
||||
</template>
|
||||
</a-table>
|
||||
</a-spin>
|
||||
</div>
|
||||
<a-pagination :disabled="loading" class="text-right" v-model:current="query.page" v-model:page-size="query.size" :total="data.total" show-less-items @change="list"/>
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
|
||||
import {computed, h, onMounted, reactive, ref} from "vue";
|
||||
import {GetProduct, ListProducts, UpdateProduct} from "@/api/product.js";
|
||||
import moment from "moment/moment.js";
|
||||
import { clone } from 'radash'
|
||||
import {LoadingOutlined, SaveOutlined,CaretUpOutlined,CaretDownOutlined} from "@ant-design/icons-vue";
|
||||
import {message} from "ant-design-vue";
|
||||
import {WEBSITES} from "@/constants/website.js";
|
||||
|
||||
onMounted(()=>{
|
||||
list()
|
||||
})
|
||||
|
||||
const query = reactive({
|
||||
page: 1,
|
||||
size:6,
|
||||
rate_sort: null,
|
||||
disc_sort: null,
|
||||
orderable: null,
|
||||
keyword: '',
|
||||
website: WEBSITES.CN_COACH
|
||||
})
|
||||
|
||||
|
||||
const loading = ref(false)
|
||||
|
||||
const data = ref({
|
||||
total: 0,
|
||||
list:[]
|
||||
})
|
||||
|
||||
const list = ()=>{
|
||||
loading.value = true
|
||||
ListProducts(query).then(res=>{
|
||||
data.value = res
|
||||
}).catch(err => {
|
||||
console.log(err)
|
||||
}).finally(()=>{
|
||||
loading.value = false
|
||||
})
|
||||
}
|
||||
|
||||
const search = ()=>{
|
||||
query.page = 1
|
||||
list()
|
||||
}
|
||||
|
||||
const columns = computed(()=>[
|
||||
{
|
||||
title: '名称',
|
||||
dataIndex: 'name',
|
||||
key: 'name',
|
||||
width:300,
|
||||
},
|
||||
{
|
||||
title: '货号',
|
||||
dataIndex: 'pid',
|
||||
key: 'pid',
|
||||
},
|
||||
{
|
||||
title: '图片',
|
||||
dataIndex: 'image',
|
||||
key: 'image',
|
||||
},
|
||||
{
|
||||
title: '成本(CNY)',
|
||||
dataIndex: 'cnyPrice',
|
||||
key: 'cnyPrice',
|
||||
},
|
||||
{
|
||||
title: '折扣力度',
|
||||
dataIndex: 'discPercent',
|
||||
key: 'discPercent',
|
||||
sorter:true,
|
||||
sortOrder: query.disc_sort
|
||||
},
|
||||
|
||||
{
|
||||
title: '得物(CNY)',
|
||||
dataIndex: 'dwPrice',
|
||||
key: 'dwPrice',
|
||||
},
|
||||
{
|
||||
title: '收益率',
|
||||
dataIndex: 'rate',
|
||||
key: 'rate',
|
||||
sorter:true,
|
||||
sortOrder: query.rate_sort
|
||||
},
|
||||
{
|
||||
title: '可购买',
|
||||
dataIndex: 'orderable',
|
||||
key: 'orderable',
|
||||
filteredValue: query.orderable,
|
||||
filterMultiple:false,
|
||||
filters:[
|
||||
{
|
||||
text: '可购买',
|
||||
value: 'true',
|
||||
},
|
||||
{
|
||||
text: '不可购买',
|
||||
value: 'false',
|
||||
},
|
||||
]
|
||||
},
|
||||
{
|
||||
title: '抓取时间',
|
||||
dataIndex: 'updatedAt',
|
||||
key: 'updatedAt',
|
||||
},
|
||||
{
|
||||
title: '备注',
|
||||
dataIndex: 'remark',
|
||||
key: 'remark',
|
||||
},
|
||||
{
|
||||
title: 'coach链接',
|
||||
dataIndex: 'link',
|
||||
key: 'link',
|
||||
},
|
||||
])
|
||||
|
||||
const indicator = h(LoadingOutlined, {
|
||||
style: {
|
||||
fontSize: '32px',
|
||||
},
|
||||
spin: true,
|
||||
});
|
||||
|
||||
const editData = reactive({
|
||||
param: 'dwPrice',
|
||||
data: {
|
||||
},
|
||||
edit: false,
|
||||
editModal: false
|
||||
})
|
||||
|
||||
const onEdit=(record, param) => {
|
||||
editData.data = clone(record)
|
||||
editData.param = param
|
||||
editData.edit = true
|
||||
if(param === 'modal'){
|
||||
editData.editModal = true
|
||||
}
|
||||
}
|
||||
|
||||
const doUpdate=()=>{
|
||||
if(!editData.data.pid){
|
||||
message.error('缺少pid')
|
||||
}
|
||||
loading.value = true
|
||||
UpdateProduct(editData.data).then(res=>{
|
||||
message.success('更新成功')
|
||||
}).catch(err=>{
|
||||
message.error('更新失败')
|
||||
console.log(err)
|
||||
}).finally(()=>{
|
||||
list()
|
||||
editData.edit = false
|
||||
loading.value = false
|
||||
editData.editModal = false
|
||||
})
|
||||
}
|
||||
|
||||
const tableChange = (pagination, filters, sorter, { action, currentDataSource })=>{
|
||||
if(sorter.columnKey === 'rate') {
|
||||
query.rate_sort = sorter.order
|
||||
}else if (sorter.columnKey === 'discPercent'){
|
||||
query.disc_sort = sorter.order
|
||||
}
|
||||
query.orderable = filters.orderable
|
||||
|
||||
list()
|
||||
}
|
||||
|
||||
|
||||
const PRICE_STATUS = {
|
||||
NO_CHANGE: 0,
|
||||
UP: 1,
|
||||
DOWN: 2
|
||||
}
|
||||
|
||||
|
||||
const customRow=(record, index)=>{
|
||||
return {
|
||||
onClick: (event) => {
|
||||
editData.edit = false
|
||||
}, // 点击行
|
||||
}
|
||||
}
|
||||
|
||||
const expand = (expanded, record)=>{
|
||||
if(expanded && !record.historyPrices){
|
||||
GetProduct(record.pid).then(res=>{
|
||||
record.historyPrices = res.historyPrices
|
||||
record.dwHistoryPrices = res.dwHistoryPrices
|
||||
}).catch(err=>{
|
||||
message.error("获取历史价格失败")
|
||||
console.log(err)
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
@ -149,6 +149,7 @@ import {LoadingOutlined, SaveOutlined,SettingOutlined,CaretUpOutlined,CaretDownO
|
||||
import {message, Modal} from "ant-design-vue";
|
||||
import {CreateWatcher} from "@/api/watcher.js";
|
||||
import {GetSpiderCfg, SetSpiderCfg} from "@/api/spider.js";
|
||||
import {WEBSITES} from "@/constants/website.js";
|
||||
|
||||
onMounted(()=>{
|
||||
list()
|
||||
@ -162,6 +163,7 @@ const query = reactive({
|
||||
disc_sort: null,
|
||||
orderable: null,
|
||||
keyword: '',
|
||||
website: WEBSITES.US_COACH_OUTLET
|
||||
})
|
||||
|
||||
|
||||
@ -12,6 +12,14 @@ import {AccountBookOutlined, BellOutlined, DollarCircleOutlined} from "@ant-desi
|
||||
import {h} from "vue";
|
||||
import {useRouter} from "vue-router";
|
||||
|
||||
const router = useRouter()
|
||||
|
||||
const onclick = ({key}) => {
|
||||
router.push({
|
||||
name: key
|
||||
})
|
||||
}
|
||||
|
||||
const items = [
|
||||
{
|
||||
key: 'watcher',
|
||||
@ -24,6 +32,19 @@ const items = [
|
||||
icon: () => h(DollarCircleOutlined),
|
||||
label: '商品',
|
||||
title: '商品',
|
||||
onTitleClick: onclick,
|
||||
children: [
|
||||
{
|
||||
key: 'us-coach',
|
||||
label: '美国coach outlet',
|
||||
title: '美国coach outlet',
|
||||
},
|
||||
{
|
||||
key: 'cn-coach',
|
||||
label: '中国coach',
|
||||
title: '中国coach',
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
key: 'pusher',
|
||||
@ -33,13 +54,7 @@ const items = [
|
||||
},
|
||||
]
|
||||
|
||||
const router = useRouter()
|
||||
|
||||
const onclick = ({key}) => {
|
||||
router.push({
|
||||
name: key
|
||||
})
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
|
||||
Loading…
Reference in New Issue
Block a user