feat 添加价格涨跌

package.json

@@ -13,6 +13,7 @@
     "ant-design-vue": "4.x",
     "mande": "^2.0.8",
     "moment": "^2.30.1",
+    "radash": "^12.1.0",
     "vue": "^3.4.21",
     "vue-router": "4"
   },

src/api/product.js

@@ -4,4 +4,8 @@ const product = mande('/api/v1/products')
 
 export const ListProducts = (query) => {
     return product.get({query:query})
+}
+
+export const UpdateProduct=(p)=>{
+    return product.post(p)
 }

src/views/Product/index.vue

@@ -8,7 +8,7 @@
     </div>
     <div class="h-full border-0 border-t-1 border-solid border-gray-300 pt-4">
       <a-spin :spinning="loading" :indicator="indicator">
-        <a-table :dataSource="data.list" :columns="columns" :pagination="false">
+        <a-table :dataSource="data.list" :columns="columns" :pagination="false" @change="tableChange">
           <template #bodyCell="{ column, record }">
             <template v-if="column.key === 'name'">
               <a v-if="record.name !== '' " :href="record.link" target="_blank">{{record.name}}</a>
@@ -17,6 +17,29 @@
             <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 === 'usPrice'">
+              <div class="flex space items-center">
+                <span>{{record.usPrice}}</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 === 'freight'">
+              <div class="flex space-x-4">
+                <a-input-number v-if="editData.edit && editData.param==='freight' && editData.data.pid === record.pid" v-model:value="editData.data.freight" @pressEnter="doUpdate"></a-input-number>
+                <span v-else @dblclick="onEdit(record, 'freight')">{{record.freight}}</span>
+                <SaveOutlined class="cursor-pointer" v-if="editData.edit && editData.param==='freight' && editData.data.pid === record.pid" v-model:value="editData.data.freight" @click="doUpdate"/>
+<!--                <FormOutlined v-else class="cursor-pointer" @click="onEdit(record, 'freight')"/>-->
+              </div>
+            </template>
+            <template v-else-if="column.key === 'dwPrice'">
+              <div class="flex space-x-4">
+                <a-input-number 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 === 'image'">
               <a-image
                   :width="100"
@@ -31,26 +54,65 @@
                 <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 === 'opt'">
+              <a-popover title="" placement="bottom">
+                <template #content>
+                  <a-button type="text" block @click="onEdit(record, 'modal')">编辑</a-button>
+                  <a-button type="text" block @click="onWatch(record.pid, record.name)">一键蹲货</a-button>
+
+                </template>
+                <SettingOutlined class="cursor-pointer" />
+              </a-popover>
+            </template>
           </template>
         </a-table>
       </a-spin>
     </div>
     <a-pagination :disabled="loading" class="text-right" v-model:current="query.page" :total="data.total" show-less-items @change="list"/>
   </div>
+  <a-modal v-model:open="editData.editModal" @ok="doUpdate">
+    <template #title>
+      编辑
+    </template>
+    <a-form :model="editData.data" :labelCol="{span: 6}">
+      <a-form-item label="价格(美元)">
+        <a-input-number disabled v-model:value="editData.data.usPrice"/>
+      </a-form-item>
+      <a-form-item label="成本">
+        <a-input-number disabled v-model:value="editData.data.cnyPrice"/>
+      </a-form-item>
+      <a-form-item label="运费">
+        <a-input-number v-model:value="editData.data.freight"/>
+      </a-form-item>
+      <a-form-item label="得物价格">
+        <a-input-number v-model:value="editData.data.dwPrice"/>
+      </a-form-item>
+      <a-form-item label="备注">
+        <a-textarea v-model:value="editData.data.remark"/>
+      </a-form-item>
+    </a-form>
+  </a-modal>
 </template>
 <script setup>
 
-import {h, onMounted, reactive, ref} from "vue";
+import {computed, h, onMounted, reactive, ref} from "vue";
-import {ListProducts} from "@/api/product.js";
+import {ListProducts, UpdateProduct} from "@/api/product.js";
 import moment from "moment/moment.js";
-import {LoadingOutlined} from "@ant-design/icons-vue";
+import { clone } from 'radash'
+import {LoadingOutlined, SaveOutlined,SettingOutlined,CaretUpOutlined,CaretDownOutlined} from "@ant-design/icons-vue";
+import {message, Modal} from "ant-design-vue";
+import {CreateWatcher} from "@/api/watcher.js";
 
 onMounted(()=>{
   list()
 })
 const query = reactive({
   page: 1,
-  size:6
+  size:6,
+  rate_sort: null
 })
 
 const loading = ref(false)
@@ -71,7 +133,7 @@ const list = ()=>{
   })
 }
 
-const columns = [
+const columns = computed(()=>[
   {
     title: '名称',
     dataIndex: 'name',
@@ -98,6 +160,11 @@ const columns = [
     dataIndex: 'cnyPrice',
     key: 'cnyPrice',
   },
+  {
+    title: '运费(CNY)',
+    dataIndex: 'freight',
+    key: 'freight',
+  },
   {
     title: '得物(CNY)',
     dataIndex: 'dwPrice',
@@ -107,6 +174,13 @@ const columns = [
     title: '收益率',
     dataIndex: 'rate',
     key: 'rate',
+    sorter:true,
+    sortOrder: query.rate_sort
+  },
+  {
+    title: '可购买',
+    dataIndex: 'orderable',
+    key: 'orderable',
   },
   {
     title: '抓取时间',
@@ -118,11 +192,11 @@ const columns = [
     dataIndex: 'remark',
     key: 'remark',
   },
-  // {
+  {
-  //   title: '操作',
+    title: '操作',
-  //   key: 'opt',
+    key: 'opt',
-  // },
+  },
-]
+])
 
 const indicator = h(LoadingOutlined, {
   style: {
@@ -131,6 +205,77 @@ const indicator = h(LoadingOutlined, {
   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
+  }
+  list()
+}
+
+//一键蹲货
+const onWatch = (pid, name)=>{
+  Modal.confirm({
+    title: '确定要蹲该商品',
+    content: name,
+    okText: '确定',
+    cancelText: '取消',
+    onOk() {
+      CreateWatcher({
+        pid: pid,
+        remark:'',
+        pusherIds:[1]
+      }).then(res=>{
+        message.success("添加成功")
+      }).catch(err => {
+        message.error("添加失败")
+        console.log(err)
+      }).finally(()=>{
+        list()
+      })
+    },
+  });
+}
+
+const PRICE_STATUS = {
+  NO_CHANGE: 0,
+  UP: 1,
+  DOWN: 2
+}
 </script>
 
 

src/views/layout/Header.vue

@@ -1,5 +1,5 @@
 <template>
-<div class="h-[100px] shadow-lg flex items-center justify-between px-12  z-10">
+<div class="h-[100px] shadow-lg flex items-center justify-between px-12 py-4 z-10">
   <div class="flex space-x-4 items-center">
     <img class="h-[60px]" src="@/assets/logo.png" alt="">
     <div class="text-[24px] font-bold">

vite.config.js

@@ -22,6 +22,13 @@ export default defineConfig({
   server:{
     open: true,
     proxy: {
+      '/api/v1/products': {
+        // target: 'https://ht.timerzz.com:20443/',
+        target: 'http://192.168.31.163:31828/',
+        changeOrigin: true,
+        secure: false,
+        ws: true,
+      },
       '/api/v1': {
         target: 'https://ht.timerzz.com:20443/',
         // target: 'http://192.168.31.55:2280/',