修改登录页样式公海数据个人信息默认图

2025-07-25 15:11:50 +08:00
parent 0f790269db
commit 382011d592
3 changed files with 134 additions and 106 deletions
@@ -36,8 +36,16 @@
        <div class="form">
          <!-- 登录方式切换 tab -->
          <div class="login-type-tabs">
-            <span :class="{active: activeLoginType === 'password'}" @click="activeLoginType = 'password'">账号密码登录</span>
-            <span :class="{active: activeLoginType === 'qrcode'}" @click="activeLoginType = 'qrcode'">飞书登录</span>
+            <span
+              :class="{ active: activeLoginType === 'password' }"
+              @click="activeLoginType = 'password'"
+              >账号密码登录</span
+            >
+            <span
+              :class="{ active: activeLoginType === 'qrcode' }"
+              @click="activeLoginType = 'qrcode'"
+              >飞书登录</span
+            >
          </div>
          <div v-if="activeLoginType === 'password'">
            <ElForm
@@ -47,8 +55,11 @@
              @keyup.enter="handleSubmit"
              style="margin-top: 25px"
            >
-              <ElFormItem prop="username" label="账号" >
-                <ElInput :placeholder="$t('login.placeholder[0]')" v-model.trim="formData.username" />
+              <ElFormItem prop="username" label="账号">
+                <ElInput
+                  :placeholder="$t('login.placeholder[0]')"
+                  v-model.trim="formData.username"
+                />
              </ElFormItem>
              <ElFormItem prop="password" label="密码">
                <ElInput
@@ -89,7 +100,7 @@
                  <ArtDragVerify
                    ref="dragVerify"
                    v-model:value="isPassing"
-                    :width="width < 500 ? 260: 380"
+                    :width="width < 500 ? 260 : 380"
                    :text="$t('login.sliderText')"
                    textColor="var(--art-gray-800)"
                    :successText="$t('login.sliderSuccessText')"
