This commit is contained in:
weipengfei 2024-04-06 10:21:06 +08:00
parent 24728a6754
commit 81095f57a1
11 changed files with 82 additions and 93 deletions

6
package-lock.json generated
View File

@ -11,6 +11,7 @@
"@element-plus/icons-vue": "^2.3.1", "@element-plus/icons-vue": "^2.3.1",
"axios": "^1.6.8", "axios": "^1.6.8",
"element-plus": "^2.6.3", "element-plus": "^2.6.3",
"mitt": "^3.0.1",
"pinia": "^2.1.7", "pinia": "^2.1.7",
"sass": "^1.72.0", "sass": "^1.72.0",
"vue": "^3.4.21", "vue": "^3.4.21",
@ -1308,6 +1309,11 @@
"url": "https://github.com/sponsors/isaacs" "url": "https://github.com/sponsors/isaacs"
} }
}, },
"node_modules/mitt": {
"version": "3.0.1",
"resolved": "https://registry.npmjs.org/mitt/-/mitt-3.0.1.tgz",
"integrity": "sha512-vKivATfr97l2/QBCYAkXYDbrIWPM2IIKEl7YPhjCvKlG3kE2gm+uBo6nEXK3M5/Ffh/FLpKExzOQ3JJoJGFKBw=="
},
"node_modules/muggle-string": { "node_modules/muggle-string": {
"version": "0.4.1", "version": "0.4.1",
"resolved": "https://registry.npmjs.org/muggle-string/-/muggle-string-0.4.1.tgz", "resolved": "https://registry.npmjs.org/muggle-string/-/muggle-string-0.4.1.tgz",

View File

@ -12,6 +12,7 @@
"@element-plus/icons-vue": "^2.3.1", "@element-plus/icons-vue": "^2.3.1",
"axios": "^1.6.8", "axios": "^1.6.8",
"element-plus": "^2.6.3", "element-plus": "^2.6.3",
"mitt": "^3.0.1",
"pinia": "^2.1.7", "pinia": "^2.1.7",
"sass": "^1.72.0", "sass": "^1.72.0",
"vue": "^3.4.21", "vue": "^3.4.21",

View File

@ -1,10 +1,6 @@
<script setup> <script setup>
import myHeader from "./myHeader.vue"; import myHeader from "./myHeader.vue";
import myAside from "./myAside.vue"; import myAside from "./myAside.vue";
import { initWS } from "@/utils/ws";
const ws = initWS('eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpc3MiOiIxMjcuMC4wLjE6ODMyNCIsImF1ZCI6IjEyNy4wLjAuMTo4MzI0IiwiaWF0IjoxNzEyMTI4NDczLCJuYmYiOjE3MTIxMjg0NzMsImV4cCI6MTcxMjE1MDA3MywianRpIjpbMzAsIm1lciJdfQ.1HO_Ax3wxW-gloTRn6Psy4KYEdv8kuEqlgTJSl4G4Wk');
</script> </script>
<template> <template>

View File

@ -1,4 +1,4 @@
import { createRouter, createWebHistory } from 'vue-router'; import { createRouter, createWebHashHistory } from 'vue-router';
import layout from '@/layout/index.vue'; import layout from '@/layout/index.vue';
import { useUserStore } from '@/store/user.js'; import { useUserStore } from '@/store/user.js';
@ -46,7 +46,7 @@ const routes = [
]; ];
const router = createRouter({ const router = createRouter({
history: createWebHistory(), history: createWebHashHistory(),
routes routes
}); });

View File

@ -1,6 +1,6 @@
import axios from "axios"; import axios from "axios";
import { ElMessage } from "element-plus"; import { ElMessage } from "element-plus";
import { useRouter } from "vue-router"; import router from "@/router/index.js";
import { useUserStore } from "../store/user"; import { useUserStore } from "../store/user";
const request = axios.create({ const request = axios.create({
@ -8,6 +8,7 @@ const request = axios.create({
timeout: 10000 timeout: 10000
}) })
// 请求拦截器 // 请求拦截器
request.interceptors.request.use( request.interceptors.request.use(
config => { config => {
@ -31,17 +32,16 @@ request.interceptors.response.use(
response => { response => {
// 对响应数据做些什么,例如解析数据、统一处理错误等 // 对响应数据做些什么,例如解析数据、统一处理错误等
if (response.data.status === 401 || response.data.status === 40000) { if (response.data.status === 401 || response.data.status === 40000) {
const router = useRouter();
ElMessage({ ElMessage({
message: response.data.message, message: response.data.message,
type: 'error', type: 'error',
}) })
setTimeout(() => { setTimeout(()=>{
const userStore = useUserStore(); const userStore = useUserStore();
userStore.setUserInfo({}); userStore.setUserInfo({});
userStore.setToken(''); userStore.setToken('');
router.push('/login'); router.push('/login');
}, 800); },700)
} }
if (response.data.status === 400) { if (response.data.status === 400) {
ElMessage({ ElMessage({

View File

@ -29,7 +29,7 @@ const getStoreList = (data) => {
...data, ...data,
}; };
storeListApi(userStore.userInfo.service.mer_id, where.value).then((res) => { storeListApi(userStore.userInfo.service.mer_id, where.value).then((res) => {
if(res.data.list.length < where.value.limit) loadEnd.value = true; if(res.data?.list?.length < where.value.limit) loadEnd.value = true;
let list = res.data.list.map((item) => { let list = res.data.list.map((item) => {
item.attr = Object.keys(item.sku); item.attr = Object.keys(item.sku);
return item; return item;

View File

@ -1,9 +1,44 @@
<script setup> <script setup>
import { ref } from "vue"; import { ref } from "vue";
import { cartListApi, cartDeleteApi, cartChangeApi } from "@/api/store.js"; import {
orderListApi,
orderStatusApi,
orderLadingApi,
cartListApi
} from "@/api/store.js";
import { useUserStore } from "@/store/user.js";
import { ElMessage } from "element-plus";
import { useRouter } from "vue-router";
const userStore = useUserStore();
const list = ref([]); const list = ref([]);
const keyword = ref('') const keyword = ref('');
const tabPosition = ref(1); // 1-, 2-
const payRef = ref(null);
const where = ref({
page: 1,
limit: 20,
});
const loading = ref(false);
const total = ref(0);
const orderList = ref([]);
const getOrderList = () => {
loading.value = true;
if (tabPosition.value == 1) where.value.paid = null;
if (tabPosition.value == 2) where.value.paid = 0;
orderListApi(userStore.userInfo.service.mer_id, where.value).then((res) => {
orderList.value = res.data.list;
total.value = res.data.count;
loading.value = false;
});
};
getOrderList();
</script> </script>
@ -13,12 +48,24 @@ const keyword = ref('')
<div class="nav-item"> <div class="nav-item">
订单列表 订单列表
</div> </div>
<div class="nav-item-clear" @click="clearAll"> <div class="nav-item-clear">
<el-icon><Delete /></el-icon> <el-icon><Delete /></el-icon>
</div> </div>
</div> </div>
<div class="header-input"> <div class="header-input">
<el-input v-model="keyword" placeholder="请输入付款"></el-input> <el-input v-model="keyword" placeholder="请输入订单编号">
<template #append>
<el-button type="primary" style="background-color: #1890ff;color: #fff;border-radius: 0 5px 5px 0;">搜索</el-button>
</template>
</el-input>
</div>
<div class="order-list">
<div class="item" v-for="(item, index) in orderList" :key="index">
<div class="top">
<div class="sn">单号: {{ item.order_sn }}</div>
<div class="create-time"> {{ item.create_time }}</div>
</div>
</div>
</div> </div>
</div> </div>
</template> </template>
@ -51,95 +98,30 @@ const keyword = ref('')
.header-input{ .header-input{
padding: 1rem; padding: 1rem;
padding-top: 0; padding-top: 0;
padding-bottom: 2rem; height: 2.5rem;
height: 1.5rem;
border-bottom: 1px solid #eee; border-bottom: 1px solid #eee;
} }
.order-list { .order-list {
height: calc(100vh - 100px - 14rem); height: calc(100vh - 100px - 8.2rem);
overflow-y: auto; overflow-y: auto;
.order-item { .item{
display: flex;
padding: 1rem; padding: 1rem;
border-bottom: 1px solid #eee; .top{
.order-item-img {
width: 5rem;
height: 5rem;
border-radius: 0.5rem;
}
.order-item-info {
flex: 1;
box-sizing: border-box;
padding-left: 12px;
display: flex; display: flex;
flex-direction: column;
justify-content: space-between; justify-content: space-between;
& > div { align-items: flex-end;
display: flex; .sn{
align-items: center; font-weight: bold;
justify-content: space-between; font-size: 0.9rem;
} &::before{
.order-item-title {
.title {
width: 18rem;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.delete {
color: #1890ff;
cursor: pointer;
} }
} }
.order-item-sku { .create-time{
cursor: pointer;
font-size: 0.8rem; font-size: 0.8rem;
color: #999;
} }
} }
} }
} }
.order-footer {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
box-shadow: 0 -1px 10px #eee;
.order-total {
height: 2.5rem;
padding: 1rem 2rem;
display: flex;
justify-content: space-between;
border-bottom: 1px solid #eee;
align-items: center;
.price {
display: flex;
align-items: center;
.total-item {
padding-right: 1.5rem;
span {
color: #f5222d;
}
}
}
.update-price {
.btn {
border-radius: 3rem;
}
}
}
.order-btn {
height: 3.2rem;
padding: 1rem 1.5rem;
.btn {
width: 100%;
height: 100%;
font-size: 1.2rem;
border-radius: 3rem;
}
}
}
} }
</style> </style>

View File

@ -2,7 +2,6 @@
import { ref } from "vue"; import { ref } from "vue";
import { import {
orderListApi, orderListApi,
groupOrderListApi,
orderStatusApi, orderStatusApi,
orderLadingApi, orderLadingApi,
cartListApi cartListApi

2
src/vite-env.d.ts vendored
View File

@ -1 +1,3 @@
/// <reference types="vite/client" /> /// <reference types="vite/client" />
declare module 'element-plus/dist/locale/zh-cn.mjs'
declare module './router'

View File

@ -14,6 +14,8 @@
"noEmit": true, "noEmit": true,
"jsx": "preserve", "jsx": "preserve",
"allowJs": true,
/* Linting */ /* Linting */
"strict": true, "strict": true,
"noUnusedLocals": true, "noUnusedLocals": true,

View File

@ -4,6 +4,7 @@ import vue from '@vitejs/plugin-vue'
// https://vitejs.dev/config/ // https://vitejs.dev/config/
export default defineConfig({ export default defineConfig({
plugins: [vue()], plugins: [vue()],
base: './',
server: { server: {
port: '5175', port: '5175',
host: '0.0.0.0', host: '0.0.0.0',