Compare commits
3 Commits
9fbe6af81c
...
748b0784a0
| Author | SHA1 | Date |
|---|---|---|
 cxy
|
748b0784a0 | 8 months ago |
|
cxy
|
74dccc232b | 8 months ago |
|
cxy
|
c3036268dd | 8 months ago |
|
After Width: | Height: | Size: 106 KiB |
|
After Width: | Height: | Size: 106 KiB |
|
After Width: | Height: | Size: 86 KiB |
|
After Width: | Height: | Size: 101 KiB |
|
After Width: | Height: | Size: 97 KiB |
|
After Width: | Height: | Size: 121 KiB |
|
After Width: | Height: | Size: 107 KiB |
|
After Width: | Height: | Size: 96 KiB |
|
After Width: | Height: | Size: 106 KiB |
|
After Width: | Height: | Size: 86 KiB |
|
After Width: | Height: | Size: 104 KiB |
|
After Width: | Height: | Size: 118 KiB |
@ -1,98 +0,0 @@
|
|||||||
<script setup>
|
|
||||||
import {Plus, Upload} from '@element-plus/icons-vue'
|
|
||||||
import {ref} from 'vue'
|
|
||||||
import {useUserInfoStore} from "@/stores/userInfo.js";
|
|
||||||
import {useTokenStore} from "@/stores/token";
|
|
||||||
import {ElMessage} from "element-plus";
|
|
||||||
import {userAvatarUpdateService} from "@/api/user";
|
|
||||||
|
|
||||||
const uploadRef = ref()
|
|
||||||
|
|
||||||
const userInfoStore = useUserInfoStore();
|
|
||||||
|
|
||||||
//用户头像地址
|
|
||||||
const imgUrl = ref(userInfoStore.userInfo.userPic)
|
|
||||||
|
|
||||||
const tokenStore = useTokenStore();
|
|
||||||
const uploadSuccess = (result) => {
|
|
||||||
imgUrl.value = result.data;
|
|
||||||
ElMessage.success("图片上传成功")
|
|
||||||
}
|
|
||||||
|
|
||||||
const updateAvatar = async () => {
|
|
||||||
await userAvatarUpdateService(imgUrl.value)
|
|
||||||
ElMessage.success("修改成功")
|
|
||||||
|
|
||||||
userInfoStore.setUserInfo({
|
|
||||||
...userInfoStore.userInfo,
|
|
||||||
userPic: imgUrl.value
|
|
||||||
})
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<el-card class="page-container">
|
|
||||||
<template #header>
|
|
||||||
<div class="header">
|
|
||||||
<span>更换头像</span>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
<el-row>
|
|
||||||
<el-col :span="12">
|
|
||||||
<el-upload
|
|
||||||
ref="uploadRef"
|
|
||||||
class="avatar-uploader"
|
|
||||||
:show-file-list="false"
|
|
||||||
:auto-upload="true"
|
|
||||||
action="/api/upload"
|
|
||||||
name="file"
|
|
||||||
:headers="{'Authorization':tokenStore.token}"
|
|
||||||
:on-success="uploadSuccess"
|
|
||||||
>
|
|
||||||
<el-image v-if="imgUrl" :src="imgUrl" class="avatar"/>
|
|
||||||
<el-image v-else src="avatar" width="278"/>
|
|
||||||
</el-upload>
|
|
||||||
<br/>
|
|
||||||
<el-button type="primary" :icon="Plus" size="large" @click="uploadRef.$el.querySelector('input').click()">
|
|
||||||
选择图片
|
|
||||||
</el-button>
|
|
||||||
<el-button type="success" :icon="Upload" size="large" @click="updateAvatar">
|
|
||||||
上传头像
|
|
||||||
</el-button>
|
|
||||||
</el-col>
|
|
||||||
</el-row>
|
|
||||||
</el-card>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
|
||||||
.avatar-uploader {
|
|
||||||
:deep {
|
|
||||||
.avatar {
|
|
||||||
width: 278px;
|
|
||||||
height: 278px;
|
|
||||||
display: block;
|
|
||||||
}
|
|
||||||
|
|
||||||
.el-upload {
|
|
||||||
border: 1px dashed var(--el-border-color);
|
|
||||||
border-radius: 6px;
|
|
||||||
cursor: pointer;
|
|
||||||
position: relative;
|
|
||||||
overflow: hidden;
|
|
||||||
transition: var(--el-transition-duration-fast);
|
|
||||||
}
|
|
||||||
|
|
||||||
.el-upload:hover {
|
|
||||||
border-color: var(--el-color-primary);
|
|
||||||
}
|
|
||||||
|
|
||||||
.el-icon.avatar-uploader-icon {
|
|
||||||
font-size: 28px;
|
|
||||||
color: #8c939d;
|
|
||||||
width: 278px;
|
|
||||||
height: 278px;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,80 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div class="send-package">
|
|
||||||
<el-form ref="sendForm" :model="sendForm" label-width="120px">
|
|
||||||
<el-row :gutter="20">
|
|
||||||
<el-col :span="12">
|
|
||||||
<el-form-item label="寄件人姓名">
|
|
||||||
<el-input v-model="sendForm.senderName"></el-input>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="寄件人电话">
|
|
||||||
<el-input v-model="sendForm.senderPhone"></el-input>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="寄件人地址">
|
|
||||||
<el-input type="textarea" v-model="sendForm.senderAddress"></el-input>
|
|
||||||
</el-form-item>
|
|
||||||
</el-col>
|
|
||||||
<el-col :span="12">
|
|
||||||
<el-form-item label="收件人姓名">
|
|
||||||
<el-input v-model="sendForm.name"></el-input>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="收件人电话">
|
|
||||||
<el-input v-model="sendForm.phone"></el-input>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="收件人地址">
|
|
||||||
<el-input type="textarea" v-model="sendForm.address"></el-input>
|
|
||||||
</el-form-item>
|
|
||||||
</el-col>
|
|
||||||
</el-row>
|
|
||||||
<el-form-item label="物品描述">
|
|
||||||
<el-input type="textarea" v-model="sendForm.description"></el-input>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item>
|
|
||||||
<el-button type="primary" @click="submitForm">提交</el-button>
|
|
||||||
<el-button @click="resetForm">重置</el-button>
|
|
||||||
</el-form-item>
|
|
||||||
</el-form>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
import { ref } from 'vue';
|
|
||||||
import { ElForm, ElFormItem, ElInput, ElButton, ElMessage, ElRow, ElCol } from 'element-plus';
|
|
||||||
|
|
||||||
const sendForm = ref({
|
|
||||||
name: '',
|
|
||||||
phone: '',
|
|
||||||
address: '',
|
|
||||||
senderName: '',
|
|
||||||
senderPhone: '',
|
|
||||||
senderAddress: '',
|
|
||||||
description: ''
|
|
||||||
});
|
|
||||||
|
|
||||||
const submitForm = () => {
|
|
||||||
// 在这里添加提交表单的逻辑
|
|
||||||
ElMessage.success('快递信息已提交');
|
|
||||||
};
|
|
||||||
|
|
||||||
const resetForm = () => {
|
|
||||||
// 重置表单
|
|
||||||
sendForm.value = {
|
|
||||||
name: '',
|
|
||||||
phone: '',
|
|
||||||
address: '',
|
|
||||||
senderName: '',
|
|
||||||
senderPhone: '',
|
|
||||||
senderAddress: '',
|
|
||||||
description: ''
|
|
||||||
};
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style scoped>
|
|
||||||
.send-package {
|
|
||||||
max-width: 800px;
|
|
||||||
margin: 20px auto;
|
|
||||||
padding: 20px;
|
|
||||||
border: 1px solid #ebeef5;
|
|
||||||
border-radius: 4px;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,48 +0,0 @@
|
|||||||
import {
|
|
||||||
createRouter,
|
|
||||||
createWebHashHistory
|
|
||||||
} from "vue-router"
|
|
||||||
|
|
||||||
import {storeToRefs} from "pinia"
|
|
||||||
|
|
||||||
const router = createRouter({
|
|
||||||
history: createWebHashHistory(),
|
|
||||||
routes: [
|
|
||||||
{
|
|
||||||
path: '/',
|
|
||||||
redirect: 'Home'
|
|
||||||
},
|
|
||||||
{
|
|
||||||
path: '/home',
|
|
||||||
name: 'Home',
|
|
||||||
component: () => import('./View/Home.vue')
|
|
||||||
},
|
|
||||||
{
|
|
||||||
path: '/login',
|
|
||||||
name: 'Login',
|
|
||||||
component: () => import('./View/Login.vue'),
|
|
||||||
},
|
|
||||||
{
|
|
||||||
path: '/user',
|
|
||||||
name: 'User',
|
|
||||||
component: () => import('./View/user/Index.vue'),
|
|
||||||
redirect: "myInfo",
|
|
||||||
children: [
|
|
||||||
{
|
|
||||||
path: '/myInfo',
|
|
||||||
component: () => import('./View/user/MyInfo.vue')
|
|
||||||
},
|
|
||||||
{
|
|
||||||
path: '/expressList',
|
|
||||||
component: () => import('./View/express/ExpressList.vue')
|
|
||||||
},
|
|
||||||
{
|
|
||||||
path: '/expressForm',
|
|
||||||
component: () => import('./View/express/ExpressForm.vue')
|
|
||||||
}
|
|
||||||
]
|
|
||||||
},
|
|
||||||
]
|
|
||||||
})
|
|
||||||
|
|
||||||
export default router
|
|
||||||
@ -0,0 +1,29 @@
|
|||||||
|
import {defineStore} from 'pinia'
|
||||||
|
|
||||||
|
export const expressStore = defineStore('express', {
|
||||||
|
state: () => {
|
||||||
|
return {
|
||||||
|
expressList: [],
|
||||||
|
}
|
||||||
|
},
|
||||||
|
getters: {},
|
||||||
|
actions: {
|
||||||
|
add(item) {
|
||||||
|
this.expressList.push(item)
|
||||||
|
},
|
||||||
|
modify(item, index) {
|
||||||
|
this.expressList[index] = item
|
||||||
|
},
|
||||||
|
remove(index) {
|
||||||
|
this.expressList.splice(index, 1)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
persist: {
|
||||||
|
enabled: true,
|
||||||
|
strategies: [{
|
||||||
|
key: 'express',
|
||||||
|
storage: localStorage,
|
||||||
|
path: ['express']
|
||||||
|
}],
|
||||||
|
}
|
||||||
|
})
|
||||||