@@ -105,9 +116,13 @@
              <div class="login-bottom-row">
                <p>
                  {{ $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>
-                <ElCheckbox v-model="formData.rememberPassword">{{ $t('login.rememberPwd') }}</ElCheckbox>
+                <ElCheckbox v-model="formData.rememberPassword">{{
+                  $t('login.rememberPwd')
+                }}</ElCheckbox>
              </div>
              <div style="margin-top: 30px">
                <ElButton
@@ -123,10 +138,7 @@
            </ElForm>
          </div>
          <div v-else>
-            <ElForm
-              :model="formData"
-              style="margin-top: 25px"
-            >
+            <ElForm :model="formData" style="margin-top: 25px">
              <ElFormItem prop="company" label="公司">
                <ElSelect v-model="formData.company" class="account-select" @change="changeCompany">
                  <ElOption
@@ -184,7 +196,7 @@
  import type { FormInstance, FormRules } from 'element-plus'

  const settingStore = useSettingStore()
-  const { isDark, systemThemeType } = storeToRefs(settingStore)
+  const { systemThemeType } = storeToRefs(settingStore)

  const dragVerify = ref()

@@ -207,11 +219,11 @@
  const companyList = ref<any>()
  //系统
  const systemsList = ref<any>()
-  const feishuresponse=ref()
+  const feishuresponse = ref()
  const formData = reactive({
    account: '',
-    systems: useUserStore().companyid?Number(useUserStore().companyid):'',
-    company: useUserStore().companyid?Number(useUserStore().companyid):'',
+    systems: useUserStore().companyid ? Number(useUserStore().companyid) : '',
+    company: useUserStore().companyid ? Number(useUserStore().companyid) : '',
    username: '',
    password: '',
    rememberPassword: true
@@ -226,20 +238,13 @@
  const loading = ref(false)
  const { width } = useWindowSize()
  const getcompanyList = async () => {
-    try {
-      // 这里调用公司列表的接口
    const response = await UserService.getCompanyList()
    companyList.value = response || []
-    } catch (error) { }
  }
  const getsystemsList = async () => {
-    try {
-      // 这里调用公司列表的接口
    const response = await UserService.getsystemsList()
    systemsList.value = response || []
-    } catch (error) { }
  }
-  
  // 切换语言
  const { locale } = useI18n()

@@ -250,20 +255,16 @@
  }

  const getfeishuAppList = async () => {
-    try {
-      // 这里调用飞书
    feishuresponse.value = await UserService.getfeishuAppList({ corp_id: companyid.value })
-      if(activeLoginType.value=='qrcode'){
+    if (activeLoginType.value == 'qrcode') {
      feishulogin()
    }
-      console.log(feishuresponse)
-    } catch (error) { }
  }
  //切换系统
  const changesystems = (systems: any) => {
    const systemsdata = systemsList.value.find((c: any) => c.id === systems)
    systemsid.value = systems
-    userStore.setSystems(systems,systemsdata?.code)
+    userStore.setSystems(systems, systemsdata?.code)
  }
  //切换公司

@@ -272,10 +273,10 @@
    const companyt = companyList.value.find((c: any) => c.id === company)
    companyid.value = company
    iscompany.value = company
-    userStore.setCompany(company,companyt?.abbr)
+    userStore.setCompany(company, companyt?.abbr)
    getfeishuAppList()
  }
-  if(companyabbr!=''){
+  if (companyabbr != '') {
    iscompany.value = true
    getfeishuAppList()
  }
@@ -292,7 +293,7 @@
      const waitForQRLogin = () =>
        new Promise<void>((resolve) => {
          const check = () => {
-            // @ts-ignore
+            // @ts-expect-error
            if (window.QRLogin) resolve()
            else setTimeout(check, 100)
          }
@@ -314,7 +315,7 @@
        goto: feishuGotoUrl,
        width: '250',
        height: '250',
-        style: 'width:350px;height:350px;border:none'
+        style: 'width:350px;height:270px;border:none'
      })
      const handleMessage = function (event: MessageEvent) {
        if (QRLoginObj.matchOrigin(event.origin) && QRLoginObj.matchData(event.data)) {
@@ -330,10 +331,10 @@
    async (val) => {
      if (val === 'qrcode') {
        userStore.setLoginType('feishu')
-        if(companyid.value!=''){
+        if (companyid.value != '') {
          feishulogin()
        }
-      }else{
+      } else {
        userStore.setLoginType('upwd')
      }
    },
@@ -428,15 +429,18 @@
    getcompanyList()
    getsystemsList()
    // 自动读取 query 参数并存入 userStore
-    const companyid = Array.isArray(route.query.corp_id) ? 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
+    const companyid = Array.isArray(route.query.corp_id)
+      ? 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) {
      userStore.setCompany(companyid as string, (companyabbr as string) || '')
      formData.company = Number(companyid)
    }
  })

-
  // 切换主题
  import { useTheme } from '@/composables/useTheme'
  import { UserService } from '@/api/usersApi'
@@ -29,19 +29,11 @@
        @current-change="handleCurrentChange"
      >
        <template #default>
-          <el-table-column prop="contacts" label="客户名称" min-width="120"></el-table-column>
-          <el-table-column prop="phone" label="电话" min-width="120"></el-table-column>
-          <el-table-column prop="magnitude" label="客户商机" min-width="140"></el-table-column>
-          <el-table-column label="状态" min-width="140">
-            <template #default="scope">
-              <span :class="getCountdownClass(scope.row.follow_next)">
-                <span class="custom-clock-icon" style="vertical-align: middle; margin-right: 4px">
-                  <i class="iconfont-sys">&#xe7b1;</i>
-                </span>
-                {{ getCountdown(scope.row.follow_next) }}
-              </span>
-            </template>
-          </el-table-column>
+          <el-table-column prop="contacts" label="客户名称"></el-table-column>
+          <el-table-column prop="phone" label="电话"></el-table-column>
+          <el-table-column prop="magnitude_txt" label="客户商机"></el-table-column>
+          <el-table-column prop="channel_name" label="渠道"></el-table-column>
+          <el-table-column prop="country_name" label="国家"></el-table-column>
          <el-table-column fixed="right" label="操作" width="160px">
            <template #default="scope">
              <div class="follow-detli" @click="onDetail(scope.row)">
@@ -4,32 +4,37 @@
      <div class="left-wrap">
        <div class="user-wrap box-style">
          <!-- <img class="bg" src="@imgs/user/bg.webp" /> -->
-          <img class="avatar" :src="userInfo.avatar_full" />
-          <h2 class="name">{{userInfo.name}}</h2>
-          <p class="des">ID:{{userInfo.id}}</p>
+          <img
+            class="avatar"
+            :src="
+              userInfo.avatar_full != '' ? userInfo.avatar_full : '/src/assets/img/user/avatar.webp'
+            "
+          />
+          <h2 class="name">{{ userInfo.name }}</h2>
+          <p class="des">ID:{{ userInfo.id }}</p>
          <div class="outer-info">
            <div class="info-row">
              <span class="info-label">电 话：</span>
-              <span class="info-value">{{userInfo.phone}}</span>
+              <span class="info-value">{{ userInfo.phone }}</span>
            </div>
            <div class="info-row">
              <span class="info-label">职 位：</span>
-              <span class="info-value">{{userInfo.position}}</span>
+              <span class="info-value">{{ userInfo.position }}</span>
            </div>
            <div class="info-row">
              <span class="info-label">公 司：</span>
-              <span class="info-value">{{userInfo.corp_name}}</span>
+              <span class="info-value">{{ userInfo.corp_name }}</span>
            </div>
            <div class="info-row">
              <span class="info-label">国 家：</span>
-              <span class="info-value">{{userInfo.country_txt}}</span>
+              <span class="info-value">{{ userInfo.country_txt }}</span>
            </div>
          </div>
        </div>
      </div>
      <div class="right-wrap">
        <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
            :model="form"
@@ -45,9 +50,15 @@
                :headers="uploadHeaders"
                :show-file-list="false"
                :on-success="handleUploadavatar"
+                :disabled="!isEdit"
              >
                <div class="qrcode-upload-box">
-                  <img class="avatar" :src="imageUrlavatar"/>
+                  <img
+                    class="avatar"
+                    :src="
+                      imageUrlavatar != '' ? imageUrlavatar : '/src/assets/img/user/avatar.webp'
+                    "
+                  />
                </div>
              </el-upload>
            </ElFormItem>
@@ -78,22 +89,40 @@

            <ElRow>
              <ElFormItem label="公司" prop="company">
-                <ElInput v-model="form.corp_name" disabled/>
+                <ElInput v-model="form.corp_name" disabled />
              </ElFormItem>
              <ElFormItem label="国家" prop="address" class="right-input">
-                <el-select 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
+                  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>
              </ElFormItem>
            </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 label="微信">微信</el-radio>
                  <el-radio label="WhatsApp">WhatsApp</el-radio>
                </el-radio-group>
                <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>
                </template>
              </ElFormItem>
@@ -106,7 +135,11 @@
                  :on-success="handleUploadavatarqrcode"
                >
                  <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">
                      <img :src="imageUrl" class="qrcode-img" />
                    </span>
@@ -169,8 +202,7 @@
 </template>

 <script setup lang="ts">
-  import { useUserStore } from '@/store/modules/user'
-  import { ElForm, FormInstance, FormRules } from 'element-plus'
+  import { ElForm, FormInstance } from 'element-plus'
  import imageUrl from '@/assets/img/crm/upimg.png'
  import { CrmService } from '@/api/crmApi'
  import { useUploadHeaders } from '@/composables/useUploadHeaders'
@@ -181,10 +213,10 @@
  interface CustomerInfo {
    [key: string]: any
  }
-  const imageUrlavatar=ref('')
-  const socialize_pic_full=ref('')
+  const imageUrlavatar = ref('')
+  const socialize_pic_full = ref('')
  const countryOptions = ref<any>()
-  const form= ref<CustomerInfo>({})
+  const form = ref<CustomerInfo>({})
  //获取公司 getCompanyList
  const companyList = ref<any>()
  //国家