企业logo

src/api/enterprise.js

@@ -140,10 +140,9 @@ export const getEnterpriseBusiness = async (params) => {
 }
 
 // 招聘端-企业信息-修改企业logo
-export const updateEnterpriseLogo = async (data) => {
+export const updateEnterpriseLogo = async (url) => {
   return await request.post({
-    url: '/app-admin-api/menduner/system/enterprise/logo/update',
-    data
+    url: `/app-admin-api/menduner/system/enterprise/logo/update?logoUrl=${url}`
   })
 }
 

src/views/enterprise/informationManagement/informationSettings.vue

@@ -41,6 +41,7 @@
 </template>
 
 <script setup>
+defineOptions({ name: 'enterprise-system-management-information-settings'})
 import basicInfo from './informationSettingsComponents/basicInfo.vue'
 import enterpriseLogo from './informationSettingsComponents/enterpriseLogo.vue'
 import enterpriseAlbum from './informationSettingsComponents/enterpriseAlbum.vue'
@@ -48,23 +49,10 @@ import welfareLabel from './informationSettingsComponents/welfareLabel.vue'
 import businessInformation from './informationSettingsComponents/businessInformation.vue'
 // import enterpriseVideo from './informationSettingsComponents/enterpriseVideo.vue'
 // import recruitmentQRCode from './informationSettingsComponents/recruitmentQRCode.vue'
-import { provide, ref, watch } from 'vue'
+import { ref, watch } from 'vue'
 import { useRoute, useRouter } from 'vue-router'
-const route = useRoute(); const router = useRouter()
-defineOptions({ name: 'enterprise-system-management-information-settings'})
-
-const infoData = {
-  name: '苏州工业园区娄葑镇香草叶咖啡店', // 企业名称
-  suoZaiDi: '江苏 苏州 吴中区',
-  diZhi: '苏州工业园区斜塘林泉街598号邻里中心翰林大厦2幢N111室',
-  key1: '120.67439051247,31.349085947054',
-  time: new Date().getTime(),
-  select: '1',
-  net: 'https://www.baidu.com',
-  content: '香草叶总部位于苏州，始创于2010年；主营业务是中西结合简餐，以西式为主，适宜商务宴请、休闲小憩、情侣约会、家庭和朋友聚餐。创始人基于对西餐的热爱和菜品高品质的要求，不断研发和丰富菜品，中西结合式简餐，深受顾客朋友们的喜爱。诚邀志同道合者，热爱餐饮业的有志之士加盟香草叶！',
-}
-provide('infoData', JSON.stringify(infoData))
 
+const route = useRoute(); const router = useRouter()
 // tab
 const tab = ref(1)
 watch(() => route?.query?.tabKey, (newVal) => { if (newVal) tab.value = newVal - 0 })

src/views/enterprise/informationManagement/informationSettingsComponents/basicInfo.vue

@@ -23,7 +23,7 @@
       </template>
     </CtForm>
     <div class="text-center">
-      <v-btn color="primary" class="buttons mt-3 mb-10" @click="handleSave">{{ $t('common.save') }}</v-btn>
+      <v-btn color="primary" class="buttons mt-3 mb-10" @click.stop="handleSave">{{ $t('common.save') }}</v-btn>
     </div>
   </div>
 </template>
@@ -33,9 +33,11 @@ defineOptions({name: 'informationSettingsComponents-basicInfo'})
 import { ref, reactive } from 'vue'
 import { getEnterpriseBaseInfo, updateEnterpriseBaseInfo } from '@/api/enterprise'
 import { getDict } from '@/hooks/web/useDictionaries'
+import { useI18n } from '@/hooks/web/useI18n'
 import industryTypeCard from '@/components/industryTypeCard'
 import Snackbar from '@/plugins/snackbar'
 
+const { t } = useI18n()
 const CtFormRef = ref()
 const query = reactive({})
 const formItems = ref({
@@ -191,7 +193,7 @@ const handleSave = async () => {
     query[e.key] = e.value
   })
   await updateEnterpriseBaseInfo(query)
-  Snackbar.success('编辑成功')
+  Snackbar.success(t('common.saveMsg'))
   getBaseInfo()
 }
 </script>

src/views/enterprise/informationManagement/informationSettingsComponents/enterpriseLogo.vue

@@ -2,42 +2,29 @@
 <template>
   <div>
     <div class="topTip">温馨提示：上传企业LOGO，可以获得更多的关注，提升招聘效果哦！</div>
-    <div class="logoBox d-flex py-4">
-      <div class="logoItem">
-        <span class="typeTitle">矩形LOGO</span>
-        <div class="d-flex mt-8">
-          <div class="file-item mr-4" style="width: 200px;">
-            <v-img v-if="rectangleImageUrl" width="100%" height="100%" :src="rectangleImageUrl"></v-img>
-            <span class="logo">LOGO</span>
-          </div>
-          <div class="d-flex flex-column justify-space-between">
-            <div>
-              <div class="uploadPrompt">LOGO大小：200*130像素</div>
-              <div class="uploadPrompt">仅支持JPG、JPEG、PNG常见图片类</div>
-              <div class="uploadPrompt">型，且文件小于5M</div>
-            </div>
-            <div>
-              <v-btn prepend-icon="mdi mdi-upload" color="warning mb-1" @click="{}">{{ $t('common.uploadPictures') }}</v-btn>
-            </div>
-          </div>
+    <div class="logoBox d-flex py-4 align-center justify-center">
+      <div class="mt-8">
+        <div class="file-item mr-4" style="width: 130px;">
+          <v-img v-if="squareImageUrl" width="100%" height="100%" :src="squareImageUrl"></v-img>
+          <span v-else class="logo">LOGO</span>
         </div>
-      </div>
-      <div class="logoItem">
-        <span class="typeTitle">正方形LOGO</span>
-        <div class="d-flex mt-8">
-          <div class="file-item mr-4" style="width: 130px;">
-            <v-img v-if="squareImageUrl" width="100%" height="100%" :src="squareImageUrl"></v-img>
-            <span class="logo">LOGO</span>
+        <div class="d-flex flex-column justify-space-between">
+          <div class="my-3">
+            <div class="uploadPrompt">LOGO大小：200*130像素</div>
+            <div class="uploadPrompt">仅支持JPG、JPEG、PNG常见图片类</div>
+            <div class="uploadPrompt">型，且文件小于10M</div>
           </div>
-          <div class="d-flex flex-column justify-space-between">
-            <div>
-              <div class="uploadPrompt">LOGO大小：200*130像素</div>
-              <div class="uploadPrompt">仅支持JPG、JPEG、PNG常见图片类</div>
-              <div class="uploadPrompt">型，且文件小于5M</div>
-            </div>
-            <div>
-              <v-btn prepend-icon="mdi mdi-upload" color="warning mb-1" @click="{}">{{ $t('common.uploadPictures') }}</v-btn>
-            </div>
+          <div>
+            <v-btn prepend-icon="mdi mdi-upload" color="primary" @click.stop="openFileInput">
+              {{ $t('common.uploadPictures') }}
+              <input
+                type="file"
+                ref="fileInput"
+                accept="image/png, image/jpg, image/jpeg"
+                style="display: none;"
+                @change="handleUploadFile"
+              />
+            </v-btn>
           </div>
         </div>
       </div>
@@ -46,14 +33,56 @@
 </template>
 
 <script setup>
-import { ref } from 'vue';
-
 defineOptions({name: 'informationSettingsComponents-enterpriseLogo'})
+import { ref } from 'vue'
+import { uploadFile } from '@/api/common'
+import { useI18n } from '@/hooks/web/useI18n'
+import { updateEnterpriseLogo, getEnterpriseBaseInfo } from '@/api/enterprise'
+import Snackbar from '@/plugins/snackbar'
+
+const { t } = useI18n()
+let squareImageUrl = ref('')
+const getInfo = async () => {
+  const data = await getEnterpriseBaseInfo()
+  if (data && data?.logoUrl) squareImageUrl.value = data.logoUrl
+}
+getInfo()
+
+// 选择文件
+const fileInput = ref()
+const clicked = ref(false)
+const openFileInput = () => {
+  if (clicked.value) return
+  clicked.value = true
+  fileInput.value.click()
+  clicked.value = false
+}
+
+// 上传附件
+const typeList = ['png', 'jpg', 'jpeg']
+const handleUploadFile = async (e) => {
+  const file = e.target.files[0]
+  const size = file.size
+  if (size / (1024*1024) > 10) {
+    Snackbar.warning(t('common.fileSizeExceed'))
+    return
+  }
+  const arr = file.name.split('.')
+  if (typeList.indexOf(arr[arr.length - 1]) < 0) {
+    Snackbar.warning(t('common.fileFormatIncorrect'))
+    return
+  }
+  const formData = new FormData()
+  formData.append('file', file)
+  const { data } = await uploadFile(formData)
+  if (!data) return
+  Snackbar.success(t('common.uploadSucMsg'))
+  await updateEnterpriseLogo(data)
+  getInfo()
+}
 
-// 上传
-let rectangleImageUrl = ref('') // 矩形
-let squareImageUrl = ref('') // 正方形
 </script>
+
 <style lang="scss" scoped>
 .topTip {
   background-color: #f7f8fa;
@@ -64,7 +93,6 @@ let squareImageUrl = ref('') // 正方形
 }
 .uploadPrompt { font-size: 14px; line-height: 24px; }
 .logoBox {
-  .logoItem { width: 50%; padding-right: 10px; }
   .typeTitle {
     font-weight: bold;
   }
@@ -73,7 +101,6 @@ let squareImageUrl = ref('') // 正方形
   height: 130px;
   border-radius: 5px;
   margin-right: 8px;
-  // margin-top: 24px;
   border: 1px solid rgba(188, 188, 188, 0.5);
   text-align: center;
   .logo {