change:代码改造

This commit is contained in:
tiantang 2023-08-02 23:39:20 +08:00
parent 8174af4413
commit e6e8433a20
18 changed files with 317 additions and 161 deletions

View File

@ -23,6 +23,7 @@ export function register(data: object) {
data,
});
}
// 登出
export function logout(token: string) {
return request2({
url: "/logout",
@ -32,6 +33,7 @@ export function logout(token: string) {
}
});
}
// 重置密码
export function resetPassword(data: object) {
return request2({
url: "/password/reset",
@ -39,9 +41,23 @@ export function resetPassword(data: object) {
data,
});
}
export function userInfo(userid: number) {
// 用户信息
export function userInfo() {
return request2({
url: `/user/${userid}`,
url: `/UserInfo`,
method: "get",
});
}
// 验证码
export function loginCode() {
return request2({
url: `/code`,
method: "get",
});
}
export function userTeam() {
return request2({
url: `/team`,
method: "get",
});
}

View File

@ -0,0 +1,6 @@
export const phoneReg = /^1((34[0-8])|(8\d{2})|(([35][0-35-9]|4[579]|66|7[35678]|9[1389])\d{1}))\d{7}$/
export const emilReg = /^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+((\.[a-zA-Z0-9_-]{2,3}){1,2})$/
export default {
phoneReg,
emilReg
}

View File

@ -312,7 +312,7 @@ export default defineComponent({
}
}
.tags-view-container {
height: 55px;
//height: 55px;
align-items: self-end;
flex: 1;
width: 100%;

View File

@ -39,4 +39,3 @@ export default createStore<RootState>({
strict: debug,
plugins: debug ? [createLogger(), persistent] : [persistent],
});
console.log(modules.user.token)

View File

@ -68,7 +68,7 @@ const actions = {
// get user info after user logined
getInfo({ commit,state }: ActionContext<userState, userState>, params: any) {
return new Promise((resolve, reject) => {
userInfo(params.user_info).then((res) => {
userInfo().then((res) => {
commit("infoChange", res.data);
resolve(res.data);
});

View File

@ -6,7 +6,7 @@ import axios, {
} from "axios";
import store from "@/store";
import { ElMessage } from "element-plus";
const whiteList:any[] = ['/get/imgCode']
const whiteList:any[] = ['/get/imgCode','/code']
const service: AxiosInstance = axios.create({
baseURL: "/workbench",
timeout: 10000,

View File

@ -4,7 +4,6 @@
v-model="Propsvisible"
title="创建团队"
width="30%"
:before-close="handleClose"
@close="close"
>
<el-form ref="formRef" :model="form" :rules="rules" label-width="120px">
@ -68,18 +67,8 @@ export default defineComponent({
emit("close", val);
},
});
const handleClose = (done: () => void) => {
ElMessageBox.confirm("你确定要离开吗?")
.then(() => {
done();
})
.catch(() => {
// catch error
});
};
return {
close,
handleClose,
Propsvisible,
form,
rules,

View File

@ -0,0 +1,83 @@
<template>
<div>
<el-dialog
v-model="Propsvisible"
title="加入团队"
width="30%"
@close="close"
>
<el-form ref="formRef" :model="form" :rules="rules" label-width="120px">
<el-form-item label="团队id" prop="name">
<el-input v-model="form.name"></el-input>
</el-form-item>
</el-form>
<template #footer>
<span class="dialog-footer">
<el-button @click="close">取消</el-button>
<el-button type="primary" @click="entry">确认</el-button>
</span>
</template>
</el-dialog>
</div>
</template>
<script lang="ts">
import { defineComponent, reactive, ref, computed, unref } from "vue";
import type { ElForm } from "element-plus";
import { ElMessageBox } from "element-plus";
export default defineComponent({
props: ["visible"],
setup(props, { emit }) {
const formRef = ref<InstanceType<typeof ElForm>>();
const form = reactive({
name: "",
});
const rules = reactive({
name: [
{
required: true,
message: "不能为空",
trigger: "blur",
},
{
min: 3,
max: 5,
message: "Length should be 3 to 5",
trigger: "blur",
},
],
});
const close = () => {
emit("close", false);
};
const entry = () => {
const formWrap = unref<any>(formRef);
if (!formWrap) return;
//
formWrap.validate((valid: boolean) => {
console.log(valid);
if (valid) {
close();
}
});
};
const Propsvisible = computed({
get: () => props.visible,
set: (val) => {
emit("close", val);
},
});
return {
close,
Propsvisible,
form,
rules,
entry,
formRef
};
},
});
</script>
<style lang="scss" scoped>
</style>

View File

@ -4,9 +4,14 @@
<template #header>
<div class="team-main">
<span >我的团队</span>
<el-button class="button" type="primary" text="text" @click="create(true)">
创建/加入团队
<div>
<el-button style="padding: 0;height: 20px" type="primary" text="text" @click="create(true)">
创建团队
</el-button>
<el-button style="padding: 0;height: 20px" type="primary" text="text" @click="create(true)">
加入团队
</el-button>
</div>
</div>
</template>
<div class="team-teams">
@ -28,85 +33,49 @@
</div>
</el-card>
<dialogCreate :visible="createShoW.Show" @close="createShowClose" />
<dialogJoin :visible="joinShoW.Show" @close="joinShowClose" />
</div>
</template>
<script lang="ts">
import { defineComponent, reactive, ref } from "vue";
import {defineComponent, onMounted, reactive, ref} from "vue";
import dialogCreate from "./dialog-create.vue";
import dialogJoin from "./dialog-join.vue";
import {userTeam} from "@/api/work";
export default defineComponent({
components: { dialogCreate },
components: { dialogCreate,dialogJoin },
setup() {
const teamList = reactive({
teamList: [
{
img: "",
name: "梦梦",
},
{
img: "",
name: "梦梦",
},
{
img: "",
name: "梦梦",
},
{
img: "",
name: "梦梦",
},
{
img: "",
name: "梦梦",
},
{
img: "",
name: "梦梦",
},
{
img: "",
name: "梦梦",
},
{
img: "",
name: "梦梦",
},
{
img: "",
name: "梦梦",
},
{
img: "",
name: "梦梦",
},
{
img: "",
name: "梦梦",
},
{
img: "",
name: "梦梦",
},
{
img: "",
name: "梦梦",
},
],
teamList: [],
});
onMounted(()=>{
userTeam().then(res=>{
teamList.teamList = res.data
})
})
const createShoW = reactive({
Show: false,
});
const joinShoW = reactive({
Show: false,
});
const create = (Show: boolean) => {
createShoW.Show = Show;
};
const createShowClose = (Show: boolean = false) => {
create(Show);
};
const joinShowClose = (Show: boolean = false) => {
joinShoW.Show = Show
};
return {
teamList,
create,
createShowClose,
joinShowClose,
createShoW,
joinShoW
};
},
});

View File

@ -2,7 +2,7 @@
<div class="userProject">
<div class="userProject-user">
<div>头像</div>
<div>早安工具人</div>
<div>早安,{{ store.state.user.info.nickname }}</div>
</div>
<div class="userProject-project">
<div>
@ -34,8 +34,17 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue'
export default defineComponent({})
import {defineComponent, onMounted} from 'vue'
import {useStore} from "vuex";
import {userTeam} from "@/api/work";
export default defineComponent({
setup(){
const store = useStore();
return {
store
}
}
})
</script>
<style lang="scss" scoped>

View File

@ -25,14 +25,14 @@
</div>
</el-form-item>
<el-form-item label="">
<div class="">
<div class="" style="width:100%">
<!-- <el-button type="primary" @click="onSubmit">登录</el-button> -->
<div v-show="!islogin">
<el-checkbox v-model="form.agreement" />
我已阅读并同意铜壶协议和隐私条款
</div>
<div class="form-center">
<div v-if="islogin!" class="submit-btn" @click="onSubmit">
<div v-if="islogin" class="submit-btn" @click="onSubmit">
注册
</div>
<div v-else class="submit-btn" @click="onSubmit">
@ -202,7 +202,6 @@ export default defineComponent({
},
mounted() {
clearInterval(time)
console.log(localStorage.getItem('endTime'))
},
onBeforeUnmount() {
clearInterval(time)
@ -273,4 +272,10 @@ img {
cursor: pointer;
font-size: 12px;
}
.sendCode{
text-align: center;
color: #19abdb;
cursor: pointer;
font-size: 12px;
}
</style>

View File

@ -25,13 +25,13 @@
</div>
</el-form-item>
<el-form-item label="">
<div class="">
<div class="" style="width: 100%">
<div v-show="!islogin">
<el-checkbox v-model="form.agreement" />
我已阅读并同意铜壶协议和隐私条款
</div>
<div class="form-center">
<div v-if="islogin!" class="submit-btn" @click="onSubmit">
<div v-if="islogin" class="submit-btn" @click="onSubmit">
注册
</div>
<div v-else class="submit-btn" @click="onSubmit">
@ -55,10 +55,10 @@
<script lang="ts">
import {reactive, defineComponent, toRefs, onBeforeMount, ref, onUnmounted, unref} from 'vue'
import verify from './verify.png'
import {types} from "sass";
import {register, sendCode} from "@/api/work";
import {ElForm, ElMessage} from "element-plus";
import {registerUserApi} from "@/api/user";
import {phoneReg} from "@/config/constant";
let time:number = -9999
export default defineComponent({
emits:["setMssages","setState"],
@ -86,6 +86,9 @@ export default defineComponent({
if (!value) {
return callback(new Error('手机号不能为空'))
}
if(!phoneReg.test(value)){
return callback(new Error('手机号格式不对'))
}
callback()
},
trigger: 'blur'
@ -95,8 +98,8 @@ export default defineComponent({
{
// required: true,
validator: (rule: any, value: any, callback: any) => {
if (!value||value.length<4) {
return callback(new Error('验证码不能为空'))
if (!value||value.length<=4) {
return callback(new Error('验证码格式不对'))
}
callback()
},
@ -129,7 +132,6 @@ export default defineComponent({
// register({}).then(res=>{
//
// }))
console.log(11111111)
}
})
@ -156,10 +158,10 @@ export default defineComponent({
//
const sendRequest = () => {
//
if(form.phone.length<13){
if(!phoneReg.test(form.phone)){
ElMessage({
showClose: true,
message: '手机号不能为空',
message: '手机号格式不对',
type: 'error',
duration:3000
})
@ -198,7 +200,6 @@ export default defineComponent({
},
mounted() {
clearInterval(time)
console.log(localStorage.getItem('endTime'))
},
onBeforeUnmount() {
clearInterval(time)
@ -212,8 +213,6 @@ export default defineComponent({
transition: all 1s;
}
.submit-btn {
min-width: 50px;
width: 50px;
outline: none;
margin: 0 auto;
padding: 12px 30px;
@ -271,4 +270,10 @@ img {
cursor: pointer;
font-size: 12px;
}
.sendCode{
text-align: center;
color: #19abdb;
cursor: pointer;
font-size: 12px;
}
</style>

View File

@ -10,16 +10,16 @@
:model="form"
label-width="0px"
>
<el-form-item style="margin-bottom: 10px" class="app-form-center" label-width="80px" label="账号">
<el-form-item class="app-form-center" prop="name" label-width="80px" label="账号">
<el-input
v-model="form.name"
size="large"
type="text"
maxlength="50"
placeholder="请输入您的邮箱"
placeholder="邮箱/账号/手机号登录"
/>
</el-form-item>
<el-form-item style="margin-bottom: 10px" class="app-form-center" label="密码" label-width="80px">
<el-form-item class="app-form-center" prop="password" label="密码" label-width="80px">
<el-input
v-model="form.password"
placeholder="请输入您的密码"
@ -30,9 +30,9 @@
</el-form-item>
<el-form-item
label="验证码"
style="margin-bottom: 10px"
class="app-form-center"
label-width="80px"
prop="verify"
>
<div class="verify">
<div>
@ -42,10 +42,10 @@
size="large"
/>
</div>
<div>
<img src="/api/get/imgCode" height="30px" alt="">
<div @click="getCode" class="CodeImg">
<img style="width: 100px;" :src="'data:image/gif;base64,'+imageCode" alt="">
</div>
<div>看不清</div>
<div class="checkCode" @click="getCode">看不清</div>
</div>
</el-form-item>
<div class="submit-btn" @click="onSubmit">
@ -65,15 +65,16 @@
</template>
<script lang="ts">
import {reactive, defineComponent, toRefs, onBeforeMount, ref, onUnmounted, unref} from 'vue'
import {reactive, defineComponent, toRefs, onBeforeMount, ref, onUnmounted, unref, onMounted} from 'vue'
import verify from './verify.png'
import {types} from "sass";
import {register, sendCode} from "@/api/work";
import {loginCode, register, sendCode} from "@/api/work";
import {ElForm, ElMessage} from "element-plus";
import {registerUserApi} from "@/api/user";
import store from "@/store";
import router, {addRoutes} from "@/router";
import {RouteLocationRaw, useRoute} from "vue-router";
import {emilReg, phoneReg} from "@/config/constant";
let time:number = -9999
export default defineComponent({
emits:["setMssages","setState"],
@ -85,6 +86,8 @@ export default defineComponent({
},
setup() {
const route = useRoute();
const imageCode = ref("")
const type = ref("user")
const loginRuleFormRef = ref<InstanceType<typeof ElForm>>()
//
const loginRules = reactive({
@ -118,14 +121,19 @@ export default defineComponent({
trigger: 'blur'
}
],
// verify: [
// {
// required: true,
// trigger: 'blur',
// message: ''
// }
// ]
verify: [
{
required: true,
trigger: 'blur',
message: '请填写验证码'
}
]
})
const getCode = ()=>{
loginCode().then((res:any)=>{
imageCode.value = res
})
}
//
const form = reactive({
name: 'tiantang',
@ -135,16 +143,22 @@ export default defineComponent({
})
const onSubmit = () => {
const formWrap = unref<any>(loginRuleFormRef)
console.log(2)
if (!formWrap) return
console.log(1)
if(emilReg.test(form.name)){
type.value = 'email'
}
else if(phoneReg.test(form.name)){
type.value = 'sms'
}else{
type.value = 'user'
}
//
formWrap.validate((valid: boolean) => {
console.log(valid)
if (valid) {
store
.dispatch("user/login", {
type: "user",
type: type.value,
password: form.password,
name: form.name,
// code: formSubmit.register.code
@ -164,16 +178,20 @@ export default defineComponent({
}
})
}
onMounted(()=>{
getCode()
})
return {
loginRuleFormRef,
form,
loginRules,
onSubmit
onSubmit,
imageCode,
getCode
}
},
mounted() {
clearInterval(time)
console.log(localStorage.getItem('endTime'))
},
onBeforeUnmount() {
clearInterval(time)
@ -188,8 +206,6 @@ export default defineComponent({
}
.submit-btn {
cursor: pointer;
min-width: 50px;
width: 50px;
outline: none;
margin: 0 auto;
padding: 12px 30px;
@ -257,4 +273,9 @@ img {
cursor: pointer;
font-size: 12px;
}
.checkCode,.CodeImg{
color: #19abdb;
cursor: pointer;
font-size: 14px;
}
</style>

View File

@ -11,7 +11,6 @@
label-width="0px"
>
<el-form-item
style="margin-bottom: 10px"
prop="nickname"
class="app-form-center"
label-width="80px"
@ -22,12 +21,10 @@
size="large"
type="text"
maxlength="50"
placeholder="请输入您的昵称"
/>
</el-form-item>
<el-form-item
style="margin-bottom: 10px"
prop="name"
class="app-form-center"
label-width="80px"
@ -42,7 +39,6 @@
/>
</el-form-item>
<el-form-item
style="margin-bottom: 10px"
prop="email"
class="app-form-center"
label-width="80px"
@ -57,7 +53,6 @@
/>
</el-form-item>
<el-form-item
style="margin-bottom: 10px"
prop="password"
class="app-form-center"
label-width="80px"
@ -72,7 +67,6 @@
/>
</el-form-item>
<el-form-item
style="margin-bottom: 10px"
prop="entryPassword"
class="app-form-center"
label-width="80px"
@ -89,7 +83,6 @@
<el-form-item
label-width="80px"
label="验证码"
style="margin-bottom: 10px"
class="app-form-center"
prop="verify"
@ -103,10 +96,10 @@
autocomplete="off"
/>
</div>
<div>
<img src="/api/get/imgCode" height="30px" alt="">
<div @click="getCode" class="CodeImg">
<img style="width: 100px;" :src="'data:image/gif;base64,'+imageCode" alt="">
</div>
<div>换一张</div>
<div class="checkCode" @click="getCode">看不清</div>
</div>
</el-form-item>
<el-form-item label="" prop="agreement">
@ -132,12 +125,14 @@
</template>
<script lang="ts">
import {reactive, defineComponent, toRefs, onBeforeMount, ref, onUnmounted, unref, getCurrentInstance} from 'vue'
import {reactive, defineComponent, toRefs, onBeforeMount, ref, onUnmounted, unref, getCurrentInstance,onMounted} from 'vue'
import verify from './verify.png'
import {types} from "sass";
import {register, sendCode} from "@/api/work";
import {register, sendCode,loginCode} from "@/api/work";
import {ElForm, ElMessage} from "element-plus";
import {registerUserApi} from "@/api/user";
let time: number = -9999
export default defineComponent({
emits: ["setState", "setMssages"],
@ -150,42 +145,71 @@ export default defineComponent({
setup(props, {emit}) {
const {proxy}: any = getCurrentInstance()
const registerRuleFormRef = ref<InstanceType<typeof ElForm>>()
const imageCode = ref("")
const onRegister = () => {
if (!register.agreement) {
proxy.$message.error('请先勾选协议', 2000)
ElMessage({
duration:2000,
showClose: true,
message: '请先勾选协议',
type: 'error',
})
return
}
const formWrap = unref<any>(registerRuleFormRef)
if (!formWrap) return
//
formWrap.validate((valid: boolean) => {
console.log(valid)
if (valid) {
registerUserApi({
password_1: register.password,
password_2: register.entryPassword,
email: register.email,
agree: register.agreement
agree: register.agreement,
type:"email"
}).then((res: any) => {
console.log(res)
})
}
})
}
const getCode = ()=>{
loginCode().then((res:any)=>{
imageCode.value = res
})
}
//
const registerRules = reactive({
email: [
// { required: true, message: '', trigger: 'blur' },
// email: [
// // { required: true, message: '', trigger: 'blur' },
// {
// trigger: 'blur',
// validator: (rule: any, value: any, callback: any) => {
// console.log(rule, value, callback)
//
// if (!value) {
// return callback(new Error('email'))
// }
// callback()
// }
// }
// ],
name: [
{ required: true, message: '用户名不能为空', trigger: 'blur' },
{
trigger: 'blur',
validator: (rule: any, value: any, callback: any) => {
console.log(rule, value, callback)
if (!value) {
return callback(new Error('请填写您的email'))
}
callback()
min: 8,
max: 20,
message: '用户名在8个字符到20个字符之间',
}
],
nickname: [
{ required: true, message: '昵称不能为空', trigger: 'blur' },
{
trigger: 'blur',
min: 2,
max: 20,
message: '昵称在8个字符到20个字符之间',
}
],
password: [
@ -202,8 +226,11 @@ export default defineComponent({
],
entryPassword: [
{
// required: true,
required: true,
validator: (rule: any, value: any, callback: any) => {
if(value===""||value===undefined){
return callback(new Error('确认密码不能为空'))
}
if (value !== register.password) {
return callback(new Error('两次密码不一致'))
}
@ -230,16 +257,20 @@ export default defineComponent({
verify: '',
imgVerify: null
})
onMounted(()=>{
getCode()
})
return {
register,
registerRuleFormRef,
registerRules,
onRegister
onRegister,
imageCode,
getCode
}
},
mounted() {
clearInterval(time)
console.log(localStorage.getItem('endTime'))
},
onBeforeUnmount() {
clearInterval(time)
@ -252,6 +283,7 @@ export default defineComponent({
width: 360px;
transition: all 1s;
}
.submit-btn {
outline: none;
margin: 0 auto;
@ -262,13 +294,16 @@ export default defineComponent({
color: #fff;
background-color: var(--system-primary-color);
border: none;
cursor: pointer;
&:hover {
background-color: var(--system-primary-text-color);
}
}
.form-center {
text-align: center;
}
.verify {
width: 100%;
text-align: left;
@ -276,38 +311,51 @@ export default defineComponent({
> div {
display: inline-block;
}
> div:first-child {
width: 80px;
}
> div:nth-child(2) {
margin-left: 10px;
vertical-align: middle;
}
> div:nth-child(3) {
margin-left: 5px;
}
}
img {
width: 100%;
display: block;
transition: transform 0.9s ease-in-out;
transition-delay: 0.5s;
}
.Short-flex {
display: flex;
justify-content: space-between;
> span {
color: #19abdb;
cursor: pointer;
}
}
.el-form-item {
align-items: center;
}
.register {
text-align: center;
color: #19abdb;
cursor: pointer;
font-size: 12px;
}
.checkCode,.CodeImg{
color: #19abdb;
cursor: pointer;
font-size: 14px;
}
</style>

View File

@ -51,5 +51,5 @@ registerMicroApps(apps, {
}
]
})
// setDefaultMountApp('/base')
setDefaultMountApp('/base')
start()

View File

@ -11,14 +11,14 @@ const microApps = [
{
name: 'base',
title: '工作台',
title: '主平台',
entry: process.env.VUE_APP_SUB_BASE,
container:"#subapp-viewport",
activeRule: '/base'
},
{
name: 'workbench',
title: '工作台2',
title: '工作台',
entry: process.env.VUE_APP_SUB_WORKBENCH,
container:"#subapp-viewport",
activeRule: '/workbench'

View File

@ -32,11 +32,17 @@ module.exports = {
// "^/mock": "/mock"
}
},
// 代理配置
// 接口代理配置
'/workbench': {
target: 'http://121.43.42.180:13777/',
changeOrigin: true,
rewrite: path => path.replace(/^\/workbench/, '/api')
},
// 静态文件代理配置
'/base': {
target: 'http://127.0.0.1:3000/',
changeOrigin: true,
rewrite: path => path.replace(/^\/base/, '/base')
}
}
},

View File

@ -2,7 +2,7 @@
<div class="userProject">
<div class="userProject-user">
<div>头像</div>
<div>早安工具人</div>
<div>早安,</div>
</div>
<div class="userProject-project">
<div>