Merge branch 'main' into production
This commit is contained in:
63
frontend/src/api/shop-order.js
Normal file
63
frontend/src/api/shop-order.js
Normal file
@@ -0,0 +1,63 @@
|
||||
import send_request from '../utils/send_request';
|
||||
|
||||
/**
|
||||
* 获取订单列表
|
||||
* @returns
|
||||
*/
|
||||
export function getOrderList(params) {
|
||||
return send_request({
|
||||
url: '/shop/order/manage/getOrderList',
|
||||
method: 'GET',
|
||||
params: params,
|
||||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* 获取订单详情
|
||||
* @returns
|
||||
*/
|
||||
export function getOrderDetail(params) {
|
||||
return send_request({
|
||||
url: '/shop/order/miniprogram/orderDetail',
|
||||
method: 'GET',
|
||||
params: params,
|
||||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* 订单发货
|
||||
* @returns
|
||||
*/
|
||||
export function deliverOrder(params) {
|
||||
return send_request({
|
||||
url: '/shop/order/manage/deliverOrder',
|
||||
method: 'POST',
|
||||
useQS: true,
|
||||
params: params,
|
||||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* 关闭订单
|
||||
* @returns
|
||||
*/
|
||||
export function withdrawOrder(params) {
|
||||
return send_request({
|
||||
url: '/shop/order/manage/cancelOrder',
|
||||
method: 'POST',
|
||||
useQS: true,
|
||||
params: params,
|
||||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* 导出订单列表
|
||||
* @returns
|
||||
*/
|
||||
export function exportOrderList(params) {
|
||||
return send_request({
|
||||
url: '/shop/order/manage/exportOrderList',
|
||||
method: 'GET',
|
||||
params: params,
|
||||
});
|
||||
};
|
@@ -24,6 +24,24 @@ export function userLogout() {
|
||||
return null;
|
||||
};
|
||||
|
||||
/**
|
||||
* 修改密码
|
||||
* @returns
|
||||
*/
|
||||
export function updatePwd({ oldpwd, newpwd }) {
|
||||
let userId = localStorage.getItem("ms_user_id")
|
||||
return send_request({
|
||||
url: '/user/updatePwd',
|
||||
method: 'POST',
|
||||
useQS: true,
|
||||
params: {
|
||||
"userId": userId,
|
||||
"oldpwd": oldpwd,
|
||||
"newpwd": newpwd,
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* 获取用户列表
|
||||
* @returns
|
||||
|
@@ -13,7 +13,7 @@
|
||||
<div class="header-right">
|
||||
<div class="header-user-con">
|
||||
<!-- 消息中心 -->
|
||||
<div class="btn-bell" @click="router.push('/tabs')">
|
||||
<div class="btn-bell" @click="router.push('/tabs')" v-if="false">
|
||||
<el-tooltip effect="dark" :content="message ? `有${message}条未读消息` : `消息中心`" placement="bottom">
|
||||
<i class="el-icon-lx-notice"></i>
|
||||
</el-tooltip>
|
||||
|
@@ -56,16 +56,27 @@
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" width="220" align="center" v-if="props.editFunc || props.deleteFunc">
|
||||
<el-table-column label="操作" width="220" align="center"
|
||||
v-if="props.editFunc || props.deleteFunc || props.customEditHandle">
|
||||
<template #default="scope">
|
||||
<el-button text :icon="Edit" @click="handleEdit(scope.$index, scope.row)"
|
||||
v-permiss="props.editPermiss" v-if="props.editFunc">
|
||||
编辑
|
||||
</el-button>
|
||||
<el-button text :icon="Delete" class="red" @click="handleDelete(scope.$index, scope.row)"
|
||||
v-permiss="props.editPermiss" v-if="props.deleteFunc">
|
||||
删除
|
||||
</el-button>
|
||||
<template v-if="props.customEditHandle">
|
||||
<el-button text :icon="List"
|
||||
@click="props.customEditHandle((scope as any).$index, (scope as any).row, getData)"
|
||||
v-permiss="props.editPermiss">
|
||||
管理
|
||||
</el-button>
|
||||
</template>
|
||||
<template v-else>
|
||||
<el-button text :icon="Edit" @click="handleEdit((scope as any).$index, (scope as any).row)"
|
||||
v-permiss="props.editPermiss" v-if="props.editFunc">
|
||||
编辑
|
||||
</el-button>
|
||||
<el-button text :icon="Delete" class="red"
|
||||
@click="handleDelete((scope as any).$index, (scope as any).row)"
|
||||
v-permiss="props.editPermiss" v-if="props.deleteFunc">
|
||||
删除
|
||||
</el-button>
|
||||
</template>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
@@ -141,7 +152,7 @@
|
||||
<script setup lang="ts">
|
||||
import { ref, reactive, onMounted, computed } from 'vue';
|
||||
import { FormInstance, FormRules, ElMessage, ElMessageBox } from 'element-plus';
|
||||
import { Delete, Edit, Search, Plus, Filter, Download } from '@element-plus/icons-vue';
|
||||
import { Delete, Edit, Search, Plus, Filter, Download, List } from '@element-plus/icons-vue';
|
||||
import * as xlsx from 'xlsx';
|
||||
import Mock from 'mockjs';
|
||||
import ImageUpload from './image-upload.vue';
|
||||
@@ -176,6 +187,12 @@ const props = defineProps({
|
||||
'editPermiss': {
|
||||
type: String,
|
||||
required: true,
|
||||
},
|
||||
|
||||
// 自定义修改按钮点击事件
|
||||
'customEditHandle': {
|
||||
type: Function,
|
||||
required: false,
|
||||
}
|
||||
})
|
||||
|
||||
@@ -431,10 +448,10 @@ const saveEdit = async (formEl: FormInstance | undefined) => {
|
||||
var result;
|
||||
if (formId > 0) {
|
||||
// 修改记录
|
||||
var result = await props.editFunc(form)
|
||||
var result = await props.editFunc?.(form)
|
||||
} else {
|
||||
// 新增记录
|
||||
var result = await props.addFunc(form)
|
||||
var result = await props.addFunc?.(form)
|
||||
query.pageIndex = Math.ceil((pageTotal.value + 1) / query.pageSize);
|
||||
}
|
||||
console.log("result", result)
|
||||
@@ -460,7 +477,7 @@ const handleDelete = (index: number, row: any) => {
|
||||
// 二次确认删除
|
||||
ElMessageBox.confirm('确定要删除吗?', '提示', { type: 'warning' })
|
||||
.then(async () => {
|
||||
var result = await props.deleteFunc({
|
||||
var result = await props.deleteFunc?.({
|
||||
id: row[idFieldName],
|
||||
})
|
||||
if (result) {
|
||||
@@ -540,7 +557,7 @@ const handleExport = async () => {
|
||||
// 数据部分
|
||||
let excelList = dataList.map((row: any) => {
|
||||
// 通过翻译前的 key 拿数据
|
||||
return fieldNameList.map((field: any) => String(row[field]))
|
||||
return fieldNameList.map((field: any) => String(row[field] || ""))
|
||||
})
|
||||
excelList.unshift(firstRow) // 插入表头
|
||||
|
||||
|
@@ -91,6 +91,11 @@ const items = [
|
||||
title: '商品管理',
|
||||
permiss: 'shop-good-setting',
|
||||
},
|
||||
{
|
||||
index: '/shop-order-setting',
|
||||
title: '订单管理',
|
||||
permiss: 'shop-order-setting',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
|
@@ -84,6 +84,15 @@ const routes: RouteRecordRaw[] = [
|
||||
},
|
||||
component: () => import('../views/shop-good-setting.vue'),
|
||||
},
|
||||
{
|
||||
path: '/shop-order-setting',
|
||||
name: 'shop-order-setting',
|
||||
meta: {
|
||||
title: '订单管理',
|
||||
permiss: 'shop-order-setting',
|
||||
},
|
||||
component: () => import('../views/shop-order-setting.vue'),
|
||||
},
|
||||
|
||||
|
||||
{
|
||||
|
@@ -25,6 +25,7 @@ export const usePermissStore = defineStore('permiss', {
|
||||
"shop",
|
||||
"shop-cate-setting",
|
||||
"shop-good-setting",
|
||||
"shop-order-setting",
|
||||
|
||||
"privilege",
|
||||
"privilege-user-setting",
|
||||
@@ -46,6 +47,7 @@ export const usePermissStore = defineStore('permiss', {
|
||||
"shop",
|
||||
"shop-cate-setting",
|
||||
"shop-good-setting",
|
||||
"shop-order-setting",
|
||||
|
||||
"privilege",
|
||||
"privilege-user-setting",
|
||||
|
@@ -22,6 +22,12 @@ export default {
|
||||
/**
|
||||
* 后端接口请求地址
|
||||
* (结尾加不加 / 都可)
|
||||
*
|
||||
* FIXME 环境配置
|
||||
*
|
||||
* backendHost
|
||||
* - 线上环境:"https://epp.only4.work/"
|
||||
* - 开发环境:"http://localhost/"
|
||||
*/
|
||||
backendHost: "https://epp-prod.only4.work/",
|
||||
};
|
||||
|
@@ -1,213 +1,34 @@
|
||||
<template>
|
||||
<div class="container">
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="8">
|
||||
<el-card shadow="hover" class="mgb20" style="height: 252px">
|
||||
<div class="user-info">
|
||||
<el-avatar :size="120" :src="imgurl" />
|
||||
<div class="user-info-cont">
|
||||
<div class="user-info-name">{{ name }}</div>
|
||||
<div>{{ role }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="user-info-list">
|
||||
上次登录时间:
|
||||
<span>2022-10-01</span>
|
||||
</div>
|
||||
<div class="user-info-list">
|
||||
上次登录地点:
|
||||
<span>东莞</span>
|
||||
</div>
|
||||
</el-card>
|
||||
<el-card shadow="hover" style="height: 252px">
|
||||
<template #header>
|
||||
<div class="clearfix">
|
||||
<span>语言详情</span>
|
||||
</div>
|
||||
</template>
|
||||
Vue
|
||||
<el-progress :percentage="79.4" color="#42b983"></el-progress>
|
||||
TypeScript
|
||||
<el-progress :percentage="14" color="#f1e05a"></el-progress>
|
||||
CSS
|
||||
<el-progress :percentage="5.6"></el-progress>
|
||||
HTML
|
||||
<el-progress :percentage="1" color="#f56c6c"></el-progress>
|
||||
</el-card>
|
||||
</el-col>
|
||||
<el-col :span="16">
|
||||
<el-row :gutter="20" class="mgb20">
|
||||
<el-col :span="8">
|
||||
<el-card shadow="hover" :body-style="{ padding: '0px' }">
|
||||
<div class="grid-content grid-con-1">
|
||||
<el-icon class="grid-con-icon"><User /></el-icon>
|
||||
<div class="grid-cont-right">
|
||||
<div class="grid-num">1234</div>
|
||||
<div>用户访问量</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-card shadow="hover" :body-style="{ padding: '0px' }">
|
||||
<div class="grid-content grid-con-2">
|
||||
<el-icon class="grid-con-icon"><ChatDotRound /></el-icon>
|
||||
<div class="grid-cont-right">
|
||||
<div class="grid-num">321</div>
|
||||
<div>系统消息</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-card shadow="hover" :body-style="{ padding: '0px' }">
|
||||
<div class="grid-content grid-con-3">
|
||||
<el-icon class="grid-con-icon"><Goods /></el-icon>
|
||||
<div class="grid-cont-right">
|
||||
<div class="grid-num">500</div>
|
||||
<div>商品数量</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-card shadow="hover" style="height: 403px">
|
||||
<template #header>
|
||||
<div class="clearfix">
|
||||
<span>预警列表</span>
|
||||
<el-button style="float: right; padding: 3px 0" text>添加</el-button>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<el-table :show-header="false" :data="todoList" style="width: 100%">
|
||||
<el-table-column width="40">
|
||||
<template #default="scope">
|
||||
<el-checkbox v-model="scope.row.status"></el-checkbox>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column>
|
||||
<template #default="scope">
|
||||
<div
|
||||
class="todo-item"
|
||||
:class="{
|
||||
'todo-item-del': scope.row.status
|
||||
}"
|
||||
>
|
||||
{{ scope.row.title }}
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-card>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
<div class="container">
|
||||
<el-card shadow="hover" class="mgb20" style="height: 252px">
|
||||
<div class="user-info">
|
||||
<el-avatar :size="120" :src="imgurl" />
|
||||
<div class="user-info-cont">
|
||||
<div class="user-info-name">{{ name }}</div>
|
||||
<div>{{ role }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="user-info-list">
|
||||
上次登录时间:
|
||||
<span>2022-10-01</span>
|
||||
</div>
|
||||
<div class="user-info-list">
|
||||
上次登录地点:
|
||||
<span>东莞</span>
|
||||
</div>
|
||||
</el-card>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="dashboard">
|
||||
import { ref, reactive } from 'vue';
|
||||
import imgurl from '../assets/img/img.jpg';
|
||||
|
||||
const roleMap = {
|
||||
|
||||
}
|
||||
const name = localStorage.getItem('ms_username');
|
||||
const role: string = name === 'admin' ? '超级管理员' : '普通用户';
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.el-row {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.grid-content {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 100px;
|
||||
}
|
||||
|
||||
.grid-cont-right {
|
||||
flex: 1;
|
||||
text-align: center;
|
||||
font-size: 14px;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.grid-num {
|
||||
font-size: 30px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.grid-con-icon {
|
||||
font-size: 50px;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
text-align: center;
|
||||
line-height: 100px;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.grid-con-1 .grid-con-icon {
|
||||
background: rgb(45, 140, 240);
|
||||
}
|
||||
|
||||
.grid-con-1 .grid-num {
|
||||
color: rgb(45, 140, 240);
|
||||
}
|
||||
|
||||
.grid-con-2 .grid-con-icon {
|
||||
background: rgb(100, 213, 114);
|
||||
}
|
||||
|
||||
.grid-con-2 .grid-num {
|
||||
color: rgb(100, 213, 114);
|
||||
}
|
||||
|
||||
.grid-con-3 .grid-con-icon {
|
||||
background: rgb(242, 94, 67);
|
||||
}
|
||||
|
||||
.grid-con-3 .grid-num {
|
||||
color: rgb(242, 94, 67);
|
||||
}
|
||||
|
||||
.user-info {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding-bottom: 20px;
|
||||
border-bottom: 2px solid #ccc;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.user-info-cont {
|
||||
padding-left: 50px;
|
||||
flex: 1;
|
||||
font-size: 14px;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.user-info-cont div:first-child {
|
||||
font-size: 30px;
|
||||
color: #222;
|
||||
}
|
||||
|
||||
.user-info-list {
|
||||
font-size: 14px;
|
||||
color: #999;
|
||||
line-height: 25px;
|
||||
}
|
||||
|
||||
.user-info-list span {
|
||||
margin-left: 70px;
|
||||
}
|
||||
|
||||
.mgb20 {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.todo-item {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.todo-item-del {
|
||||
text-decoration: line-through;
|
||||
color: #999;
|
||||
}
|
||||
</style>
|
||||
<style scoped></style>
|
||||
|
@@ -116,7 +116,10 @@ const submitForm = (formEl: FormInstance | undefined) => {
|
||||
if (!data) return;
|
||||
|
||||
console.log("login data", data, data.userInfo);
|
||||
|
||||
if (![1, 2].includes(data.userInfo?.roleId)) {
|
||||
ElMessage.error('您所在用户组无权登录当前系统');
|
||||
return;
|
||||
}
|
||||
ElMessage.success('登录成功');
|
||||
localStorage.setItem('ms_username', data.userInfo?.username);
|
||||
localStorage.setItem('ms_realname', data.userInfo?.realname);
|
||||
|
191
frontend/src/views/shop-order-setting.vue
Normal file
191
frontend/src/views/shop-order-setting.vue
Normal file
@@ -0,0 +1,191 @@
|
||||
<template>
|
||||
<div class="container">
|
||||
<manageList :list-func="shopOrderApi.getOrderList" :custom-edit-handle="editHandle"
|
||||
:export-func="shopOrderApi.exportOrderList" edit-permiss="shop-order-setting" />
|
||||
|
||||
<!-- 新增 / 编辑弹出框 -->
|
||||
<el-dialog title="管理订单" v-model="visible" style="width: 60%; min-width: 280px;">
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<p class="line-height">
|
||||
<span class="row-index">订单ID</span>
|
||||
{{ orderDetail.id || "" }}
|
||||
</p>
|
||||
<p class="line-height">
|
||||
<span class="row-index">订单状态</span>
|
||||
<el-tag effect="plain" round>{{ orderDetail.orderStatus || "" }}</el-tag>
|
||||
{{ orderDetail.orderStatusCode || "" }}
|
||||
</p>
|
||||
<p class="line-height">
|
||||
<span class="row-index">下单用户ID</span>
|
||||
{{ orderDetail.userId || "" }}
|
||||
</p>
|
||||
<p class="line-height">
|
||||
<span class="row-index">订单价格</span>
|
||||
{{ orderDetail.orderPrice ? ('¥' + orderDetail.orderPrice) : "-" }}
|
||||
</p>
|
||||
<p class="line-height">
|
||||
<span class="row-index">下单时间</span>
|
||||
{{ orderDetail.orderDate || "-" }}
|
||||
</p>
|
||||
<p class="line-height">
|
||||
<span class="row-index">订单取消时间</span>
|
||||
{{ orderDetail.cancelDate || "-" }}
|
||||
</p>
|
||||
<p class="line-height">
|
||||
<span class="row-index">订单支付时间</span>
|
||||
{{ orderDetail.payDate || "-" }}
|
||||
</p>
|
||||
<p class="line-height">
|
||||
<span class="row-index">订单发货时间</span>
|
||||
{{ orderDetail.shipDate || "-" }}
|
||||
</p>
|
||||
<p class="line-height">
|
||||
<span class="row-index">订单送达时间</span>
|
||||
{{ orderDetail.deliverDate || "-" }}
|
||||
</p>
|
||||
<p class="line-height">
|
||||
<span class="row-index">运单号</span>
|
||||
<template
|
||||
v-if="orderDetail.orderStatusCode != 'Processing' && orderDetail.orderStatusCode != 'Shipped'">
|
||||
{{ orderDetail.expressId || "-" }}
|
||||
</template>
|
||||
<el-input v-else v-model="shippingInfo.expressId" placeholder="Please input" />
|
||||
</p>
|
||||
<p class="line-height">
|
||||
<span class="row-index">发货备注</span>
|
||||
<template
|
||||
v-if="orderDetail.orderStatusCode != 'Processing' && orderDetail.orderStatusCode != 'Shipped'">
|
||||
{{ orderDetail.comment || "-" }}
|
||||
</template>
|
||||
<el-input v-else v-model="shippingInfo.comment" placeholder="Please input" />
|
||||
</p>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<p style="margin-bottom: 20px;">该订单中包含如下商品</p>
|
||||
<div style="max-height:50vh; overflow-y: scroll;">
|
||||
<el-card class="box-card" v-for="i in orderItem" :key="i.goodId"
|
||||
style="--el-card-padding: 10px; margin-bottom: 8px;">
|
||||
<div style="display: grid; grid-template-columns: 50px 1fr 60px; gap: 15px;">
|
||||
<img :src="i.good.picUrl" style="width: 60px; height: 60px;" />
|
||||
<div style="place-self: center left;">
|
||||
<p>{{ i.good.goodsName }}</p>
|
||||
<p style="color: grey; font-size: 12px;">商品ID: {{ i.goodId }}</p>
|
||||
</div>
|
||||
<div style="place-self: center; font-size: 16px;">{{ i.goodCount }} {{ i.good.unit }}</div>
|
||||
</div>
|
||||
</el-card>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<!-- 订单状态:PENDING("Pending", "等待确认"), -->
|
||||
<!-- 订单状态:PROCESSING("Processing", "已支付,等待发货中"), -->
|
||||
<!-- 订单状态:SHIPPED("Shipped", "已发货,等待确认收货"), -->
|
||||
<!-- 订单状态:DELIVERED("Delivered", "已送达"), -->
|
||||
<!-- 订单状态:CANCELLED("Cancelled", "已取消"); -->
|
||||
<!-- 该订单已被取消 -->
|
||||
<template #footer>
|
||||
<span class="dialog-footer">
|
||||
<el-button v-if="orderDetail.orderStatusCode == 'Processing'" type="danger"
|
||||
@click="withdrawOrder">取消发货并退款</el-button>
|
||||
<el-button
|
||||
v-if="orderDetail.orderStatusCode == 'Processing' || orderDetail.orderStatusCode == 'Shipped'"
|
||||
type="primary" @click="saveEdit">保存发货信息</el-button>
|
||||
<el-button @click="visible = false">关 闭</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import manageList from '../components/manage-list.vue';
|
||||
import * as shopOrderApi from '../api/shop-order';
|
||||
import { ref, reactive, onMounted, computed } from 'vue';
|
||||
import { FormInstance, FormRules, ElMessage, ElMessageBox } from 'element-plus';
|
||||
import { Delete, Edit, Search, Plus, Filter, Download } from '@element-plus/icons-vue';
|
||||
|
||||
const visible: any = ref(false);
|
||||
|
||||
const orderDetail = ref({} as any);
|
||||
const orderItem = ref([] as any);
|
||||
|
||||
const shippingInfo = ref({} as any); // 发货信息
|
||||
|
||||
let completeCallback: Function = () => { };
|
||||
|
||||
const editHandle = async function (tabIndex: number, row: any, refreshFunc: Function) {
|
||||
console.log("tabIndex", tabIndex)
|
||||
console.log("orderDetail", row)
|
||||
orderDetail.value = row // 订单详情
|
||||
|
||||
shippingInfo.value.expressId = row.expressId
|
||||
shippingInfo.value.comment = row.comment
|
||||
|
||||
completeCallback = refreshFunc
|
||||
visible.value = true
|
||||
|
||||
shopOrderApi.getOrderDetail({
|
||||
orderId: row.id
|
||||
}).then(function (data) {
|
||||
let orderGoods = {}
|
||||
data.goods.forEach((good: any) => {
|
||||
orderGoods[good.id] = good
|
||||
});
|
||||
|
||||
orderItem.value = data.orderItem.map((item: any) => {
|
||||
item.good = orderGoods[item.goodId]
|
||||
return item
|
||||
})
|
||||
|
||||
console.log("orderItem", orderItem.value)
|
||||
})
|
||||
}
|
||||
|
||||
const saveEdit = function () {
|
||||
// 保存发货信息
|
||||
ElMessageBox.confirm('确定要进行发货操作吗?发货后订单将不可撤销。(用户点击收货前仍可以修改发货信息)', '提示', { type: 'warning' })
|
||||
.then(async () => {
|
||||
shopOrderApi.deliverOrder({
|
||||
orderId: orderDetail.value.id,
|
||||
...shippingInfo.value
|
||||
}).then(function (data) {
|
||||
if (data) { // 如果出错则已经出提示了
|
||||
ElMessage.success({ message: data })
|
||||
visible.value = false
|
||||
completeCallback()
|
||||
}
|
||||
})
|
||||
})
|
||||
.catch(() => { });
|
||||
}
|
||||
|
||||
const withdrawOrder = function () {
|
||||
// 取消订单
|
||||
ElMessageBox.confirm('确定要取消此订单吗?该操作不可撤销。', '提示', { type: 'warning' })
|
||||
.then(async () => {
|
||||
shopOrderApi.withdrawOrder({
|
||||
orderId: orderDetail.value.id,
|
||||
...shippingInfo.value
|
||||
}).then(function (data) {
|
||||
if (data) { // 如果出错则已经出提示了
|
||||
ElMessage.success({ message: data })
|
||||
visible.value = false
|
||||
completeCallback()
|
||||
}
|
||||
})
|
||||
})
|
||||
.catch(() => { });
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.line-height {
|
||||
line-height: 2.7em;
|
||||
}
|
||||
|
||||
.row-index {
|
||||
width: 110px;
|
||||
display: inline-block;
|
||||
}
|
||||
</style>
|
@@ -1,67 +1,63 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-card shadow="hover">
|
||||
<template #header>
|
||||
<div class="clearfix">
|
||||
<span>基础信息</span>
|
||||
</div>
|
||||
</template>
|
||||
<div class="info">
|
||||
<div class="info-image" @click="showDialog">
|
||||
<el-avatar :size="100" :src="avatarImg" />
|
||||
<span class="info-edit">
|
||||
<i class="el-icon-lx-camerafill"></i>
|
||||
</span>
|
||||
</div>
|
||||
<div class="info-name">{{ name }}</div>
|
||||
<!-- <div class="info-desc">不可能!我的代码怎么可能会有bug!</div> -->
|
||||
</div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-card shadow="hover">
|
||||
<template #header>
|
||||
<div class="clearfix">
|
||||
<span>账户编辑</span>
|
||||
</div>
|
||||
</template>
|
||||
<el-form label-width="90px">
|
||||
<el-form-item label="用户名:"> {{ name }} </el-form-item>
|
||||
<el-form-item label="旧密码:">
|
||||
<el-input type="password" v-model="form.old"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="新密码:">
|
||||
<el-input type="password" v-model="form.new"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="确认密码:">
|
||||
<el-input type="password" v-model="form.new1"></el-input>
|
||||
</el-form-item>
|
||||
<!-- <el-form-item label="个人简介:">
|
||||
<el-input v-model="form.desc"></el-input>
|
||||
</el-form-item> -->
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="onSubmit">保存</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-card>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-dialog title="裁剪图片" v-model="dialogVisible" width="600px">
|
||||
<vue-cropper ref="cropper" :src="imgSrc" :ready="cropImage" :zoom="cropImage" :cropmove="cropImage"
|
||||
style="width: 100%; height: 400px"></vue-cropper>
|
||||
<div>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-card shadow="hover">
|
||||
<template #header>
|
||||
<div class="clearfix">
|
||||
<span>基础信息</span>
|
||||
</div>
|
||||
</template>
|
||||
<div class="info">
|
||||
<div class="info-image" @click="showDialog">
|
||||
<el-avatar :size="100" :src="avatarImg" />
|
||||
<span class="info-edit">
|
||||
<i class="el-icon-lx-camerafill"></i>
|
||||
</span>
|
||||
</div>
|
||||
<div class="info-name">{{ name }}</div>
|
||||
</div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-card shadow="hover">
|
||||
<template #header>
|
||||
<div class="clearfix">
|
||||
<span>账户编辑</span>
|
||||
</div>
|
||||
</template>
|
||||
<el-form label-width="90px">
|
||||
<el-form-item label="用户名:"> {{ name }} </el-form-item>
|
||||
<el-form-item label="旧密码:">
|
||||
<el-input type="password" v-model="form.old"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="新密码:">
|
||||
<el-input type="password" v-model="form.new"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="确认密码:">
|
||||
<el-input type="password" v-model="form.new1"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="onSubmit">保存</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-card>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-dialog title="裁剪图片" v-model="dialogVisible" width="600px">
|
||||
<vue-cropper ref="cropper" :src="imgSrc" :ready="cropImage" :zoom="cropImage" :cropmove="cropImage"
|
||||
style="width: 100%; height: 400px"></vue-cropper>
|
||||
|
||||
<template #footer>
|
||||
<span class="dialog-footer">
|
||||
<el-button class="crop-demo-btn" type="primary">选择图片
|
||||
<input class="crop-input" type="file" name="image" accept="image/*" @change="setImage" />
|
||||
</el-button>
|
||||
<el-button type="primary" @click="saveAvatar">上传并保存</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
<template #footer>
|
||||
<span class="dialog-footer">
|
||||
<el-button class="crop-demo-btn" type="primary">选择图片
|
||||
<input class="crop-input" type="file" name="image" accept="image/*" @change="setImage" />
|
||||
</el-button>
|
||||
<el-button type="primary" @click="saveAvatar">上传并保存</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="user">
|
||||
@@ -70,65 +66,52 @@ import VueCropper from 'vue-cropperjs';
|
||||
import 'cropperjs/dist/cropper.css';
|
||||
import avatar from '../assets/img/img.jpg';
|
||||
import { ElMessage, ElMessageBox, ElLoading } from 'element-plus';
|
||||
import send_request from '../utils/send_request';
|
||||
import * as userApi from '../api/user';
|
||||
|
||||
const name = localStorage.getItem('ms_username');
|
||||
const user_id = localStorage.getItem('ms_user_id');
|
||||
const form = reactive({
|
||||
user_id: user_id,
|
||||
old: '',
|
||||
new: '',
|
||||
new1: '',
|
||||
desc: ''
|
||||
user_id: user_id,
|
||||
old: '',
|
||||
new: '',
|
||||
new1: '',
|
||||
desc: ''
|
||||
});
|
||||
const onSubmit = async () => {
|
||||
if (form.old == '' || form.new == '' || form.new1 == '') {
|
||||
// 弹窗
|
||||
ElMessageBox.confirm('输入为空,请检查', '提示', {
|
||||
type: 'warning'
|
||||
})
|
||||
return
|
||||
} else if (form.new != form.new1) {
|
||||
// 弹窗
|
||||
ElMessageBox.confirm('新密码2次输入的不相同', '提示', {
|
||||
type: 'warning'
|
||||
})
|
||||
return
|
||||
} else if (form.new == form.old) {
|
||||
// 弹窗
|
||||
ElMessageBox.confirm('新、旧密码相同', '提示', {
|
||||
type: 'warning'
|
||||
})
|
||||
return
|
||||
}
|
||||
if (form.old == '' || form.new == '' || form.new1 == '') {
|
||||
// 弹窗
|
||||
ElMessageBox.confirm('输入为空,请检查', '提示', {
|
||||
type: 'warning'
|
||||
})
|
||||
return
|
||||
} else if (form.new != form.new1) {
|
||||
// 弹窗
|
||||
ElMessageBox.confirm('新密码2次输入的不相同', '提示', {
|
||||
type: 'warning'
|
||||
})
|
||||
return
|
||||
} else if (form.new == form.old) {
|
||||
// 弹窗
|
||||
ElMessageBox.confirm('新、旧密码相同', '提示', {
|
||||
type: 'warning'
|
||||
})
|
||||
return
|
||||
}
|
||||
|
||||
ElMessageBox.confirm('确认要修改密码吗?', '提示', {
|
||||
type: 'warning'
|
||||
})
|
||||
.then(async () => {
|
||||
console.log("send_request v1/user/alterPSW")
|
||||
|
||||
const loading = ElLoading.service({
|
||||
lock: true,
|
||||
text: '请稍候',
|
||||
background: 'rgba(0, 0, 0, 0.7)',
|
||||
});
|
||||
await send_request('v1/user/alterPSW', "POST", {
|
||||
"userId": form.user_id,
|
||||
"oldPSW": form.old,
|
||||
"newPSW": form.new
|
||||
}, (data: any) => {
|
||||
console.log(data);
|
||||
ElMessage.success('删除成功');
|
||||
// tableData.value.splice(index, 1);
|
||||
})
|
||||
loading.close();
|
||||
|
||||
})
|
||||
.catch(() => {
|
||||
ElMessage.success('删除失败');
|
||||
});
|
||||
return;
|
||||
ElMessageBox.confirm('确认要修改密码吗?', '提示', {
|
||||
type: 'warning'
|
||||
}).then(async () => {
|
||||
userApi.updatePwd({
|
||||
oldpwd: form.old,
|
||||
newpwd: form.new,
|
||||
}).then((data) => {
|
||||
data && ElMessage.success(data);
|
||||
})
|
||||
}).catch((err) => {
|
||||
ElMessage.success('删除失败');
|
||||
console.log("err", err)
|
||||
});
|
||||
return;
|
||||
|
||||
};
|
||||
|
||||
@@ -139,92 +122,92 @@ const dialogVisible = ref(false);
|
||||
const cropper: any = ref();
|
||||
|
||||
const showDialog = () => {
|
||||
dialogVisible.value = true;
|
||||
imgSrc.value = avatarImg.value;
|
||||
dialogVisible.value = true;
|
||||
imgSrc.value = avatarImg.value;
|
||||
};
|
||||
|
||||
const setImage = (e: any) => {
|
||||
const file = e.target.files[0];
|
||||
if (!file.type.includes('image/')) {
|
||||
return;
|
||||
}
|
||||
const reader = new FileReader();
|
||||
reader.onload = (event: any) => {
|
||||
dialogVisible.value = true;
|
||||
imgSrc.value = event.target.result;
|
||||
cropper.value && cropper.value.replace(event.target.result);
|
||||
};
|
||||
reader.readAsDataURL(file);
|
||||
const file = e.target.files[0];
|
||||
if (!file.type.includes('image/')) {
|
||||
return;
|
||||
}
|
||||
const reader = new FileReader();
|
||||
reader.onload = (event: any) => {
|
||||
dialogVisible.value = true;
|
||||
imgSrc.value = event.target.result;
|
||||
cropper.value && cropper.value.replace(event.target.result);
|
||||
};
|
||||
reader.readAsDataURL(file);
|
||||
};
|
||||
|
||||
const cropImage = () => {
|
||||
cropImg.value = cropper.value.getCroppedCanvas().toDataURL();
|
||||
cropImg.value = cropper.value.getCroppedCanvas().toDataURL();
|
||||
};
|
||||
|
||||
const saveAvatar = () => {
|
||||
avatarImg.value = cropImg.value;
|
||||
dialogVisible.value = false;
|
||||
avatarImg.value = cropImg.value;
|
||||
dialogVisible.value = false;
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.info {
|
||||
text-align: center;
|
||||
padding: 35px 0;
|
||||
text-align: center;
|
||||
padding: 35px 0;
|
||||
}
|
||||
|
||||
.info-image {
|
||||
position: relative;
|
||||
margin: auto;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
background: #f8f8f8;
|
||||
border: 1px solid #eee;
|
||||
border-radius: 50px;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
margin: auto;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
background: #f8f8f8;
|
||||
border: 1px solid #eee;
|
||||
border-radius: 50px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.info-edit {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
opacity: 0;
|
||||
transition: opacity 0.3s ease;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
opacity: 0;
|
||||
transition: opacity 0.3s ease;
|
||||
}
|
||||
|
||||
.info-edit i {
|
||||
color: #eee;
|
||||
font-size: 25px;
|
||||
color: #eee;
|
||||
font-size: 25px;
|
||||
}
|
||||
|
||||
.info-image:hover .info-edit {
|
||||
opacity: 1;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.info-name {
|
||||
margin: 15px 0 10px;
|
||||
font-size: 24px;
|
||||
font-weight: 500;
|
||||
color: #262626;
|
||||
margin: 15px 0 10px;
|
||||
font-size: 24px;
|
||||
font-weight: 500;
|
||||
color: #262626;
|
||||
}
|
||||
|
||||
.crop-demo-btn {
|
||||
position: relative;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.crop-input {
|
||||
position: absolute;
|
||||
width: 100px;
|
||||
height: 40px;
|
||||
left: 0;
|
||||
top: 0;
|
||||
opacity: 0;
|
||||
cursor: pointer;
|
||||
position: absolute;
|
||||
width: 100px;
|
||||
height: 40px;
|
||||
left: 0;
|
||||
top: 0;
|
||||
opacity: 0;
|
||||
cursor: pointer;
|
||||
}
|
||||
</style>
|
||||
|
Reference in New Issue
Block a user