index.vue 27 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916
  1. <template>
  2. <view class="box">
  3. <view class="box-top">
  4. <view class="box-top-title">
  5. {{ info.name }}
  6. <text class="subText">
  7. {{ info?.postName && info?.postName !== 'null' && info?.postName !== 'undefined' ? info.postName : '' }}
  8. <text v-if="info?.postName && info?.postName !== 'null' && info?.postName !== 'undefined' && info.enterpriseName" class="gun">|</text>
  9. {{ formatName(info.enterpriseName) }}
  10. </text>
  11. </view>
  12. <!-- <view class="box-top-content" v-if="interview.length">
  13. <view v-for="val in interview" :key="val.id" class="color-666">
  14. <view class="box-top-content-t">
  15. <view class="font-weight-bold color-primary">
  16. <text>{{ val.job.name }}</text>
  17. <text v-if="!val.job.payFrom && !val.job.payTo" class="ml-3">面议</text>
  18. <text v-else class="ml-3">{{ val.job.payFrom ? val.job.payFrom + '-' : '' }}{{ val.job.payTo }}</text>
  19. </view>
  20. <view :style="`color: ${val.statusColor};`" >
  21. {{ val.statusText }}
  22. </view>
  23. </view>
  24. <view class="mt-1 font-size-14 ellipsis" style="max-width: 100%;">
  25. <view class="py-1">面试时间:{{ timesTampChange(val.time, 'Y-M-D h:m') }}</view>
  26. <view class="py-1">面试地点:{{ val.address }}</view>
  27. <view class="py-1">联系电话:{{ val.invitePhone }}</view>
  28. </view>
  29. <view class="bottom">
  30. <view class="tipsText" @click="handleToCenter">在“个人中心-面试”中管理我的面试</view>
  31. <view v-if="val.status === '0'" class="btnBox">
  32. <button size="mini" type="warn" @click="handleRefuse(val)">拒绝邀请</button>
  33. <button size="mini" type="primary" @click="handleAgree(val)">接受邀请</button>
  34. </view>
  35. </view>
  36. </view>
  37. </view> -->
  38. <uni-notice-bar v-if="hasWaitingProcessingInterview" show-get-more single text="您有待处理的面试邀请,点击查看详情" @click="handleToCenter"/>
  39. </view>
  40. <!-- newsId 需要和聊天列表里面的id对应 永远取最后列表中的最后一个就可以做到发送消息即时滚动到底部 -->
  41. <scroll-view ref="chatRef" :scroll-with-animation="scrollAnimation" :scroll-into-view="newsId" class="box-main" scroll-y="true">
  42. <view class="box-main-more" v-if="hasMore">
  43. <text @click="handleMore">查看更多</text>
  44. </view>
  45. <view v-for="(val, index) in items" :key="val.id" :id="'s'+val.id+index">
  46. <view class="box-main-time">{{ timesTampChange(+(val.timestamp.padEnd(13, '0'))) }}</view>
  47. <template v-if="val.payload?.type === 102">
  48. <view class="jobCard">
  49. <!-- <view style="display: flex;">
  50. <image v-if="info.jobFairId" src="/static/svg/jobFair.svg" class=" ss-m-r-10" style="width: 20px; height: 20px;"></image>
  51. </view> -->
  52. <view class="jobCard-title"> {{ formatName(val.payload?.content?.positionInfo?.name) }}</view>
  53. <view
  54. v-if="!val.payload?.content?.positionInfo?.payFrom && !val.payload?.content?.positionInfo?.payTo"
  55. class="jobCard-subtitle">
  56. 薪酬待遇: 面议
  57. </view>
  58. <view
  59. v-else
  60. class="jobCard-subtitle"
  61. >
  62. 薪酬待遇:
  63. {{ val.payload?.content?.positionInfo?.payFrom ? val.payload?.content?.positionInfo?.payFrom + ' - ' : '' }}
  64. {{ val.payload?.content?.positionInfo?.payTo }}
  65. </view>
  66. <view class="jobCard-tag">
  67. <view
  68. v-for="(v, i) in (val.payload?.content?.positionInfo?.enterprise?.welfareList || [])"
  69. :key="val.message_id + v + i"
  70. style="margin: 10rpx"
  71. >
  72. <uni-tag
  73. :text="v"
  74. type="success"
  75. />
  76. </view>
  77. </view>
  78. <view class="jobCard-divider"></view>
  79. <view class="jobCard-subtitle text-right">
  80. <v-avatar size="24">
  81. <v-img :src="val.payload?.content?.positionInfo?.contact?.avatar"></v-img>
  82. </v-avatar>
  83. {{ val.payload?.content?.positionInfo?.contact?.name }}
  84. {{ val.payload?.content?.positionInfo?.contact?.postNameCn }}
  85. {{ formatName(val.payload?.content?.positionInfo?.enterprise?.anotherName || val.payload?.content?.positionInfo?.enterprise?.name) }}
  86. </view>
  87. <div class="jobCard-subtitle text-right">
  88. 地址:{{ val.payload?.content?.positionInfo?.address }}
  89. </div>
  90. </view>
  91. </template>
  92. <view :class="['message-view_item', val.from_uid === IM.uid ? 'is-self' : 'is-other']">
  93. <view class="image">
  94. <image
  95. :data-target="getUserAvatar(info.avatar, info.sex, info.channelID === 'system' ? true : false)"
  96. class="header"
  97. :src="(
  98. val.from_uid === IM.uid ?
  99. getUserAvatar(useUserStore.baseInfo?.avatar, useUserStore.baseInfo?.sex) :
  100. getUserAvatar(info.avatar, info.sex, info.channelID === 'system' ? true : false)
  101. )"
  102. ></image>
  103. </view>
  104. <!-- 显示沟通职位 -->
  105. <template v-if="val.payload?.type === 102">
  106. <view class="message-text" :class="val.from_uid === IM.uid ? 'active' : ''">
  107. {{ val.payload?.content.text }}
  108. </view>
  109. </template>
  110. <!-- 发起面试邀请 -->
  111. <view class="message-text none" v-else-if="val.payload?.type === 101">
  112. <uni-tag text="发起了面试邀请" custom-style="background-color: #00B760; border-color: #00B760; color: #fff;" />
  113. </view>
  114. <view class="message-text none" v-else-if="val.payload?.type === 103">
  115. <uni-tag text="拒绝了面试邀请" type="error" />
  116. </view>
  117. <view class="message-text none" v-else-if="val.payload?.type === 104">
  118. <uni-tag text="接受了面试邀请" custom-style="background-color: #00B760; border-color: #00B760; color: #fff;" />
  119. </view>
  120. <view v-else-if="val.payload.type === 105" class="text-end">
  121. <uni-tag
  122. v-if="val.from_uid === IM.uid"
  123. :text="val.payload.content?.type === 1 ? '附件简历已发送' : '简历请求已发送'"
  124. custom-style="background-color: #00B760; border-color: #00B760; color: #fff;"
  125. />
  126. <view
  127. v-if="val.payload.content?.type !== 2 || val.from_uid !== IM.uid"
  128. class="message-text card"
  129. >
  130. <view class="text-left">
  131. <text v-if="val.payload.content?.type === 1">{{
  132. val.payload.content?.query?.title || '附件简历' }}
  133. </text>
  134. <text v-if="val.payload.content?.type === 2">
  135. 我想要一份您的简历,您是否同意
  136. </text>
  137. </view>
  138. <view class="btn-actions">
  139. <text class="btn" v-if="val.payload.content?.type === 1" @tap="handlePreview(val.payload)">点击预览附件简历</text>
  140. <text class="btn" v-if="val.payload.content?.type === 2" @tap="handleFindResume">点击发送附件简历</text>
  141. </view>
  142. </view>
  143. </view>
  144. <view v-else-if="val.payload.type === -1" class="message-text" :class="{ active: val.from_uid === IM.uid}">
  145. {{ val.payload?.content?.text }}
  146. </view>
  147. <view v-else class="message-text" :class="{ active: val.from_uid === IM.uid}">
  148. {{ val.payload?.content }}
  149. </view>
  150. </view>
  151. </view>
  152. </scroll-view>
  153. <view class="box-bottom" v-if="channelItem?.channelID !== 'system'">
  154. <view class="box-bottom-tool" style="display: flex; justify-content: space-between;">
  155. <text class="toolBtn" :class="{ disabled: !isSendResume }" @tap="handleFindResume">{{ isSendResume ? '简历已投递' : '发送简历' }}</text>
  156. <!-- <uni-tag :text="isSendResume ? '简历已投递' : '发送简历'" :disabled="isSendResume" type="success" @tap="handleFindResume"/> -->
  157. <!-- <uni-tag text="发 送" type="success" @tap="handleSend"/> -->
  158. </view>
  159. <view class="d-flex align-end textBox" v-if="channelItem?.channelID !== 'system'">
  160. <textarea
  161. v-model="inputValue"
  162. :cursor-spacing="25"
  163. :show-confirm-bar="false"
  164. :disable-default-padding="true"
  165. confirm-type="send"
  166. auto-height
  167. @confirm="handleSend"
  168. />
  169. <text class="submitBtn" @tap="handleSend">发 送</text>
  170. </view>
  171. </view>
  172. <uni-popup ref="popup" background-color="#fff">
  173. <view class="popup-title">
  174. <text>发送简历选择</text>
  175. <uni-icons type="closeempty" size="20" @tap="handleClose"></uni-icons>
  176. </view>
  177. <view v-if="isStudent" class="ss-p-x-50" style="width: 272px;">
  178. <studentDeliveryForm ref="studentDeliveryFormRef" />
  179. </view>
  180. <view v-for="resume in resumeList" :key="resume.id" class="popup-content" @tap="resumeCheck = resume">
  181. <view class="iconBox">
  182. <uni-icons
  183. v-show="resumeCheck.id === resume.id"
  184. type="checkmarkempty"
  185. size="20"
  186. :color="resumeCheck.id === resume.id ? '#43AC57' : '#999'"></uni-icons>
  187. </view>
  188. <text class="text" :class="resumeCheck.id === resume.id ? 'active' : ''">{{ resume.title }}</text>
  189. </view>
  190. <view v-if="!resumeList.length" class="popup-upload" @click="handleUploadResume">
  191. <view class="popup-upload-box">
  192. <uni-icons type="plusempty" size="50" color="#f1f1f1"></uni-icons>
  193. </view>
  194. <text>温馨提示:您还未上传过简历,点击选取微信聊天文件投递。请在手机上打开此小程序进行文件上传,暂不支持在桌面版小程序中上传文件。</text>
  195. </view>
  196. <view v-if="resumeList.length" class="popup-actions">
  197. <button class="default" type="default" @click="handleSendResume">发送简历</button>
  198. </view>
  199. </uni-popup>
  200. <!-- <uni-popup ref="confirm" type="dialog">
  201. <uni-popup-dialog
  202. :type="isAgree ? 'success' : 'warn'"
  203. cancelText="取消"
  204. confirmText="确认"
  205. title="系统提示"
  206. :content="isAgree ? '确认接受面试吗?' : '确认拒绝面试吗?'"
  207. @confirm="handleConfirm"
  208. @close="handleCloseConfirm"
  209. ></uni-popup-dialog>
  210. </uni-popup> -->
  211. </view>
  212. </template>
  213. <script setup>
  214. import { ref, watch, onMounted, computed } from 'vue'
  215. import { onLoad } from '@dcloudio/uni-app'
  216. import { useIMStore } from '@/store/im'
  217. import { userStore } from '@/store/user'
  218. import { initConnect, send, initChart, getMoreMessages, toChannel } from '@/hooks/useIM'
  219. import { getDict } from '@/hooks/useDictionaries'
  220. import { timesTampChange } from '@/utils/date'
  221. import { getUserAvatar } from '@/utils/avatar'
  222. import { formatName } from '@/utils/getText'
  223. import { preview } from '@/utils/preview'
  224. import { getPersonResumeCv, saveResume } from '@/api/user'
  225. import { uploadFile } from '@/api/file'
  226. import { getInterviewInviteListByInviteUserId, getMessageType } from '@/api/common'
  227. // import { userInterviewInviteReject } from '@/api/personalCenter'
  228. import {
  229. jobCvRelSend,
  230. jobCvRelCheckSend,
  231. jobCvRelHireSend
  232. } from '@/api/position'
  233. import studentDeliveryForm from '@/components/studentDeliveryForm'
  234. const useUserStore = userStore()
  235. const IM = useIMStore()
  236. const info = ref({})
  237. const chatRef = ref()
  238. const items = ref([])
  239. const channelItem = ref(null)
  240. const hasMore = ref(false)
  241. const popup = ref()
  242. const resumeCheck = ref({})
  243. const resumeList = ref([]) // 简历列表
  244. const pageSize = ref(1)
  245. // 求职者面试列表
  246. const interview = ref([])
  247. // 求职端-获取求职者与当前邀请人的面试记录
  248. const statusList = ref([])
  249. const inputValue = ref('')
  250. // const isAgree = ref(false)
  251. // const confirm = ref()
  252. // const chooseInvite = ref(null)
  253. const newsId = ref('') // newsId 需要和聊天列表里面的id对应 永远取最后列表中的最后一个就可以做到发送消息即时滚动到底部
  254. const scrollAnimation = ref(false)
  255. const isSendResume = ref(false)
  256. const positionInfo = ref({})
  257. const isEmployment = ref('-1')
  258. const isStudent = ref(false) // 已测试,待开放上线 const isStudent = useUserStore.baseInfo?.type && Boolean(Number(useUserStore.baseInfo.type) === 1)
  259. onMounted(() => {
  260. setTimeout(() => {
  261. scrollAnimation.value = true
  262. }, 1500)
  263. })
  264. const {
  265. conversationList,
  266. // updateConversation,
  267. updateUnreadCount,
  268. // deleteConversations,
  269. resetUnread
  270. } = initConnect(async (successful) => {
  271. if (!successful) {
  272. uni.showToast({
  273. title: '发送失败',
  274. icon: 'none',
  275. mask: true,
  276. })
  277. return
  278. }
  279. inputValue.value = ''
  280. // chatRef.value.reset()
  281. // // 发送成功
  282. const { list } = await getMoreMessages(1, channelItem.value)
  283. // updateConversation()
  284. items.value = list.value
  285. // chatRef.value.scrollBottom()
  286. })
  287. watch(
  288. () => conversationList.value,
  289. async (val) => {
  290. if (!channelItem.value) {
  291. return
  292. }
  293. const { list } = await getMoreMessages(1, channelItem.value)
  294. if (list.value.length) {
  295. const item = list.value[list.value.length - 1]
  296. const arr = [101, 103, 104]
  297. if (arr.includes(item.payload?.type)) {
  298. getInterviewInviteList()
  299. }
  300. }
  301. items.value = list.value
  302. setScrollBottom()
  303. // 清除未读消息
  304. resetUnread(channelItem.value)
  305. },
  306. {
  307. deep: true,
  308. immediate: true
  309. }
  310. )
  311. async function init(userId, enterpriseId) {
  312. const { channel, list, more } = await initChart(userId, enterpriseId)
  313. hasMore.value = more
  314. channelItem.value = channel.value
  315. items.value = list.value
  316. setScrollBottom()
  317. }
  318. const setScrollBottom = () => {
  319. if (items.value?.length) {
  320. const lastOne = items.value[items.value.length-1]
  321. const index = items.value.length-1
  322. newsId.value = 's' + lastOne.id + index // newsId 需要和聊天列表里面的id对应 永远取最后列表中的最后一个就可以做到发送消息即时滚动到底部
  323. }
  324. }
  325. const hasWaitingProcessingInterview = ref(false) // 是否有待接受的面试邀请
  326. async function getInterviewInviteList () {
  327. if (!info.value.id) return
  328. const { data } = await getInterviewInviteListByInviteUserId(info.value.id)
  329. interview.value = data ? data.slice(0, 1).map(e => {
  330. const statusItem = statusList.value.find(_e => _e.value === e.status)
  331. const statusText = statusItem?.label || ''
  332. const statusColor = ['5', '98', '99'].includes(e.status)
  333. return {
  334. ...e,
  335. statusColor: statusColor ? '#FE574A' : '#0E8E80',
  336. statusText
  337. }
  338. }) : []
  339. hasWaitingProcessingInterview.value = interview.value.some(e => e.status === '0')
  340. }
  341. const getStatusList = async () => {
  342. try {
  343. const { data } = await getDict('menduner_interview_invite_status')
  344. if (data.data.length) {
  345. statusList.value = data.data
  346. }
  347. } catch (error) {
  348. }
  349. }
  350. function handleSend () {
  351. if (!inputValue.value) {
  352. uni.showToast({ title: '不能发送空白信息', icon: 'none' })
  353. return
  354. }
  355. send(inputValue.value, channelItem.value)
  356. }
  357. function handleToCenter () {
  358. uni.navigateTo({
  359. url: '/pagesA/interview/index?index=1'
  360. })
  361. }
  362. // 预览简历
  363. function handlePreview (payload) {
  364. if (!payload?.content?.query?.src) {
  365. uni.showToast({ title: '简历地址不存在', icon: 'none' })
  366. return
  367. }
  368. preview(payload.content.query.src)
  369. }
  370. // 获取简历
  371. async function handleFindResume () {
  372. if (isSendResume.value) {
  373. return
  374. }
  375. try {
  376. // 获取简历列表
  377. const { data } = await getPersonResumeCv()
  378. if (data.length === 0) {
  379. uni.showToast({
  380. title: '您还未上传过简历,请先上传简历后再投递',
  381. icon: 'none',
  382. mask: true,
  383. duration: 3000
  384. })
  385. }
  386. resumeList.value = data || []
  387. resumeCheck.value = data && data.length ? data[0] : ''
  388. popup.value.open('center')
  389. } finally {
  390. uni.hideLoading()
  391. }
  392. }
  393. // 关闭简历窗口
  394. function handleClose () {
  395. popup.value.close()
  396. }
  397. const studentDeliveryFormRef = ref()
  398. // 发送简历
  399. async function handleSendResume () {
  400. if (!Object.keys(resumeCheck.value).length) {
  401. uni.showToast({ title: '请选择要投递的简历', icon: 'none' })
  402. return
  403. }
  404. let practice = null
  405. if (isStudent.value) {
  406. practice = await studentDeliveryFormRef.value.getQueryParams()
  407. if (!practice) return
  408. }
  409. const text = {
  410. remark: '发送简历',
  411. query: {
  412. src: resumeCheck.value.url,
  413. title: resumeCheck.value.title,
  414. id: resumeCheck.value.id,
  415. },
  416. type: 1
  417. }
  418. send (JSON.stringify(text), channelItem.value, 105)
  419. try {
  420. if (isEmployment.value !== '-1') {
  421. await jobCvRelHireSend({
  422. jobId: positionInfo.value.id,
  423. // ...(jobFairId && { jobFairId }),
  424. url: resumeCheck.value.url,
  425. recommendUserId: isEmployment.value,
  426. ...(practice && { practice }),
  427. })
  428. } else {
  429. await jobCvRelSend({
  430. jobId: positionInfo.value.id,
  431. // ...(jobFairId && { jobFairId }),
  432. title: resumeCheck.value.title,
  433. url: resumeCheck.value.url,
  434. type: positionInfo.value.hire ? 1 : 0,
  435. ...(practice && { practice }),
  436. })
  437. }
  438. isSendResume.value = true
  439. popup.value.close()
  440. } catch (error) {
  441. }
  442. }
  443. // 拒绝邀请
  444. // function handleRefuse (val) {
  445. // isAgree.value = false
  446. // chooseInvite.value = val
  447. // confirm.value.open()
  448. // }
  449. // 接受邀请
  450. // function handleAgree (val) {
  451. // isAgree.value = true
  452. // chooseInvite.value = val
  453. // confirm.value.open()
  454. // }
  455. // 确认
  456. // async function handleConfirm () {
  457. // // 拒绝
  458. // if (!isAgree.value) {
  459. // await userInterviewInviteReject(chooseInvite.value.id)
  460. // } else {
  461. // await userInterviewInviteReject(chooseInvite.value.id)
  462. // }
  463. // uni.showToast({ title: '操作成功', icon: 'none' })
  464. // send(JSON.stringify({ id: chooseInvite.value.id }), channelItem.value, isAgree.value ? 104 : 103)
  465. // }
  466. // 关闭
  467. // function handleCloseConfirm () {
  468. // confirm.value.close()
  469. // }
  470. // 查看更多
  471. async function handleMore () {
  472. try {
  473. uni.showLoading({
  474. title: '加载中...'
  475. })
  476. pageSize.value++
  477. const { list, more } = await getMoreMessages(pageSize.value, channelItem.value)
  478. items.value.unshift(...list.value)
  479. hasMore.value = more
  480. } finally {
  481. uni.hideLoading()
  482. }
  483. }
  484. // 上传简历
  485. function handleUploadResume () {
  486. wx.chooseMessageFile({
  487. count: 1,
  488. type: 'file',
  489. success (res) {
  490. // 限制文件上传大小
  491. const size = res.tempFiles[0].size
  492. if (size / (1024*1024) > 20) {
  493. uni.showToast({ icon: 'none', title: '文件大小不能超过20M' })
  494. return
  495. }
  496. const title = res.tempFiles[0].name
  497. const path = res.tempFiles[0].path
  498. const test = /\.(pdf|docx|doc)$/.test(title)
  499. if (!test) {
  500. uni.showToast({
  501. icon: 'none',
  502. title: '请上传pdf、doc、docx类型的文件',
  503. duration: 2000
  504. })
  505. return
  506. }
  507. //效验是否为支持的文件格式
  508. uploadFile(path, 'attachment').then(async (res) => {
  509. if (!res.data) {
  510. uni.showToast({
  511. title: '上传失败',
  512. icon: 'none'
  513. })
  514. return
  515. }
  516. await saveResume({ title, url: res.data })
  517. uni.showToast({
  518. title: '上传成功',
  519. icon: 'success'
  520. })
  521. handleFindResume()
  522. })
  523. }
  524. })
  525. }
  526. // 获取职位信息
  527. async function getMessageTypeSync () {
  528. try {
  529. const { data } = await getMessageType({
  530. fromUid: IM.uid,
  531. channelId: channelItem.value.channelID,
  532. type: 102,
  533. page: {
  534. current: 1,
  535. size: 1,
  536. orders: [
  537. { column: 'message_seq', asc: false }
  538. ]
  539. }
  540. })
  541. if (!data.records || !data.records.length) {
  542. return
  543. }
  544. const _item = data.records.pop()
  545. const _itemJSON = JSON.parse(_item.payload)
  546. const _content = JSON.parse(_itemJSON.content)
  547. positionInfo.value = _content.positionInfo
  548. const { data: check } = await jobCvRelCheckSend({ jobId: _content.positionInfo.id })
  549. isSendResume.value = check
  550. } catch (error) {
  551. console.log(345, error)
  552. }
  553. }
  554. // let jobFairId = ''
  555. onLoad(async (options) => {
  556. info.value = Object.keys(options).reduce((r, k) => {
  557. r[k] = decodeURIComponent(options[k])
  558. return r
  559. }, {})
  560. // jobFairId = info.value.jobFairId
  561. isEmployment.value = info.value.isEmployment
  562. channelItem.value = toChannel(info.value.channelID, info.value.channelType)
  563. if (channelItem.value.channelID === 'system') {
  564. const { list, more } = await getMoreMessages(1, channelItem.value)
  565. hasMore.value = more
  566. items.value = list.value
  567. setScrollBottom()
  568. // 清除未读消息
  569. resetUnread(channelItem.value)
  570. // 更新未读消息
  571. updateUnreadCount()
  572. return
  573. }
  574. await init(info.value.id, info.value.enterpriseId)
  575. // 获取最新的职位信息
  576. await getMessageTypeSync(info.value.id)
  577. await getStatusList()
  578. getInterviewInviteList()
  579. // 清除未读消息
  580. resetUnread(channelItem.value)
  581. // 更新未读消息
  582. updateUnreadCount()
  583. })
  584. </script>
  585. <style lang="scss" scoped>
  586. .white {
  587. color: #FFF !important;
  588. }
  589. .text-left {
  590. text-align: left !important;
  591. }
  592. .text-right {
  593. text-align: right !important;
  594. }
  595. .box {
  596. width: 100%;
  597. height: 100vh;
  598. display: flex;
  599. flex-direction: column;
  600. &-top {
  601. &-title {
  602. padding: 0 60rpx;
  603. box-sizing: border-box;
  604. width: 100%;
  605. height: 80rpx;
  606. line-height: 80rpx;
  607. // text-align: center;
  608. border-bottom: 2rpx solid #EEE;
  609. overflow: hidden;
  610. white-space: nowrap;
  611. text-overflow: ellipsis;
  612. .subText {
  613. font-size: .85em;
  614. color: #999;
  615. .gun {
  616. padding: 0 10rpx;
  617. }
  618. }
  619. }
  620. &-content {
  621. padding: 20rpx 50rpx;
  622. padding-bottom: 20rpx;
  623. border-bottom: 2rpx solid #eee;
  624. .color-666 {
  625. color: #666;
  626. }
  627. .font-weight-bold {
  628. font-weight: bold;
  629. }
  630. .color-primary {
  631. color: #009688;
  632. }
  633. .ml-3 {
  634. margin-left: 40rpx;
  635. }
  636. .mt-1 {
  637. margin-top: 12rpx;
  638. }
  639. .font-size-14 {
  640. font-size: 24rpx;
  641. }
  642. .py-1 {
  643. padding: 4rpx 0;
  644. }
  645. .tipsText {
  646. font-size: .75em;
  647. color: #999;
  648. }
  649. &-t {
  650. display: flex;
  651. justify-content: space-between;
  652. }
  653. .btnBox {
  654. display: flex;
  655. padding: 20rpx 60rpx;
  656. justify-content: space-around;
  657. }
  658. }
  659. }
  660. &-main {
  661. flex: 1;
  662. height: 0;
  663. padding: 40rpx;
  664. // overflow-y: auto;
  665. box-sizing: border-box;
  666. &-more {
  667. display: flex;
  668. justify-content: center;
  669. align-items: center;
  670. color: #24bc3e;
  671. font-size: .9em;
  672. padding: 20rpx 0;
  673. }
  674. &-time {
  675. user-select: none;
  676. position: relative;
  677. top: 16rpx;
  678. margin: 40rpx 0;
  679. text-align: center;
  680. max-height: 40rpx;
  681. text-align: center;
  682. font-weight: 400;
  683. font-size: .85em;
  684. color: #999;
  685. }
  686. .jobCard {
  687. padding: 30rpx;
  688. background: #E2F2F0;
  689. color: #009688 ;
  690. margin-top: 20rpx;
  691. max-width: unset;
  692. margin-right: 0;
  693. &-title {
  694. font-size: 1.2em;
  695. }
  696. &-subtitle {
  697. padding: 10rpx 0;
  698. // font-size: .5em;
  699. }
  700. &-divider {
  701. width: 100%;
  702. height: 2rpx;
  703. margin: 20rpx 0;
  704. background: #ddd;
  705. }
  706. &-tag {
  707. display: flex;
  708. flex-wrap: wrap;
  709. }
  710. }
  711. .message-view_item {
  712. display: flex;
  713. flex-direction: row;
  714. align-items: flex-start;
  715. margin: 16rpx 0;
  716. position: relative;
  717. .image {
  718. width: 60rpx;
  719. height: 60rpx;
  720. border-radius: 180rpx;
  721. // flex-grow: 1;
  722. // flex-shrink: 0;
  723. overflow: hidden;
  724. .header {
  725. width: 60rpx;
  726. height: 60rpx;
  727. }
  728. }
  729. .text-end {
  730. text-align: right !important;
  731. width: 400rpx;
  732. margin-right: 20rpx;
  733. }
  734. .message-text {
  735. overflow-wrap: break-word;
  736. background-color: #f0f2f5;
  737. border-radius: 12rpx;
  738. max-width: 75%;
  739. padding: 20rpx;
  740. &.active {
  741. background: #d5e6e8;
  742. }
  743. &.card {
  744. background: #E2F2F0;
  745. color: #009688 ;
  746. margin-top: 20rpx;
  747. max-width: unset;
  748. margin-right: 0;
  749. .btn-actions {
  750. margin: 40rpx auto 20rpx auto ;
  751. text-align: center;
  752. .btn {
  753. padding: 10rpx 30rpx;
  754. background: #C8E7D8;
  755. color: #43AC57;
  756. font-size: .75em;
  757. border-radius: 10rpx;
  758. }
  759. }
  760. }
  761. &.none {
  762. padding: 10rpx 0;
  763. background-color: unset;
  764. }
  765. &.active {
  766. background: #d5e6e8;
  767. }
  768. }
  769. }
  770. .is-self {
  771. flex-direction: row-reverse;
  772. display: flex;
  773. .message-text {
  774. margin-right: 20rpx;
  775. }
  776. }
  777. .is-other {
  778. .message-text {
  779. margin-left: 20rpx;
  780. }
  781. }
  782. }
  783. &-bottom {
  784. max-height: 300rpx;
  785. border-top: 2rpx solid #EEE;
  786. background: rgba(230, 230, 230, 0.5);
  787. padding: 20rpx 40rpx;
  788. box-sizing: border-box;
  789. &-tool {
  790. margin-bottom: 30rpx;
  791. .toolBtn {
  792. padding: 12rpx 20rpx;
  793. font-size: 24rpx;
  794. background: #18bc37;
  795. color: #FFF;
  796. border-radius: 10rpx;
  797. }
  798. }
  799. .textBox {
  800. align-items: flex-end;
  801. }
  802. textarea {
  803. border-radius: 10rpx;
  804. width: 100%;
  805. min-height: 80rpx;
  806. max-height: 180rpx;
  807. padding: 20rpx;
  808. box-sizing: border-box;
  809. background: #FFF;
  810. }
  811. .submitBtn {
  812. width: 140rpx;
  813. line-height: 80rpx;
  814. height: 80rpx;
  815. font-size: 28rpx;
  816. background: #18bc37;
  817. color: #FFF;
  818. margin-left: 20rpx;
  819. text-align: center;
  820. border-radius: 10rpx;
  821. }
  822. }
  823. .popup-title {
  824. padding: 30rpx 20rpx;
  825. display: flex;
  826. justify-content: space-between;
  827. border-bottom: 2rpx solid #DDD;
  828. }
  829. .popup-content {
  830. padding: 20rpx 40rpx;
  831. color: #999;
  832. display: flex;
  833. align-content: center;
  834. justify-items: center;
  835. .iconBox {
  836. width: 40rpx;
  837. }
  838. .text {
  839. margin-left: 20rpx;
  840. &.active {
  841. color: #00B760;
  842. }
  843. }
  844. }
  845. .popup-upload {
  846. // display: flex;
  847. // align-items: center;
  848. // justify-content: center;
  849. // flex-direction: column;
  850. // width: 70%;
  851. width: 80vw;
  852. font-size: .75em;
  853. color: #999;
  854. padding: 40rpx;
  855. &-box {
  856. width: 200rpx;
  857. height: 200rpx;
  858. text-align: center;
  859. line-height: 200rpx;
  860. border: 4rpx solid #ddd;
  861. border-radius: 8rpx;
  862. margin: 0 auto;
  863. }
  864. }
  865. .popup-actions {
  866. padding: 60rpx;
  867. .default {
  868. background: #00B760;
  869. color: #DDD;
  870. font-size: .9em;
  871. }
  872. }
  873. }
  874. </style>