1
This commit is contained in:
van
5
.gitignore
vendored
Normal file
5
.gitignore
vendored
Normal file
@@ -0,0 +1,5 @@
|
|||||||
|
.DS_Store
|
||||||
|
Thumbs.db
|
||||||
|
*.log
|
||||||
|
.idea/
|
||||||
|
.vscode/
|
||||||
87
README.md
Normal file
87
README.md
Normal file
@@ -0,0 +1,87 @@
|
|||||||
|
# open-jd-web
|
||||||
|
|
||||||
|
京东跟团查询独立静态站点，部署在 `jd.van333.cn` 等专用域名。
|
||||||
|
|
||||||
|
不依赖 ruoyi-vue 整站打包，单 HTML + CDN，仅通过 API 连接 Jarvis 后端。
|
||||||
|
|
||||||
|
## 功能
|
||||||
|
|
||||||
|
- 订单跟团查询页
|
||||||
|
- 接口：`GET /jarvis-api/open/jd/queryTkOrder?orderId=xxx&t=xxx`
|
||||||
|
- URL 参数 `t`：推广标识（可选，仅保留在链接中）
|
||||||
|
|
||||||
|
## 目录
|
||||||
|
|
||||||
|
```
|
||||||
|
open-jd-web/
|
||||||
|
index.html # 主页面
|
||||||
|
config.js # API 前缀配置
|
||||||
|
config.example.js # 配置示例
|
||||||
|
nginx.conf.example # Nginx 参考配置
|
||||||
|
README.md
|
||||||
|
```
|
||||||
|
|
||||||
|
## 本地预览
|
||||||
|
|
||||||
|
直接用浏览器打开 `index.html` 无法调接口（跨域）。本地调试可：
|
||||||
|
|
||||||
|
```bash
|
||||||
|
# Python 简易静态服务
|
||||||
|
python -m http.server 8080
|
||||||
|
```
|
||||||
|
|
||||||
|
同时需要 Nginx 或 dev 代理把 `/jarvis-api` 转到后端。
|
||||||
|
|
||||||
|
## 部署到新服务器（jd.van333.cn）
|
||||||
|
|
||||||
|
### 1. 上传文件
|
||||||
|
|
||||||
|
将整个目录内容上传到服务器，例如：
|
||||||
|
|
||||||
|
```
|
||||||
|
/www/sites/jd.van333.cn/index/
|
||||||
|
index.html
|
||||||
|
config.js
|
||||||
|
```
|
||||||
|
|
||||||
|
### 2. Nginx
|
||||||
|
|
||||||
|
参考 `nginx.conf.example`：
|
||||||
|
|
||||||
|
- 静态文件走本地 `root`
|
||||||
|
- `/jarvis-api/open/jd/` 反代到 `https://jarvis.van333.cn`
|
||||||
|
|
||||||
|
### 3. 访问地址
|
||||||
|
|
||||||
|
```
|
||||||
|
https://jd.van333.cn/?t=TBA224A9B6F
|
||||||
|
https://jd.van333.cn/open/jd/promoter?t=TBA224A9B6F
|
||||||
|
```
|
||||||
|
|
||||||
|
## 配置
|
||||||
|
|
||||||
|
编辑 `config.js`：
|
||||||
|
|
||||||
|
```js
|
||||||
|
window.OPEN_JD_CONFIG = {
|
||||||
|
apiBase: '/jarvis-api' // 同域反代，推荐
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
## Git 托管
|
||||||
|
|
||||||
|
```bash
|
||||||
|
cd open-jd-web
|
||||||
|
git init
|
||||||
|
git add .
|
||||||
|
git commit -m "init: 京东跟团查询独立静态站"
|
||||||
|
```
|
||||||
|
|
||||||
|
## 与 ruoyi-vue 的关系
|
||||||
|
|
||||||
|
| 项目 | 用途 |
|
||||||
|
|------|------|
|
||||||
|
| `open-jd-web` | 专用域名静态部署（本仓库） |
|
||||||
|
| `ruoyi-vue` `/open/jd/promoter` | 可选，jarvis 主站内嵌同功能 |
|
||||||
|
|
||||||
|
专用域名请优先使用本仓库部署。
|
||||||
7
config.example.js
Normal file
7
config.example.js
Normal file
@@ -0,0 +1,7 @@
|
|||||||
|
// 复制为 config.js 后按环境修改
|
||||||
|
window.OPEN_JD_CONFIG = {
|
||||||
|
// 同域反代（推荐）
|
||||||
|
apiBase: '/jarvis-api'
|
||||||
|
// 直连后端（需后端开 CORS，一般不推荐）：
|
||||||
|
// apiBase: 'https://jarvis.van333.cn/jarvis-api'
|
||||||
|
}
|
||||||
4
config.js
Normal file
4
config.js
Normal file
@@ -0,0 +1,4 @@
|
|||||||
|
// 部署时可修改 API 前缀；默认同域反代 /jarvis-api
|
||||||
|
window.OPEN_JD_CONFIG = {
|
||||||
|
apiBase: '/jarvis-api'
|
||||||
|
}
|
||||||
279
index.html
Normal file
279
index.html
Normal file
@@ -0,0 +1,279 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="zh-CN">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>跟团查询</title>
|
||||||
|
<script src="config.js"></script>
|
||||||
|
<style>
|
||||||
|
* { box-sizing: border-box; margin: 0; padding: 0; }
|
||||||
|
body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; background: #f5f5f5; }
|
||||||
|
.bg {
|
||||||
|
padding: 20px;
|
||||||
|
background: linear-gradient(to bottom right, #ccdcfd, #f6f4f7);
|
||||||
|
min-height: 14vh;
|
||||||
|
}
|
||||||
|
.logo {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
margin: -20px 0 0 -20px;
|
||||||
|
font-size: 16px;
|
||||||
|
font-weight: bold;
|
||||||
|
height: 50px;
|
||||||
|
padding-left: 20px;
|
||||||
|
}
|
||||||
|
.search { display: flex; align-items: center; justify-content: space-between; margin-top: 12px; }
|
||||||
|
.search-input {
|
||||||
|
flex: 1;
|
||||||
|
height: 36px;
|
||||||
|
padding: 0 12px;
|
||||||
|
border: 1px solid #dcdfe6;
|
||||||
|
border-radius: 4px;
|
||||||
|
font-size: 14px;
|
||||||
|
outline: none;
|
||||||
|
}
|
||||||
|
.search-input:focus { border-color: #409eff; }
|
||||||
|
.search-btn {
|
||||||
|
margin-left: 12px;
|
||||||
|
height: 36px;
|
||||||
|
padding: 0 20px;
|
||||||
|
background: #f56c6c;
|
||||||
|
color: #fff;
|
||||||
|
border: none;
|
||||||
|
border-radius: 4px;
|
||||||
|
font-size: 14px;
|
||||||
|
cursor: pointer;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
.search-btn:disabled { background: #fab6b6; cursor: not-allowed; }
|
||||||
|
.search-btn:hover:not(:disabled) { background: #f78989; }
|
||||||
|
.body { padding: 6px 0; }
|
||||||
|
.empty-wrap {
|
||||||
|
padding: 48px 20px;
|
||||||
|
text-align: center;
|
||||||
|
color: #909399;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
.footer {
|
||||||
|
margin: 16px 20px;
|
||||||
|
padding: 16px;
|
||||||
|
border: 1px dashed rgb(119, 165, 199);
|
||||||
|
border-radius: 25px;
|
||||||
|
}
|
||||||
|
.footer-title {
|
||||||
|
text-align: center;
|
||||||
|
font-size: 16px;
|
||||||
|
padding-top: 15px;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
.footer-desc {
|
||||||
|
margin-top: 16px;
|
||||||
|
font-size: 12px;
|
||||||
|
line-height: 1.8;
|
||||||
|
color: #555;
|
||||||
|
}
|
||||||
|
.order-info {
|
||||||
|
padding: 8px;
|
||||||
|
margin: 6px 20px 0;
|
||||||
|
border-radius: 4px;
|
||||||
|
font-size: 11px;
|
||||||
|
background-color: #ffffff;
|
||||||
|
}
|
||||||
|
.shopinfo { display: flex; align-items: center; padding-bottom: 6px; }
|
||||||
|
.shopinfo-logo { width: 14px; height: 14px; border-radius: 3px; object-fit: cover; }
|
||||||
|
.shopinfo-name {
|
||||||
|
margin-left: 6px;
|
||||||
|
font-size: 12px;
|
||||||
|
color: #222;
|
||||||
|
font-weight: bold;
|
||||||
|
width: 190px;
|
||||||
|
overflow: hidden;
|
||||||
|
white-space: nowrap;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
}
|
||||||
|
.info-header { display: flex; justify-content: space-between; margin-bottom: 4px; }
|
||||||
|
.info-header-left { display: flex; flex-wrap: wrap; gap: 4px; }
|
||||||
|
.valid-msg { font-weight: bold; color: #ff6d6d; }
|
||||||
|
.info-body { margin-top: 16px; display: flex; }
|
||||||
|
.info-img { width: 70px; height: 70px; object-fit: cover; flex-shrink: 0; }
|
||||||
|
.info-img-placeholder {
|
||||||
|
width: 70px; height: 70px; background: #f0f0f0;
|
||||||
|
display: flex; align-items: center; justify-content: center;
|
||||||
|
color: #ccc; font-size: 20px; flex-shrink: 0;
|
||||||
|
}
|
||||||
|
.info-cell { margin-left: 8px; overflow: auto; font-size: 10px; flex: 1; }
|
||||||
|
.info-cell-name {
|
||||||
|
display: -webkit-box;
|
||||||
|
-webkit-box-orient: vertical;
|
||||||
|
-webkit-line-clamp: 2;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
.info-cell-order { margin-top: 6px; word-break: break-all; overflow-wrap: break-word; }
|
||||||
|
.info-cell-price { margin-top: 6px; text-align: right; }
|
||||||
|
.price-val { color: #e02f2f; font-weight: bold; }
|
||||||
|
.info-footer { margin-top: 16px; color: #666; }
|
||||||
|
.tag {
|
||||||
|
display: inline-block;
|
||||||
|
font-size: 11px;
|
||||||
|
height: 16px;
|
||||||
|
line-height: 14px;
|
||||||
|
padding: 0 4px;
|
||||||
|
border-radius: 2px;
|
||||||
|
border: 1px solid;
|
||||||
|
margin: 0 4px 4px 0;
|
||||||
|
}
|
||||||
|
.tag-default { color: #409eff; border-color: #b3d8ff; background: #ecf5ff; }
|
||||||
|
.tag-danger { color: #f56c6c; border-color: #fbc4c4; background: #fef0f0; }
|
||||||
|
.tag-success { color: #67c23a; border-color: #c2e7b0; background: #f0f9eb; }
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div id="app">
|
||||||
|
<div class="bg">
|
||||||
|
<div class="logo">订单跟团查询</div>
|
||||||
|
<div class="search">
|
||||||
|
<input
|
||||||
|
v-model="orderId"
|
||||||
|
class="search-input"
|
||||||
|
placeholder="请输入订单编号"
|
||||||
|
@keyup.enter="getList"
|
||||||
|
>
|
||||||
|
<button class="search-btn" :disabled="loading" @click="getList">
|
||||||
|
{{ loading ? '查询中...' : '查询' }}
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div v-if="orderList && orderList.length" class="body">
|
||||||
|
<div v-for="(item, index) in orderList" :key="index" class="order-info">
|
||||||
|
<div class="shopinfo">
|
||||||
|
<img
|
||||||
|
:src="item.shopLogo || defaultLogo"
|
||||||
|
class="shopinfo-logo"
|
||||||
|
referrerpolicy="no-referrer"
|
||||||
|
@error="onLogoError"
|
||||||
|
>
|
||||||
|
<div class="shopinfo-name">{{ item.shopName }}</div>
|
||||||
|
</div>
|
||||||
|
<div class="info-header">
|
||||||
|
<div class="info-header-left">
|
||||||
|
<span v-if="item.orderSource" class="tag tag-default">{{ item.orderSource }}</span>
|
||||||
|
<span
|
||||||
|
v-if="item.traceTypeStr"
|
||||||
|
:class="['tag', item.traceTypeStr === '跨店' ? 'tag-danger' : 'tag-success']"
|
||||||
|
>{{ item.traceTypeStr }}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div v-if="item.parentId" class="info-header">
|
||||||
|
<div>父单编号：{{ item.parentId }}</div>
|
||||||
|
</div>
|
||||||
|
<div class="info-header">
|
||||||
|
<div>订单编号：{{ item.orderId }}</div>
|
||||||
|
<div class="valid-msg">{{ item.validCodeMsg }}</div>
|
||||||
|
</div>
|
||||||
|
<div class="info-body">
|
||||||
|
<img
|
||||||
|
v-if="item.skuImageUrl && !item._imgFailed"
|
||||||
|
:src="item.skuImageUrl"
|
||||||
|
class="info-img"
|
||||||
|
referrerpolicy="no-referrer"
|
||||||
|
@error="onImageError(item, $event)"
|
||||||
|
>
|
||||||
|
<div v-else class="info-img-placeholder">图</div>
|
||||||
|
<div class="info-cell">
|
||||||
|
<div class="info-cell-name">{{ item.skuName }}</div>
|
||||||
|
<div class="info-cell-order">商品单ID：{{ item.itemId }}</div>
|
||||||
|
<div class="info-cell-price">
|
||||||
|
<span>共{{ item.skuNum }}件</span>
|
||||||
|
<span style="padding: 0 8px;">实付 <span class="price-val">¥{{ item.cosPrice }}</span></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="info-footer">
|
||||||
|
<div>下单时间：{{ item.orderTime }}</div>
|
||||||
|
<div>完成时间：{{ item.finishTime }}</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div v-if="errText && !orderList" class="empty-wrap">{{ errText }}</div>
|
||||||
|
|
||||||
|
<div class="footer">
|
||||||
|
<div class="footer-title">订单查询须知</div>
|
||||||
|
<div class="footer-desc">
|
||||||
|
1. 为保障您充分享受下单权益，建议下单10分钟后查询能否正常抓取，如查询结果为"暂无相关订单"即为无效订单，请尽快重拍。<br><br>
|
||||||
|
2. 淘宝/天猫订单仅展现已付款状态的订单，若订单尚未付款，无法通过此页面查询到；京东订单支持查询已下单待付款状态的订单。<br><br>
|
||||||
|
3. 京东/淘宝订单号可能存在更新的情况，请用京东/淘宝平台后台最新订单号进行查询。<br><br>
|
||||||
|
4. 下单不可使用超级红包，京享礼金，京东e卡，会导致订单无效。<br><br>
|
||||||
|
5. 请勿勾选非推荐商品合并付款，可能会导致订单无效。
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script src="https://unpkg.com/vue@2.6.14/dist/vue.min.js"></script>
|
||||||
|
<script src="https://unpkg.com/axios@1.6.7/dist/axios.min.js"></script>
|
||||||
|
<script>
|
||||||
|
var BASE_API = (window.OPEN_JD_CONFIG && window.OPEN_JD_CONFIG.apiBase) || '/jarvis-api'
|
||||||
|
|
||||||
|
new Vue({
|
||||||
|
el: '#app',
|
||||||
|
data: {
|
||||||
|
orderId: '',
|
||||||
|
orderList: null,
|
||||||
|
errText: '',
|
||||||
|
loading: false,
|
||||||
|
userId: null,
|
||||||
|
defaultLogo: 'https://www.jd.com/favicon.ico'
|
||||||
|
},
|
||||||
|
created: function () {
|
||||||
|
var params = new URLSearchParams(window.location.search)
|
||||||
|
this.userId = params.get('t')
|
||||||
|
document.title = '跟团查询'
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
getList: function () {
|
||||||
|
if (!this.orderId) return
|
||||||
|
var self = this
|
||||||
|
this.loading = true
|
||||||
|
this.orderList = null
|
||||||
|
this.errText = ''
|
||||||
|
axios.get(BASE_API + '/open/jd/queryTkOrder', {
|
||||||
|
params: { orderId: this.orderId, t: this.userId }
|
||||||
|
}).then(function (res) {
|
||||||
|
var data = res.data || {}
|
||||||
|
if (data.orderInfoList && data.orderInfoList.length) {
|
||||||
|
self.orderList = data.orderInfoList
|
||||||
|
} else {
|
||||||
|
self.errText = data.msg || '暂无相关订单'
|
||||||
|
}
|
||||||
|
}).catch(function () {
|
||||||
|
self.errText = '查询失败，请稍后重试'
|
||||||
|
}).finally(function () {
|
||||||
|
self.loading = false
|
||||||
|
})
|
||||||
|
},
|
||||||
|
onLogoError: function (e) {
|
||||||
|
e.target.src = this.defaultLogo
|
||||||
|
},
|
||||||
|
onImageError: function (item, e) {
|
||||||
|
var tryCount = item._imgTry || 0
|
||||||
|
var fallbacks = []
|
||||||
|
if (item.skuId) {
|
||||||
|
fallbacks.push(
|
||||||
|
'https://img14.360buyimg.com/n5/s450x450_' + item.skuId + '.jpg',
|
||||||
|
'https://img10.360buyimg.com/n1/s450x450_' + item.skuId + '.jpg',
|
||||||
|
'https://img14.360buyimg.com/n1/s240x240_' + item.skuId + '.jpg'
|
||||||
|
)
|
||||||
|
}
|
||||||
|
if (tryCount < fallbacks.length) {
|
||||||
|
item._imgTry = tryCount + 1
|
||||||
|
e.target.src = fallbacks[tryCount]
|
||||||
|
return
|
||||||
|
}
|
||||||
|
this.$set(item, '_imgFailed', true)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
42
nginx.conf.example
Normal file
42
nginx.conf.example
Normal file
@@ -0,0 +1,42 @@
|
|||||||
|
# jd.van333.cn 独立静态站 + API 反代到 jarvis 旧服
|
||||||
|
# 将 root 改为实际部署目录
|
||||||
|
|
||||||
|
server {
|
||||||
|
listen 80;
|
||||||
|
server_name jd.van333.cn;
|
||||||
|
return 301 https://$host$request_uri;
|
||||||
|
}
|
||||||
|
|
||||||
|
server {
|
||||||
|
listen 443 ssl http2;
|
||||||
|
server_name jd.van333.cn;
|
||||||
|
|
||||||
|
root /www/sites/jd.van333.cn/index;
|
||||||
|
index index.html;
|
||||||
|
|
||||||
|
ssl_certificate /opt/1panel/apps/openresty/openresty/www/common/ssl/jd.van333.cn/fullchain.cer;
|
||||||
|
ssl_certificate_key /opt/1panel/apps/openresty/openresty/www/common/ssl/jd.van333.cn.key;
|
||||||
|
|
||||||
|
# 仅反代查询接口到旧服
|
||||||
|
location ^~ /jarvis-api/open/jd/ {
|
||||||
|
proxy_pass https://jarvis.van333.cn/jarvis-api/open/jd/;
|
||||||
|
proxy_ssl_server_name on;
|
||||||
|
proxy_set_header Host jarvis.van333.cn;
|
||||||
|
proxy_set_header X-Real-IP $remote_addr;
|
||||||
|
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
|
||||||
|
proxy_set_header X-Forwarded-Proto $scheme;
|
||||||
|
}
|
||||||
|
|
||||||
|
# 兼容旧链接 /open/jd/promoter
|
||||||
|
location = /open/jd/promoter {
|
||||||
|
try_files /index.html =404;
|
||||||
|
}
|
||||||
|
|
||||||
|
location = / {
|
||||||
|
try_files /index.html =404;
|
||||||
|
}
|
||||||
|
|
||||||
|
location / {
|
||||||
|
try_files $uri $uri/ /index.html;
|
||||||
|
}
|
||||||
|
}
|
||||||
Reference in New Issue
Block a user