修改登录页样式公海数据 个人信息默认图
This commit is contained in:
@@ -36,8 +36,16 @@
|
|||||||
<div class="form">
|
<div class="form">
|
||||||
<!-- 登录方式切换 tab -->
|
<!-- 登录方式切换 tab -->
|
||||||
<div class="login-type-tabs">
|
<div class="login-type-tabs">
|
||||||
<span :class="{active: activeLoginType === 'password'}" @click="activeLoginType = 'password'">账号密码登录</span>
|
<span
|
||||||
<span :class="{active: activeLoginType === 'qrcode'}" @click="activeLoginType = 'qrcode'">飞书登录</span>
|
:class="{ active: activeLoginType === 'password' }"
|
||||||
|
@click="activeLoginType = 'password'"
|
||||||
|
>账号密码登录</span
|
||||||
|
>
|
||||||
|
<span
|
||||||
|
:class="{ active: activeLoginType === 'qrcode' }"
|
||||||
|
@click="activeLoginType = 'qrcode'"
|
||||||
|
>飞书登录</span
|
||||||
|
>
|
||||||
</div>
|
</div>
|
||||||
<div v-if="activeLoginType === 'password'">
|
<div v-if="activeLoginType === 'password'">
|
||||||
<ElForm
|
<ElForm
|
||||||
@@ -48,7 +56,10 @@
|
|||||||
style="margin-top: 25px"
|
style="margin-top: 25px"
|
||||||
>
|
>
|
||||||
<ElFormItem prop="username" label="账号">
|
<ElFormItem prop="username" label="账号">
|
||||||
<ElInput :placeholder="$t('login.placeholder[0]')" v-model.trim="formData.username" />
|
<ElInput
|
||||||
|
:placeholder="$t('login.placeholder[0]')"
|
||||||
|
v-model.trim="formData.username"
|
||||||
|
/>
|
||||||
</ElFormItem>
|
</ElFormItem>
|
||||||
<ElFormItem prop="password" label="密码">
|
<ElFormItem prop="password" label="密码">
|
||||||
<ElInput
|
<ElInput
|
||||||
@@ -105,9 +116,13 @@
|
|||||||
<div class="login-bottom-row">
|
<div class="login-bottom-row">
|
||||||
<p>
|
<p>
|
||||||
{{ $t('login.noAccount') }}
|
{{ $t('login.noAccount') }}
|
||||||
<RouterLink :to="RoutesAlias.Register" style="color:#5D87FF;">{{ $t('login.register') }}</RouterLink>
|
<RouterLink :to="RoutesAlias.Register" style="color: #5d87ff">{{
|
||||||
|
$t('login.register')
|
||||||
|
}}</RouterLink>
|
||||||
</p>
|
</p>
|
||||||
<ElCheckbox v-model="formData.rememberPassword">{{ $t('login.rememberPwd') }}</ElCheckbox>
|
<ElCheckbox v-model="formData.rememberPassword">{{
|
||||||
|
$t('login.rememberPwd')
|
||||||
|
}}</ElCheckbox>
|
||||||
</div>
|
</div>
|
||||||
<div style="margin-top: 30px">
|
<div style="margin-top: 30px">
|
||||||
<ElButton
|
<ElButton
|
||||||
@@ -123,10 +138,7 @@
|
|||||||
</ElForm>
|
</ElForm>
|
||||||
</div>
|
</div>
|
||||||
<div v-else>
|
<div v-else>
|
||||||
<ElForm
|
<ElForm :model="formData" style="margin-top: 25px">
|
||||||
:model="formData"
|
|
||||||
style="margin-top: 25px"
|
|
||||||
>
|
|
||||||
<ElFormItem prop="company" label="公司">
|
<ElFormItem prop="company" label="公司">
|
||||||
<ElSelect v-model="formData.company" class="account-select" @change="changeCompany">
|
<ElSelect v-model="formData.company" class="account-select" @change="changeCompany">
|
||||||
<ElOption
|
<ElOption
|
||||||
@@ -184,7 +196,7 @@
|
|||||||
import type { FormInstance, FormRules } from 'element-plus'
|
import type { FormInstance, FormRules } from 'element-plus'
|
||||||
|
|
||||||
const settingStore = useSettingStore()
|
const settingStore = useSettingStore()
|
||||||
const { isDark, systemThemeType } = storeToRefs(settingStore)
|
const { systemThemeType } = storeToRefs(settingStore)
|
||||||
|
|
||||||
const dragVerify = ref()
|
const dragVerify = ref()
|
||||||
|
|
||||||
@@ -226,20 +238,13 @@
|
|||||||
const loading = ref(false)
|
const loading = ref(false)
|
||||||
const { width } = useWindowSize()
|
const { width } = useWindowSize()
|
||||||
const getcompanyList = async () => {
|
const getcompanyList = async () => {
|
||||||
try {
|
|
||||||
// 这里调用公司列表的接口
|
|
||||||
const response = await UserService.getCompanyList()
|
const response = await UserService.getCompanyList()
|
||||||
companyList.value = response || []
|
companyList.value = response || []
|
||||||
} catch (error) { }
|
|
||||||
}
|
}
|
||||||
const getsystemsList = async () => {
|
const getsystemsList = async () => {
|
||||||
try {
|
|
||||||
// 这里调用公司列表的接口
|
|
||||||
const response = await UserService.getsystemsList()
|
const response = await UserService.getsystemsList()
|
||||||
systemsList.value = response || []
|
systemsList.value = response || []
|
||||||
} catch (error) { }
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// 切换语言
|
// 切换语言
|
||||||
const { locale } = useI18n()
|
const { locale } = useI18n()
|
||||||
|
|
||||||
@@ -250,14 +255,10 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
const getfeishuAppList = async () => {
|
const getfeishuAppList = async () => {
|
||||||
try {
|
|
||||||
// 这里调用飞书
|
|
||||||
feishuresponse.value = await UserService.getfeishuAppList({ corp_id: companyid.value })
|
feishuresponse.value = await UserService.getfeishuAppList({ corp_id: companyid.value })
|
||||||
if (activeLoginType.value == 'qrcode') {
|
if (activeLoginType.value == 'qrcode') {
|
||||||
feishulogin()
|
feishulogin()
|
||||||
}
|
}
|
||||||
console.log(feishuresponse)
|
|
||||||
} catch (error) { }
|
|
||||||
}
|
}
|
||||||
//切换系统
|
//切换系统
|
||||||
const changesystems = (systems: any) => {
|
const changesystems = (systems: any) => {
|
||||||
@@ -292,7 +293,7 @@
|
|||||||
const waitForQRLogin = () =>
|
const waitForQRLogin = () =>
|
||||||
new Promise<void>((resolve) => {
|
new Promise<void>((resolve) => {
|
||||||
const check = () => {
|
const check = () => {
|
||||||
// @ts-ignore
|
// @ts-expect-error
|
||||||
if (window.QRLogin) resolve()
|
if (window.QRLogin) resolve()
|
||||||
else setTimeout(check, 100)
|
else setTimeout(check, 100)
|
||||||
}
|
}
|
||||||
@@ -314,7 +315,7 @@
|
|||||||
goto: feishuGotoUrl,
|
goto: feishuGotoUrl,
|
||||||
width: '250',
|
width: '250',
|
||||||
height: '250',
|
height: '250',
|
||||||
style: 'width:350px;height:350px;border:none'
|
style: 'width:350px;height:270px;border:none'
|
||||||
})
|
})
|
||||||
const handleMessage = function (event: MessageEvent) {
|
const handleMessage = function (event: MessageEvent) {
|
||||||
if (QRLoginObj.matchOrigin(event.origin) && QRLoginObj.matchData(event.data)) {
|
if (QRLoginObj.matchOrigin(event.origin) && QRLoginObj.matchData(event.data)) {
|
||||||
@@ -428,15 +429,18 @@
|
|||||||
getcompanyList()
|
getcompanyList()
|
||||||
getsystemsList()
|
getsystemsList()
|
||||||
// 自动读取 query 参数并存入 userStore
|
// 自动读取 query 参数并存入 userStore
|
||||||
const companyid = Array.isArray(route.query.corp_id) ? route.query.corp_id[0] : route.query.corp_id
|
const companyid = Array.isArray(route.query.corp_id)
|
||||||
const companyabbr = Array.isArray(route.query.corp_abbr) ? route.query.corp_abbr[0] : route.query.corp_abbr
|
? route.query.corp_id[0]
|
||||||
|
: route.query.corp_id
|
||||||
|
const companyabbr = Array.isArray(route.query.corp_abbr)
|
||||||
|
? route.query.corp_abbr[0]
|
||||||
|
: route.query.corp_abbr
|
||||||
if (companyid) {
|
if (companyid) {
|
||||||
userStore.setCompany(companyid as string, (companyabbr as string) || '')
|
userStore.setCompany(companyid as string, (companyabbr as string) || '')
|
||||||
formData.company = Number(companyid)
|
formData.company = Number(companyid)
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|
||||||
// 切换主题
|
// 切换主题
|
||||||
import { useTheme } from '@/composables/useTheme'
|
import { useTheme } from '@/composables/useTheme'
|
||||||
import { UserService } from '@/api/usersApi'
|
import { UserService } from '@/api/usersApi'
|
||||||
|
|||||||
@@ -29,19 +29,11 @@
|
|||||||
@current-change="handleCurrentChange"
|
@current-change="handleCurrentChange"
|
||||||
>
|
>
|
||||||
<template #default>
|
<template #default>
|
||||||
<el-table-column prop="contacts" label="客户名称" min-width="120"></el-table-column>
|
<el-table-column prop="contacts" label="客户名称"></el-table-column>
|
||||||
<el-table-column prop="phone" label="电话" min-width="120"></el-table-column>
|
<el-table-column prop="phone" label="电话"></el-table-column>
|
||||||
<el-table-column prop="magnitude" label="客户商机" min-width="140"></el-table-column>
|
<el-table-column prop="magnitude_txt" label="客户商机"></el-table-column>
|
||||||
<el-table-column label="状态" min-width="140">
|
<el-table-column prop="channel_name" label="渠道"></el-table-column>
|
||||||
<template #default="scope">
|
<el-table-column prop="country_name" label="国家"></el-table-column>
|
||||||
<span :class="getCountdownClass(scope.row.follow_next)">
|
|
||||||
<span class="custom-clock-icon" style="vertical-align: middle; margin-right: 4px">
|
|
||||||
<i class="iconfont-sys"></i>
|
|
||||||
</span>
|
|
||||||
{{ getCountdown(scope.row.follow_next) }}
|
|
||||||
</span>
|
|
||||||
</template>
|
|
||||||
</el-table-column>
|
|
||||||
<el-table-column fixed="right" label="操作" width="160px">
|
<el-table-column fixed="right" label="操作" width="160px">
|
||||||
<template #default="scope">
|
<template #default="scope">
|
||||||
<div class="follow-detli" @click="onDetail(scope.row)">
|
<div class="follow-detli" @click="onDetail(scope.row)">
|
||||||
|
|||||||
@@ -4,7 +4,12 @@
|
|||||||
<div class="left-wrap">
|
<div class="left-wrap">
|
||||||
<div class="user-wrap box-style">
|
<div class="user-wrap box-style">
|
||||||
<!-- <img class="bg" src="@imgs/user/bg.webp" /> -->
|
<!-- <img class="bg" src="@imgs/user/bg.webp" /> -->
|
||||||
<img class="avatar" :src="userInfo.avatar_full" />
|
<img
|
||||||
|
class="avatar"
|
||||||
|
:src="
|
||||||
|
userInfo.avatar_full != '' ? userInfo.avatar_full : '/src/assets/img/user/avatar.webp'
|
||||||
|
"
|
||||||
|
/>
|
||||||
<h2 class="name">{{ userInfo.name }}</h2>
|
<h2 class="name">{{ userInfo.name }}</h2>
|
||||||
<p class="des">ID:{{ userInfo.id }}</p>
|
<p class="des">ID:{{ userInfo.id }}</p>
|
||||||
<div class="outer-info">
|
<div class="outer-info">
|
||||||
@@ -29,7 +34,7 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class="right-wrap">
|
<div class="right-wrap">
|
||||||
<div class="info box-style">
|
<div class="info box-style">
|
||||||
<h1 class="title"><span class="border" style="margin-right: 5px;"></span>基本信息</h1>
|
<h1 class="title"><span class="border" style="margin-right: 5px"></span>基本信息</h1>
|
||||||
|
|
||||||
<ElForm
|
<ElForm
|
||||||
:model="form"
|
:model="form"
|
||||||
@@ -45,9 +50,15 @@
|
|||||||
:headers="uploadHeaders"
|
:headers="uploadHeaders"
|
||||||
:show-file-list="false"
|
:show-file-list="false"
|
||||||
:on-success="handleUploadavatar"
|
:on-success="handleUploadavatar"
|
||||||
|
:disabled="!isEdit"
|
||||||
>
|
>
|
||||||
<div class="qrcode-upload-box">
|
<div class="qrcode-upload-box">
|
||||||
<img class="avatar" :src="imageUrlavatar"/>
|
<img
|
||||||
|
class="avatar"
|
||||||
|
:src="
|
||||||
|
imageUrlavatar != '' ? imageUrlavatar : '/src/assets/img/user/avatar.webp'
|
||||||
|
"
|
||||||
|
/>
|
||||||
</div>
|
</div>
|
||||||
</el-upload>
|
</el-upload>
|
||||||
</ElFormItem>
|
</ElFormItem>
|
||||||
@@ -81,19 +92,37 @@
|
|||||||
<ElInput v-model="form.corp_name" disabled />
|
<ElInput v-model="form.corp_name" disabled />
|
||||||
</ElFormItem>
|
</ElFormItem>
|
||||||
<ElFormItem label="国家" prop="address" class="right-input">
|
<ElFormItem label="国家" prop="address" class="right-input">
|
||||||
<el-select v-model="form.country_id" filterable placeholder="请选择国家" :disabled="!isEdit" >
|
<el-select
|
||||||
<el-option v-for="item in countryOptions" :key="item.id" :label="item.cn_addr" :value="item.id" />
|
v-model="form.country_id"
|
||||||
|
filterable
|
||||||
|
placeholder="请选择国家"
|
||||||
|
:disabled="!isEdit"
|
||||||
|
>
|
||||||
|
<el-option
|
||||||
|
v-for="item in countryOptions"
|
||||||
|
:key="item.id"
|
||||||
|
:label="item.cn_addr"
|
||||||
|
:value="item.id"
|
||||||
|
/>
|
||||||
</el-select>
|
</el-select>
|
||||||
</ElFormItem>
|
</ElFormItem>
|
||||||
</ElRow>
|
</ElRow>
|
||||||
<ElRow>
|
<ElRow>
|
||||||
<ElFormItem label="二维码" prop="socialize" :class="isEdit?'qrcode-radio-group':''">
|
<ElFormItem
|
||||||
|
label="二维码"
|
||||||
|
prop="socialize"
|
||||||
|
:class="isEdit ? 'qrcode-radio-group' : ''"
|
||||||
|
>
|
||||||
<el-radio-group v-model="form.socialize" v-if="isEdit">
|
<el-radio-group v-model="form.socialize" v-if="isEdit">
|
||||||
<el-radio label="微信">微信</el-radio>
|
<el-radio label="微信">微信</el-radio>
|
||||||
<el-radio label="WhatsApp">WhatsApp</el-radio>
|
<el-radio label="WhatsApp">WhatsApp</el-radio>
|
||||||
</el-radio-group>
|
</el-radio-group>
|
||||||
<template v-else>
|
<template v-else>
|
||||||
<img v-if="form.socialize_pic_full" :src="form.socialize_pic_full" class="qrcode-img" />
|
<img
|
||||||
|
v-if="form.socialize_pic_full"
|
||||||
|
:src="form.socialize_pic_full"
|
||||||
|
class="qrcode-img"
|
||||||
|
/>
|
||||||
<span v-else class="qrcode-upload-text">暂无二维码</span>
|
<span v-else class="qrcode-upload-text">暂无二维码</span>
|
||||||
</template>
|
</template>
|
||||||
</ElFormItem>
|
</ElFormItem>
|
||||||
@@ -106,7 +135,11 @@
|
|||||||
:on-success="handleUploadavatarqrcode"
|
:on-success="handleUploadavatarqrcode"
|
||||||
>
|
>
|
||||||
<div class="qrcode-upload-box">
|
<div class="qrcode-upload-box">
|
||||||
<img v-if="form.socialize_pic_full" :src="socialize_pic_full" class="qrcode-img" />
|
<img
|
||||||
|
v-if="form.socialize_pic_full"
|
||||||
|
:src="socialize_pic_full"
|
||||||
|
class="qrcode-img"
|
||||||
|
/>
|
||||||
<span v-else class="qrcode-upload-text">
|
<span v-else class="qrcode-upload-text">
|
||||||
<img :src="imageUrl" class="qrcode-img" />
|
<img :src="imageUrl" class="qrcode-img" />
|
||||||
</span>
|
</span>
|
||||||
@@ -169,8 +202,7 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { useUserStore } from '@/store/modules/user'
|
import { ElForm, FormInstance } from 'element-plus'
|
||||||
import { ElForm, FormInstance, FormRules } from 'element-plus'
|
|
||||||
import imageUrl from '@/assets/img/crm/upimg.png'
|
import imageUrl from '@/assets/img/crm/upimg.png'
|
||||||
import { CrmService } from '@/api/crmApi'
|
import { CrmService } from '@/api/crmApi'
|
||||||
import { useUploadHeaders } from '@/composables/useUploadHeaders'
|
import { useUploadHeaders } from '@/composables/useUploadHeaders'
|
||||||
|
|||||||
Reference in New Issue
Block a user