CooperationExchangeListDetails.vue 38 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234
  1. <template>
  2. <div>
  3. <div class="autoBox box">
  4. <div style="margin-left: 20px">
  5. <el-breadcrumb separator="/">
  6. <el-breadcrumb-item :to="{ path: 'home' }">{{
  7. $t("common.Home")
  8. }}</el-breadcrumb-item>
  9. <el-breadcrumb-item :to="{ path: 'cooperationExchange' }">
  10. {{ $t("common.Cooperation&Communication") }}
  11. </el-breadcrumb-item>
  12. <el-breadcrumb-item>{{
  13. $t("common.ActivitiesInfo")
  14. }}</el-breadcrumb-item>
  15. </el-breadcrumb>
  16. </div>
  17. <div
  18. style="margin-top: 10px; width: 100%; height: 260px; margin-left: 20px"
  19. >
  20. <div style="float: left; width: 55%; height: 100%">
  21. <img
  22. :src="
  23. 'api/file/pub/' + countryList.activityLogo + '?custom=600_260'
  24. "
  25. alt=""
  26. style="width: 100%; height: 260px"
  27. v-if="countryList.activityLogo"
  28. />
  29. <img
  30. :src="'api/file/pub/'"
  31. alt=""
  32. style="width: 100%; height: 260px"
  33. v-if="!countryList.activityLogo"
  34. />
  35. </div>
  36. <div style="float: left; width: 42%; height: 100%; position: relative">
  37. <!-- <span style="position: absolute;top: 0;right: 0;font-size: 14px;
  38. color: #0000ff;cursor: pointer;">分享</span> -->
  39. <div style="margin-top: 20px; width: 100%">
  40. <div
  41. style="
  42. line-height: 25px;
  43. text-align: left;
  44. margin-left: 50px;
  45. font-weight: 700;
  46. "
  47. >
  48. {{ countryList.activityName }}
  49. <el-tag type="success">{{
  50. $i18n.locale == "zh"
  51. ? countryList.activityStatus
  52. : activityStatusMap.get(countryList.activityStatus)
  53. }}</el-tag>
  54. </div>
  55. <div style="width: 100%; line-height: 45px; font-size: 14px">
  56. <span style="margin-left: 50px; margin-right: 15px"
  57. >{{ $t("common.place") }}:{{ countryList.activityCity }}
  58. </span>
  59. <span
  60. >{{ $t("common.line") }}:{{
  61. formatDate(countryList.activityStartTime)
  62. }}
  63. </span>
  64. <!-- <el-button type="" style="margin-left: 10px;margin-top: 10px;height: 40px;width: 170px;" icon="el-icon-star-off" :style="ifcommon?'color: #66b1ff;':''" @click="follow()">
  65. {{ifcommon?$t('common.Concerned'):$t('common.follow')}}
  66. </el-button> -->
  67. <!-- <span style="margin-left: 10px;margin-top: 10px;height: 40px;width: 170px;" :style="ifcommon?'color: #66b1ff;':''" @click="follow()">
  68. ifcommon? <svg t="1602568727676" class="icon" viewBox="0 0 1092 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1935" width="16" height="16"><path d="M1080.270639 453.733718c-77.161903 88.184889-214.58473 234.425705-214.58473 234.425705s22.045972 160.203798 35.273956 269.70066c5.878993 55.85193-37.478953 80.101899-85.980892 58.054927-92.594883-43.357945-233.690706-110.96686-265.290665-126.399841-32.334959 14.697981-174.165781 81.571897-267.495663 124.928843-49.236938 21.310973-92.594883-2.204997-87.45089-58.054927 12.492984-109.496862 35.273956-268.965661 35.273955-268.965661S91.123885 541.917607 13.227983 453.732718c-27.924965-32.334959-9.551988-77.896902 44.827944-85.980891 111.701859-19.841975 284.397642-51.441935 284.397642-51.441935s94.798881-163.143794 154.324805-263.086669C529.848333-7.7717 552.629304-0.422709 556.304299 1.047289c10.287987 2.939996 26.455967 15.431981 47.032941 52.175934 58.789926 99.943874 152.119808 263.087669 152.119808 263.087669s170.491785 31.60096 280.723647 51.441935c53.645932 8.08399 71.28291 54.380931 44.092944 85.980891z" fill="#1296db" p-id="1936"></path></svg>
  69. :<svg t="1602568727676" class="icon" viewBox="0 0 1092 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1935" width="16" height="16"><path d="M1080.270639 453.733718c-77.161903 88.184889-214.58473 234.425705-214.58473 234.425705s22.045972 160.203798 35.273956 269.70066c5.878993 55.85193-37.478953 80.101899-85.980892 58.054927-92.594883-43.357945-233.690706-110.96686-265.290665-126.399841-32.334959 14.697981-174.165781 81.571897-267.495663 124.928843-49.236938 21.310973-92.594883-2.204997-87.45089-58.054927 12.492984-109.496862 35.273956-268.965661 35.273955-268.965661S91.123885 541.917607 13.227983 453.732718c-27.924965-32.334959-9.551988-77.896902 44.827944-85.980891 111.701859-19.841975 284.397642-51.441935 284.397642-51.441935s94.798881-163.143794 154.324805-263.086669C529.848333-7.7717 552.629304-0.422709 556.304299 1.047289c10.287987 2.939996 26.455967 15.431981 47.032941 52.175934 58.789926 99.943874 152.119808 263.087669 152.119808 263.087669s170.491785 31.60096 280.723647 51.441935c53.645932 8.08399 71.28291 54.380931 44.092944 85.980891z" fill="#8a8a8a" p-id="1936"></path></svg>
  70. {{ifcommon?:$t('common.follow')}}
  71. </span> -->
  72. <span
  73. v-if="ifcommon"
  74. @click="follow()"
  75. style="margin-left: 30px; color: #66b1ff; cursor: pointer"
  76. >
  77. <i class="el-icon-star-off"></i>
  78. {{ $t("common.Concerned") }}
  79. </span>
  80. <span
  81. v-else
  82. @click="follow()"
  83. style="margin-left: 30px; cursor: pointer"
  84. >
  85. <i class="el-icon-star-off"></i>
  86. {{ $t("common.follow") }}
  87. </span>
  88. <div
  89. style="
  90. width: 80%;
  91. font-size: 14px;
  92. height: 75px;
  93. -webkit-box-orient: vertical;
  94. position: relative;
  95. line-height: 1.4em;
  96. overflow: hidden;
  97. height: 3.6em;
  98. color: #666666;
  99. margin-left: 50px;
  100. line-height: 25px;
  101. margin-top: -10px;
  102. "
  103. class="plateCountry"
  104. >
  105. {{ countryList.activityIntroduce }}
  106. </div>
  107. <div
  108. style="
  109. width: 80%;
  110. font-size: 14px;
  111. height: 40px;
  112. margin-left: 50px;
  113. margin-top: 20px;
  114. "
  115. v-if="this.activityApplyCount != 0"
  116. >
  117. {{ $t("common.Existing") }} {{ this.activityApplyCount }}
  118. {{ $t("common.UnitRegistration") }}
  119. </div>
  120. <div
  121. style="
  122. font-size: 14px;
  123. height: 40px;
  124. text-align: center;
  125. margin-top: 20px;
  126. "
  127. v-if="
  128. $i18n.locale == 'zh' &&
  129. countryList.activityStatus == '报名中' &&
  130. countryList.registtrationFlag == 'y'
  131. "
  132. >
  133. <el-button
  134. :type="
  135. countryList.activityStatus == '未开始'
  136. ? 'success'
  137. : countryList.activityStatus == '报名中'
  138. ? 'primary'
  139. : countryList.activityStatus == '已结束'
  140. ? 'info'
  141. : 'warning'
  142. "
  143. round
  144. style="width: 76px; height: 24px; line-height: 4px"
  145. @click="signUp"
  146. >
  147. 报名
  148. </el-button>
  149. </div>
  150. <div
  151. style="
  152. font-size: 14px;
  153. height: 40px;
  154. text-align: center;
  155. margin-top: 0px;
  156. "
  157. v-if="
  158. $i18n.locale == 'en' &&
  159. countryList.activityStatus == '报名中' &&
  160. countryList.registtrationFlag == 'y'
  161. "
  162. >
  163. <el-button
  164. :type="
  165. countryList.activityStatus == '未开始'
  166. ? 'success'
  167. : countryList.activityStatus == '报名中'
  168. ? 'primary'
  169. : countryList.activityStatus == '已结束'
  170. ? 'info'
  171. : 'warning'
  172. "
  173. round
  174. style="width: 196px; height: 34px; line-height: 4px"
  175. @click="signUp"
  176. >
  177. {{ activityStatusMap.get(countryList.activityStatus) }}
  178. </el-button>
  179. </div>
  180. </div>
  181. </div>
  182. </div>
  183. </div>
  184. <div
  185. style="width: 100%; height: 25px; margin-top: 20px; margin-left: 20px"
  186. >
  187. <div>
  188. <span
  189. v-for="(item, index) in screen"
  190. :class="i == index ? 'screen2 cursor' : 'screen1 cursor'"
  191. @click="screens(item, index)"
  192. >{{ $t(item.lable) }}</span
  193. >
  194. </div>
  195. </div>
  196. <div>
  197. <!-- 活动介绍 -->
  198. <CooperationActiveIntroduce
  199. style="min-height: 200px"
  200. :activityIntroduction="countryList.activityIntroduction"
  201. v-if="i == 0"
  202. >
  203. </CooperationActiveIntroduce>
  204. <!-- 活动议程 -->
  205. <CooperationActiveAgenda
  206. style="min-height: 200px"
  207. :programOutline="countryList.programOutline"
  208. v-if="i == 1"
  209. >
  210. </CooperationActiveAgenda>
  211. <!-- 活动回顾 -->
  212. <CooperationActiveReview
  213. style="min-height: 200px"
  214. :activityReview="countryList.activityReview"
  215. :id="countryList.baseActivityEntityId"
  216. :countryList="countryList"
  217. v-if="i == 2"
  218. >
  219. </CooperationActiveReview>
  220. <!-- 活动成果 -->
  221. <CooperationActiceResults
  222. style="min-height: 200px"
  223. :activityReview="countryList.activityReview"
  224. :id="countryList.id"
  225. v-if="i == 3"
  226. >
  227. </CooperationActiceResults>
  228. </div>
  229. </div>
  230. <el-dialog
  231. :title="$i18n.locale == 'zh' ? '提示' : 'Reminder'"
  232. :visible.sync="toViewLogin"
  233. :width="$i18n.locale == 'zh' ? '500px' : '750px'"
  234. :height="$i18n.locale == 'zh' ? '300px' : '386px'"
  235. :before-close="toViewLoginChange"
  236. >
  237. <div style="width: 100%; height: 100%">
  238. <img
  239. src="@/assets/img/loginTips.png"
  240. alt=""
  241. style="width: 180px; height: 180px; margin-left: 20px"
  242. />
  243. <div
  244. style="float: right; margin-right: 20px"
  245. :style="
  246. $i18n.locale == 'zh'
  247. ? 'width: 49%;margin-top: 10px;'
  248. : 'width: 453px;margin-top: -25px;'
  249. "
  250. >
  251. <div
  252. style="
  253. font-size: 20px;
  254. font-weight: normal;
  255. color: #333333;
  256. font-family: HiraginoSansGB-W3, HiraginoSansGB;
  257. line-height: 40px;
  258. "
  259. >
  260. {{ $t("common.ReminderFirst") }}
  261. </div>
  262. <div
  263. style="
  264. font-size: 16px;
  265. font-family: HiraginoSansGB-W3, HiraginoSansGB;
  266. font-weight: normal;
  267. color: #666666;
  268. line-height: 30px;
  269. "
  270. >
  271. {{ $t("common.ReminderSecond") }}
  272. <span style="color: #0091ff; font-size: 18px">{{ num }}</span>
  273. {{ $t("common.ReminderThird") }}
  274. </div>
  275. <div
  276. style="
  277. font-size: 14px;
  278. font-family: HiraginoSansGB-W3, HiraginoSansGB;
  279. font-weight: normal;
  280. color: #666666;
  281. line-height: 30px;
  282. "
  283. >
  284. {{ $t("common.ReminderForth") }}
  285. </div>
  286. <div
  287. style="
  288. font-size: 14px;
  289. font-family: HiraginoSansGB-W3, HiraginoSansGB;
  290. height: 33px;
  291. line-height: 60px;
  292. font-weight: normal;
  293. color: #0091ff;
  294. "
  295. >
  296. <span
  297. style="margin-left: 40px"
  298. class="cursor"
  299. @click="toView('login')"
  300. >
  301. {{ $t("common.ReminderFifth") }}
  302. </span>
  303. <span
  304. style="margin-left: 10px"
  305. class="cursor"
  306. @click="toView('Register')"
  307. >
  308. {{ $t("common.ReminderSixth") }}
  309. </span>
  310. </div>
  311. </div>
  312. </div>
  313. </el-dialog>
  314. <el-dialog
  315. :title="$t('common.ActivityRegistration')"
  316. :visible.sync="centerDialogVisible"
  317. width="50%"
  318. >
  319. <el-form
  320. :rules="rules"
  321. ref="formLabelAlign"
  322. :model="formLabelAlign"
  323. class="demo-ruleForm"
  324. v-show="$i18n.locale == 'zh'"
  325. label-width="200px"
  326. style="width: 700px; margin: auto; margin-top: -20px"
  327. >
  328. <el-form-item
  329. :label="$t('common.ActivityName')"
  330. style="font-weight: 600; color: rgb(153, 153, 153) !important"
  331. >
  332. <span style="line-height: 50px">{{ countryList.activityName }}</span>
  333. </el-form-item>
  334. <el-form-item label="姓名" class="el-label">
  335. <el-input
  336. class="el-input"
  337. v-model="formLabelAlign.name"
  338. :placeholder="$t('common.NameTips')"
  339. ></el-input>
  340. </el-form-item>
  341. <el-form-item
  342. :label="$t('common.NameoftheEntity')"
  343. class="el-label"
  344. prop="unitName"
  345. >
  346. <el-select
  347. popper-class="mySelect"
  348. style="width: 400px"
  349. v-model="formLabelAlign.unitName"
  350. filterable
  351. :placeholder="$t('common.NameEntityTips')"
  352. @blur="selectBlur"
  353. >
  354. <el-option
  355. v-for="item in projectList"
  356. :key="item.baseEntityId"
  357. :label="item.unitName"
  358. :value="item.baseEntityId"
  359. >
  360. </el-option>
  361. </el-select>
  362. </el-form-item>
  363. <el-form-item
  364. :label="$t('common.Position')"
  365. class="el-label"
  366. prop="post"
  367. >
  368. <el-input
  369. class="el-input"
  370. v-model="formLabelAlign.post"
  371. :placeholder="$t('common.PositionTips')"
  372. ></el-input>
  373. </el-form-item>
  374. <el-form-item
  375. style="position: relative"
  376. :label="$t('common.ContactPhoneNumber')"
  377. prop="contactNumber"
  378. class="dcp_input"
  379. >
  380. <GlobalRoaming
  381. ref="GlobalRoaming"
  382. :size="{ width: '398px' }"
  383. v-model="formLabelAlign.contactNumber"
  384. @getAreaCode="getPassAreaCode"
  385. ></GlobalRoaming>
  386. </el-form-item>
  387. <el-form-item
  388. :label="$t('common.Email')"
  389. class="el-label"
  390. prop="mailbox"
  391. >
  392. <el-input
  393. class="el-input"
  394. v-model="formLabelAlign.mailbox"
  395. :placeholder="$t('common.EmailTips')"
  396. ></el-input>
  397. </el-form-item>
  398. </el-form>
  399. <el-form
  400. :rules="rules"
  401. ref="formLabelAlign"
  402. :model="formLabelAlign"
  403. class="demo-ruleForm"
  404. v-show="$i18n.locale == 'en'"
  405. label-width="200px"
  406. style="width: 700px; margin: auto; margin-top: -20px"
  407. >
  408. <el-form-item
  409. :label="$t('common.ActivityName')"
  410. style="font-weight: 600; color: rgb(153, 153, 153) !important"
  411. >
  412. <span style="line-height: 50px">{{ countryList.activityName }}</span>
  413. </el-form-item>
  414. <el-form-item
  415. label="Country"
  416. class="el-label"
  417. prop="unitCountry"
  418. v-if="$i18n.locale !== 'zh'"
  419. >
  420. <el-select
  421. class="el-select"
  422. filterable
  423. v-model="formLabelAlign.unitCountry"
  424. :placeholder="$t('common.CountryTips')"
  425. style="width: 400px"
  426. >
  427. <el-option
  428. :label="item.label"
  429. :value="item.value"
  430. v-for="(item, index) in countrydate"
  431. ></el-option>
  432. </el-select>
  433. </el-form-item>
  434. <el-form-item
  435. label="Region"
  436. class="el-label"
  437. prop="Region"
  438. v-if="$i18n.locale == 'en'"
  439. >
  440. <el-select
  441. class="el-select"
  442. filterable
  443. v-model="formLabelAlign.Region"
  444. :placeholder="$t('common.RegionTips')"
  445. style="width: 400px"
  446. >
  447. <el-option
  448. :label="item.label"
  449. :value="item.label"
  450. v-for="(item, index) in Regiondate"
  451. ></el-option>
  452. </el-select>
  453. <!-- <el-input class="el-input" v-model="formLabelAlign.Region" :placeholder="$t('common.RegionTips')"></el-input> -->
  454. </el-form-item>
  455. <el-form-item
  456. label="Title"
  457. class="el-label"
  458. prop="Title"
  459. v-if="$i18n.locale == 'en'"
  460. >
  461. <!-- <el-input class="el-input" v-model="formLabelAlign.Title"></el-input> -->
  462. <el-select
  463. class="el-select"
  464. filterable
  465. v-model="formLabelAlign.Title"
  466. :placeholder="$t('common.TitleTips')"
  467. style="width: 400px"
  468. >
  469. <el-option
  470. :label="item.label"
  471. :value="item.value"
  472. v-for="(item, index) in titleList"
  473. ></el-option>
  474. </el-select>
  475. </el-form-item>
  476. <el-form-item
  477. label="First(given) Name(s)"
  478. class="el-label"
  479. prop="FirstName"
  480. v-if="$i18n.locale == 'en'"
  481. >
  482. <el-input
  483. class="el-input"
  484. v-model="formLabelAlign.FirstName"
  485. :placeholder="$t('common.FirstNameTips')"
  486. ></el-input>
  487. </el-form-item>
  488. <el-form-item
  489. label="Last Name"
  490. class="el-label"
  491. prop="LastName"
  492. v-if="$i18n.locale == 'en'"
  493. >
  494. <el-input
  495. class="el-input"
  496. v-model="formLabelAlign.LastName"
  497. :placeholder="$t('common.LastNameTips')"
  498. ></el-input>
  499. </el-form-item>
  500. <el-form-item
  501. :label="$t('common.NameoftheEntity')"
  502. class="el-label"
  503. prop="unitName"
  504. >
  505. <el-select
  506. :no-match-text="$i18n.locale == 'zh' ? '无匹配数据' : 'No Data'"
  507. popper-class="mySelect"
  508. style="width: 400px"
  509. v-model="formLabelAlign.unitName"
  510. filterable
  511. :placeholder="$t('common.NameEntityTips')"
  512. @blur="selectBlur"
  513. >
  514. <el-option
  515. v-for="item in projectList"
  516. :key="item.baseEntityId"
  517. :label="item.unitName"
  518. :value="item.baseEntityId"
  519. >
  520. </el-option>
  521. </el-select>
  522. </el-form-item>
  523. <el-form-item
  524. :label="$t('common.Position')"
  525. class="el-label"
  526. prop="post"
  527. >
  528. <el-input
  529. class="el-input"
  530. v-model="formLabelAlign.post"
  531. :placeholder="$t('common.PositionTips')"
  532. ></el-input>
  533. </el-form-item>
  534. <el-form-item
  535. style="position: relative"
  536. :label="$t('common.ContactPhoneNumber')"
  537. prop="contactNumber"
  538. class="dcp_input"
  539. >
  540. <GlobalRoaming
  541. ref="GlobalRoaming"
  542. :size="{ width: '398px' }"
  543. v-model="formLabelAlign.contactNumber"
  544. @getAreaCode="getPassAreaCode"
  545. ></GlobalRoaming>
  546. </el-form-item>
  547. <el-form-item
  548. :label="$t('common.Email')"
  549. class="el-label"
  550. prop="mailbox"
  551. >
  552. <el-input
  553. class="el-input"
  554. v-model="formLabelAlign.mailbox"
  555. :placeholder="$t('common.EmailTips')"
  556. ></el-input>
  557. </el-form-item>
  558. </el-form>
  559. <span slot="footer" class="dialog-footer">
  560. <el-button @click="centerDialogVisible = false">{{
  561. $t("common.Cancel")
  562. }}</el-button>
  563. <el-button type="primary" @click="save()">{{
  564. $t("common.Confirm")
  565. }}</el-button>
  566. </span>
  567. </el-dialog>
  568. </div>
  569. </template>
  570. <script>
  571. import { getList } from "@/api/country";
  572. import CooperationActiveIntroduce from "./CooperationActiveIntroduce"; // 活动介绍
  573. import CooperationActiveAgenda from "./CooperationActiveAgenda"; // 活动议程
  574. import CooperationActiveReview from "./CooperationActiveReview"; // 活动回顾
  575. import CooperationActiceResults from "./CooperationActiceResults"; // 活动成果
  576. import { countryNationalSpace } from "@/api/cooperation/baseCooperationUnit";
  577. import GlobalRoaming from "@/components/GlobalRoaming";
  578. import {
  579. saveActivityOrUpdate,
  580. getApproverId,
  581. } from "@/api/meeting/meetingApply";
  582. import { sysAttachmentInfos } from "@/api/cooperation/baseCooperationUnit";
  583. import { getToken } from "@/utils/auth";
  584. import { saveFollowModel } from "@/api/operation/basePortalModelFollowInfo";
  585. import { getFollowModeNumlByModelIdAndUserId } from "@/api/operation/basePortalModelFollowInfo";
  586. import { getDicts } from "@/api/dict";
  587. import { addIntegral, addGrowth } from "@/utils/toCompleteTask";
  588. import Base from "@/views/base/Base";
  589. export default {
  590. name: "CooperationExchangeListDetails",
  591. extends: Base,
  592. components: {
  593. CooperationActiveIntroduce,
  594. CooperationActiveAgenda,
  595. CooperationActiveReview,
  596. CooperationActiceResults,
  597. GlobalRoaming,
  598. },
  599. data() {
  600. return {
  601. index: 1,
  602. projectList: [],
  603. i: "0",
  604. id: this.$route.query.key,
  605. language: "",
  606. //流程改造4
  607. processKey: "MEETING_APPROVE",
  608. approverId: "",
  609. centerDialogVisible: false,
  610. select: "0086",
  611. countryList: {},
  612. countrydate: [], //国家数据
  613. Regiondate: [],
  614. titleList: [
  615. {
  616. value: "Mr.",
  617. lable: "Mr.",
  618. },
  619. {
  620. value: "Ms.",
  621. lable: "Ms.",
  622. },
  623. {
  624. value: "Dr.",
  625. lable: "Dr.",
  626. },
  627. {
  628. value: "Prof.",
  629. lable: "Prof.",
  630. },
  631. ],
  632. activityStatusMap: new Map(),
  633. screen: [
  634. // {
  635. // value: '1',
  636. // lable: 'common.ActivityIntroduction'
  637. // }, {
  638. // value: '1',
  639. // lable: 'common.ActivityAgenda'
  640. // }, {
  641. // value: '1',
  642. // lable: 'common.ActivityReview'
  643. // }
  644. // ,{
  645. // value:'1',
  646. // lable:'common.ActivityResults'
  647. // }
  648. ],
  649. formLabelAlign: {
  650. id: null,
  651. name: "",
  652. unitName: "",
  653. ifName: null,
  654. post: "",
  655. contactNumber: "",
  656. mailbox: "",
  657. FirstName: "",
  658. LastName: "",
  659. unitCountry: "",
  660. Title: "",
  661. Region: "",
  662. auditStatusDict: "",
  663. language: "",
  664. selectCode: "",
  665. invitationCode: "", //邀请码
  666. meetingId: "", //会议id
  667. },
  668. activityApplyCount: "",
  669. dialogVisible: false,
  670. toViewLogin: false,
  671. num: 5,
  672. ifcommon: false,
  673. user: {
  674. umsUser: {},
  675. },
  676. };
  677. },
  678. //流程改造5
  679. props: {
  680. firstTaskConfig: {
  681. type: Object,
  682. default: () => {
  683. return {
  684. approver: "mutil",
  685. group: "",
  686. duty: "",
  687. };
  688. },
  689. },
  690. },
  691. watch: {
  692. "$i18n.locale"() {
  693. this.getBaseList(); // 获取企业报名信息
  694. this.getInitData();
  695. },
  696. toViewLogin() {
  697. if (this.toViewLogin == true) {
  698. this.loginTipsChange();
  699. }
  700. },
  701. },
  702. destroyed() {
  703. this.centerDialogVisible = false;
  704. },
  705. computed: {
  706. rules() {
  707. return {
  708. // name: [
  709. // {required: true, message: '请输入姓名', trigger: 'blur'},
  710. // ],
  711. Country: [
  712. {
  713. required: true,
  714. message: "Please enter Country",
  715. trigger: "change",
  716. },
  717. ],
  718. unitName: [
  719. {
  720. required: true,
  721. message:
  722. this.$i18n.locale == "zh"
  723. ? "请输入单位名称"
  724. : "Please enter the unit name",
  725. trigger: "change",
  726. },
  727. ],
  728. unitNameEn: [
  729. {
  730. required: true,
  731. message: "Please enter the unit name",
  732. trigger: "blur",
  733. },
  734. ],
  735. Region: [
  736. { required: true, message: "Please select an area", trigger: "blur" },
  737. ],
  738. Title: [
  739. { required: true, message: "Please choose a title", trigger: "blur" },
  740. ],
  741. unitCountry: [
  742. {
  743. required: true,
  744. message: "Please enter the name of the country",
  745. trigger: "change",
  746. },
  747. ],
  748. FirstName: [
  749. {
  750. required: true,
  751. message: "Please enter First(given) Name(s)",
  752. trigger: "blur",
  753. },
  754. ],
  755. LastName: [
  756. {
  757. required: true,
  758. message: "Please enter Last Name",
  759. trigger: "blur",
  760. },
  761. ],
  762. post: [
  763. {
  764. required: true,
  765. message:
  766. this.$i18n.locale == "zh"
  767. ? "请输入职务"
  768. : "Please enter job title",
  769. trigger: "blur",
  770. },
  771. ],
  772. postEn: [
  773. {
  774. required: true,
  775. message: "Please enter job title",
  776. trigger: "blur",
  777. },
  778. ],
  779. contactNumber: [
  780. {
  781. required: true,
  782. message:
  783. this.$i18n.locale == "zh"
  784. ? "请输入联系电话"
  785. : "Please enter cellphone number",
  786. trigger: "blur",
  787. },
  788. {
  789. pattern: /^0{0,1}(13[0-9]|15[7-9]|153|151|156|18[1-9])[0-9]{8}$/,
  790. message:
  791. this.$i18n.locale == "zh"
  792. ? "联系电话格式不正确,请重新输入"
  793. : "Contact number format is incorrect, please re-enter",
  794. trigger: "blur",
  795. },
  796. ],
  797. // contactNumberEn:[
  798. // {required: true, message:, trigger: 'blur'},
  799. // {
  800. // pattern: /^0{0,1}(13[0-9]|15[7-9]|153|156|18[7-9])[0-9]{8}$/,
  801. // message: 'Contact number format is incorrect, please re-enter',
  802. // trigger: 'blur'
  803. // }
  804. // ],
  805. // mailboxEn: [
  806. // {required: true, message: 'Please enter email address', trigger: 'blur'},
  807. // {
  808. // pattern: /^[a-zA-Z0-9]+([-_.][a-zA-Z0-9]+)*@[a-zA-Z0-9]+([-_.][a-zA-Z0-9]+)*\.[a-z]{2,}$/,
  809. // message: 'Email format is incorrect, please re-enter',
  810. // trigger: 'blur,change'
  811. // }
  812. // ],
  813. mailbox: [
  814. {
  815. required: true,
  816. message:
  817. this.$i18n.locale == "zh"
  818. ? "请输入邮箱"
  819. : "Please enter email address",
  820. trigger: "blur",
  821. },
  822. {
  823. pattern:
  824. /^[a-zA-Z0-9]+([-_.][a-zA-Z0-9]+)*@[a-zA-Z0-9]+([-_.][a-zA-Z0-9]+)*\.[a-z]{2,}$/,
  825. message:
  826. this.$i18n.locale == "zh"
  827. ? "邮箱格式不正确,请重新输入"
  828. : "Email format is incorrect, please re-enter",
  829. trigger: "blur",
  830. },
  831. ],
  832. };
  833. },
  834. },
  835. mounted() {
  836. let language = this.$route.query.language;
  837. window.localStorage.setItem("locale", language);
  838. this.getBaseList(); // 获取企业报名信息
  839. this.getInitData();
  840. this.initData();
  841. //this.getList();
  842. },
  843. methods: {
  844. initData() {
  845. this.user = JSON.parse(window.localStorage.getItem("user"));
  846. },
  847. selectBlur(e) {
  848. this.formLabelAlign.unitName = "";
  849. if (e.target.value) {
  850. // 不在表单的时候不需要判断,也不需要isname字段
  851. // 输入内容不在下拉框中时,formLabelAlign.unitName=e.target.value,数据传输为unitName,有内容时,添加字段unitID
  852. this.formLabelAlign.unitName = e.target.value;
  853. this.formLabelAlign.ifName = "false";
  854. } else {
  855. this.formLabelAlign.ifName = "true";
  856. }
  857. },
  858. follow() {
  859. if (this.ifcommon) {
  860. this.followActivitie("unfollow");
  861. } else {
  862. this.followActivitie("follow");
  863. }
  864. },
  865. followActivitie(followType) {
  866. let user = window.localStorage.getItem("user");
  867. if (!this.$Cookies.get("token")) {
  868. // this.$message.warning("请先登录");
  869. // this.$confirm('检测到您未登录,是否登录')
  870. // .then(_ => {
  871. // this.toView('login');
  872. // })
  873. // .catch(_ => {});
  874. this.toViewLogin = true;
  875. } else {
  876. var users = JSON.parse(user);
  877. var token = "" + getToken();
  878. var projectId = this.countryList.baseActivityEntityId;
  879. var userId = users.userId;
  880. // 接口逻辑
  881. this.submitHandler((token) => {
  882. saveFollowModel(projectId, "activity", userId, followType, token)
  883. .then((result) => {
  884. // console.log(result);
  885. this.$message({
  886. message: result.data,
  887. type: "success",
  888. });
  889. this.ifcommon = !this.ifcommon;
  890. this.resetToken();
  891. })
  892. .catch((error) => {
  893. // 此处你的业务代码
  894. });
  895. });
  896. }
  897. },
  898. // 未登录跳转
  899. loginTipsChange() {
  900. const that = this;
  901. this.num = 5;
  902. // clearInterval(timer_interval);
  903. this.timer = setInterval(function () {
  904. if (that.num > 0) {
  905. that.num--;
  906. } else {
  907. if (that.toViewLogin == true) {
  908. clearInterval(that.timer);
  909. that.toView("login");
  910. } else {
  911. clearInterval(that.timer);
  912. }
  913. }
  914. }, 1000);
  915. },
  916. // 判断未登录跳转是否关闭
  917. toViewLoginChange(done) {
  918. this.toViewLogin = false;
  919. this.num = 5;
  920. clearInterval(this.timer);
  921. },
  922. getPassAreaCode(code) {
  923. this.select = code;
  924. this.formLabelAlign.selectCode = code;
  925. },
  926. getInitData() {
  927. const that = this;
  928. var users = localStorage.getItem("user");
  929. var user = JSON.parse(users);
  930. if (user != null) {
  931. this.formLabelAlign.name = user.realName;
  932. }
  933. this.language = this.$i18n.locale.toUpperCase();
  934. countryNationalSpace({
  935. baseActivityEntityId: this.id,
  936. language: this.language,
  937. }).then((res) => {
  938. console.log(
  939. res,
  940. "----------------------报名单位---------------------------"
  941. );
  942. this.formLabelAlign.meetingId = res.data.meetingId;
  943. this.meetingId = res.data.meetingId;
  944. if (res.data.activityInfos != undefined) {
  945. that.countryList = res.data.activityInfos[0]
  946. ? res.data.activityInfos[0]
  947. : {};
  948. that.activityApplyCount = res.data.activityApplyCount;
  949. that.formLabelAlign.invitationCode = that.countryList.activityQrCode;
  950. that.formLabelAlign.meetingId = res.data.meetingId;
  951. if (users) {
  952. var token = "" + getToken();
  953. var projectId = this.countryList.baseActivityEntityId;
  954. this.userId = user.userId;
  955. getFollowModeNumlByModelIdAndUserId(
  956. projectId,
  957. "activity",
  958. this.userId
  959. ).then((res) => {
  960. this.ifcommon = res.data;
  961. });
  962. }
  963. } else {
  964. that.countryList = {};
  965. that.$message({
  966. message: "无当前版本",
  967. type: "error",
  968. });
  969. }
  970. let list = {
  971. attachmentBusinessId: this.countryList.id,
  972. attachmentBusinessType: "activityInfo",
  973. };
  974. sysAttachmentInfos(list).then((res) => {
  975. if ("3" == this.countryList.activityStatusDict) {
  976. if (JSON.stringify(res.data) == "{}") {
  977. this.screen = [
  978. {
  979. value: "1",
  980. lable: "common.ActivityIntroduction",
  981. },
  982. {
  983. value: "1",
  984. lable: "common.ActivityAgenda",
  985. },
  986. {
  987. value: "1",
  988. lable: "common.ActivityReview",
  989. },
  990. ];
  991. } else {
  992. this.screen = [
  993. {
  994. value: "1",
  995. lable: "common.ActivityIntroduction",
  996. },
  997. {
  998. value: "1",
  999. lable: "common.ActivityAgenda",
  1000. },
  1001. {
  1002. value: "1",
  1003. lable: "common.ActivityReview",
  1004. },
  1005. {
  1006. value: "1",
  1007. lable: "common.ActivityResults",
  1008. },
  1009. ];
  1010. }
  1011. } else {
  1012. this.screen = [
  1013. {
  1014. value: "1",
  1015. lable: "common.ActivityIntroduction",
  1016. },
  1017. {
  1018. value: "1",
  1019. lable: "common.ActivityAgenda",
  1020. },
  1021. ];
  1022. }
  1023. });
  1024. });
  1025. this.activityStatusMap.set("活动中", "In the activity");
  1026. this.activityStatusMap.set("已结束", "Endeded");
  1027. this.activityStatusMap.set("未开始", "To be started");
  1028. this.activityStatusMap.set("报名中", "Signing Up");
  1029. },
  1030. getBaseList() {
  1031. const that = this;
  1032. getList({ language: this.$i18n.locale.toUpperCase() }).then((res) => {
  1033. if (JSON.stringify(res.data) !== "{}") {
  1034. that.projectList = res.data.baseUnitViews || [];
  1035. }
  1036. });
  1037. getDicts("unit_country_dict_en,CONTINENT_CODE_DICT_EN").then((result) => {
  1038. this.countrydate = result.data[0];
  1039. this.Regiondate = result.data[1];
  1040. });
  1041. },
  1042. // 报名弹窗
  1043. signUp(num) {
  1044. // 判断是否是报名结束
  1045. let user = window.localStorage.getItem("user");
  1046. if (!this.$Cookies.get("token")) {
  1047. // this.$message.warning("请先登录");
  1048. // this.$confirm('检测到您未登录,是否登录')
  1049. // .then(_ => {
  1050. // this.toView('login');
  1051. // })
  1052. // .catch(_ => {});
  1053. this.toViewLogin = true;
  1054. } else {
  1055. this.centerDialogVisible = true;
  1056. }
  1057. // if (this.countryList.registtrationFlag=='y') {
  1058. //
  1059. // } else {
  1060. // this.$message({
  1061. // message: '当前会员活动无法加入',
  1062. // type: 'warning'
  1063. // });
  1064. // }
  1065. },
  1066. save: function () {
  1067. //流程改造6
  1068. this.formLabelAlign.language = this.language;
  1069. this.formLabelAlign.auditStatusDict = "4";
  1070. this.$refs["formLabelAlign"].validate((valid) => {
  1071. if (valid) {
  1072. if (this.user.umsUser.userUsertypeDict !== "2") {
  1073. addIntegral("activity_registration_successful", "10");
  1074. addGrowth("activity_registration_successful");
  1075. }
  1076. this.upData();
  1077. } else {
  1078. return false;
  1079. }
  1080. });
  1081. },
  1082. upData() {
  1083. this.submitHandler((token) => {
  1084. //流程改造7
  1085. getApproverId(this.formLabelAlign.invitationCode).then((result) => {
  1086. result = result.data;
  1087. //let id = result[0].userId;
  1088. var str = "";
  1089. for (var i = 0; i < result.length; i++) {
  1090. str += result[i].userId + ",";
  1091. }
  1092. if (str.length > 0) {
  1093. str = str.substr(0, str.length - 1);
  1094. }
  1095. this.approverId = str;
  1096. // 会员模块后期加的 可传空字符串
  1097. let activityIds = this.countryList.baseActivityEntityId;
  1098. saveActivityOrUpdate(
  1099. JSON.stringify(this.formLabelAlign),
  1100. this.approverId,
  1101. this.taskComment,
  1102. token,
  1103. activityIds
  1104. )
  1105. .then((res) => {
  1106. let type = "success";
  1107. if (res.msg == "error") {
  1108. res.msg =
  1109. this.$i18n.locale == "zh"
  1110. ? "您已报名成功,请勿重复报名。"
  1111. : "ou have signed up successfully, please do not repeat.";
  1112. type = "warning";
  1113. } else {
  1114. res.msg =
  1115. this.$i18n.locale == "zh"
  1116. ? "报名成功"
  1117. : "Successful registration";
  1118. }
  1119. this.$message({
  1120. message: res.msg,
  1121. type: type,
  1122. });
  1123. this.resetToken();
  1124. this.centerDialogVisible = false;
  1125. })
  1126. .catch((error) => {
  1127. this.resetToken();
  1128. });
  1129. });
  1130. });
  1131. },
  1132. getIconUrl(url) {
  1133. return require("@/assets/img/cooperationExchange/" + url);
  1134. },
  1135. toView(router, json) {
  1136. clearInterval(this.timer);
  1137. this.$router.push({ name: router, params: { key: json } });
  1138. },
  1139. screenBack(data) {
  1140. console.log(data, "screenBackscreenBackscreenBackscreenBack");
  1141. },
  1142. screens(item, index) {
  1143. this.i = index;
  1144. },
  1145. },
  1146. };
  1147. </script>
  1148. <!-- Add "scoped" attribute to limit CSS to this component only -->
  1149. <style scoped>
  1150. .box {
  1151. margin-top: 10px;
  1152. background: #fff;
  1153. padding-top: 20px;
  1154. padding-bottom: 10px;
  1155. }
  1156. body {
  1157. margin: 0;
  1158. }
  1159. .screen1 {
  1160. padding: 10px 18px;
  1161. font-size: 14px;
  1162. background-color: #e8e8e8;
  1163. color: #8fa0b4;
  1164. }
  1165. .screen2 {
  1166. padding: 10px 18px;
  1167. font-size: 14px;
  1168. background-color: #12559c;
  1169. color: #fff;
  1170. }
  1171. .Introduction {
  1172. margin-top: 20px;
  1173. }
  1174. .Introduction li {
  1175. float: left;
  1176. width: 31%;
  1177. height: 400px;
  1178. margin-right: 22px;
  1179. background: skyblue;
  1180. }
  1181. .el-button.is-round {
  1182. padding: 0;
  1183. }
  1184. .el-input {
  1185. width: 400px;
  1186. /* line-height: 52px; */
  1187. }
  1188. .el-input >>> .el-input__inner {
  1189. height: 50px;
  1190. /* width: 200px; */
  1191. }
  1192. .el-select >>> .el-input__inner {
  1193. height: 50px;
  1194. }
  1195. .el-form-item >>> .el-form-item__label {
  1196. padding-top: 5px;
  1197. }
  1198. .dcp_input /deep/.el-input__inner {
  1199. width: 150px;
  1200. }
  1201. .dcp_input /deep/.el-select {
  1202. width: 150px;
  1203. }
  1204. .el-select-dropdown {
  1205. width: 400px !important;
  1206. }
  1207. .plateCountry::after {
  1208. bottom: 5px;
  1209. }
  1210. </style>