HomeNew.vue 32 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867
  1. <template>
  2. <div>
  3. <headers></headers>
  4. <search :informationTotal="informationTotal" style="margin-top: 10px;"></search>
  5. <div class="box" style="margin-top: 20px;">
  6. <ul>
  7. <li v-for="(item, index) in initData" class="button7" :key="item.value + index">
  8. <div style="position: relative;margin-top: 10px;">
  9. <span :style="$i18n.locale == 'en' ? 'display:block;margin-top:43px;margin-bottom:20px;' : ''">
  10. <img :style="$i18n.locale == 'zh' ? 'width:30px;' : ''" :src="getIconUrl(item.icon)" alt=""
  11. class="middle">
  12. </span>
  13. <span style="font-weight: 600;font-size: 18px;" class="Boxcursor"
  14. @click="toView(item.value, {})">
  15. {{ $t(item.label) }}
  16. </span>
  17. </div>
  18. <span style="position: relative;display: block; font-size: 14px;font-weight: 400;text-align: left;"
  19. :style="$i18n.locale == 'zh' ? 'height: 30px;margin-left: 65px; ' : 'margin-left: 36px; line-height: 23px;'"
  20. v-for="(i, index) in item.dataitem" :key="i.value + index" :class="item.value == 'projectPresentation' ? 'borderBottomNone' :
  21. item.value == 'countryInformation' ? 'borderBottomNone' :
  22. item.value == 'countryInformation' ? 'borderBottomNone' :
  23. item.value == 'enterprise' ? 'borderBottomNone' :
  24. item.value == 'cooperationExchange' ? 'borderBottomNone' :
  25. item.value == 'conferenceServices' ? 'borderBottomNone' : ''"
  26. @click="toView(i.value, i.json ? i.json : '', item, i)" v-if="$i18n.locale == 'zh'">
  27. <span class="Boxcursor"> ◆{{ $t(i.label) }}</span>
  28. </span>
  29. </li>
  30. </ul>
  31. </div>
  32. <div class="box2" style="position: relative;">
  33. <div
  34. style="position: fixed;left: 50%;transform: translate(610px,-50%);width: 70px;background: #fff;box-shadow:0px 2px 4px 0px rgba(0,0,0,0.5);">
  35. <div style="width: 70px;height: 70px;background: #2A548C;
  36. text-align: center;font-size: 12px;color: #fff;" class="cursor" @click="toView('customerService')">
  37. <img src="@/assets/img/home/footer/customerServiceexport@2x.png" alt=""
  38. style="width: 30px;margin-top: 10px;">
  39. <div>{{ $t('common.Online') }}</div>
  40. </div>
  41. <div style="width: 70px;height: 70px;text-align: center;font-size: 12px;
  42. color: #A5A5A5;border-bottom: 1px solid rgba(241,241,241,1);cursor: pointer;" @mouseover="mouseOver"
  43. @mouseleave="mouseLeave">
  44. <img src="@/assets/img/home/footer/QRcodeexport@2x.png" alt=""
  45. style="width: 30px;margin-top: 10px;">
  46. <div>{{ $t('common.QRCode') }}</div>
  47. </div>
  48. <div ref="QRCode" id="qrcode"
  49. style="position: absolute; transform: translate(70%,-50%);display: none; "></div>
  50. <div style="width: 70px;height: 70px;text-align: center;font-size: 12px;color: #A5A5A5;border-bottom: 1px solid rgba(241,241,241,1);"
  51. class="cursor" @click="ShareChange">
  52. <img src="@/assets/img/home/footer/rectangle@2x.png" alt="" style="width: 30px;margin-top: 10px;">
  53. <div>{{ $t('common.Share') }}</div>
  54. </div>
  55. <!-- 首页跳转 -->
  56. <div style="width: 70px;height: 70px;text-align: center;font-size: 12px;color: #A5A5A5;border-bottom: 1px solid rgba(241,241,241,1);"
  57. class="cursor" @click="toView('home')">
  58. <img src="@/assets/img/home/footer/home@2x.png" alt="" style="width: 30px;margin-top: 10px;">
  59. <div>{{ $t('common.Home') }}</div>
  60. </div>
  61. <div style="position: absolute; transform: translate(150%,-100%);" v-show="ShareNum">
  62. <vshare></vshare>
  63. </div>
  64. <div style="width: 70px;height: 70px;text-align: center;display:none;font-size: 12px;color: #A5A5A5;border-bottom: 1px solid rgba(241,241,241,1);"
  65. class="cursor" @click="toUp" id="toUp">
  66. <img src="@/assets/img/home/footer/BackTopexport@2x.png" alt=""
  67. style="width: 30px;margin-top: 10px;">
  68. <div>{{ $t('common.Top') }}</div>
  69. </div>
  70. </div>
  71. <ul>
  72. <li style="position: relative;" v-for="(item, num) in news" :key="item.label + index">
  73. <div
  74. style="height: 100%;text-align: center;line-height: 120px;position: absolute;left: 46px;top: 0;">
  75. <img :src="getIconUrl(item.icon)" alt=""
  76. style="vertical-align:middle;width: 24px;margin-left: 5px;" />
  77. <span> {{ $t(item.label) }}</span>
  78. </div>
  79. <div style="position: absolute;left: 200px;top: 10px;">
  80. <table style="padding-bottom: 12px;border-bottom: 1px dashed #666;">
  81. <tr v-for="(i, index) in item.newItem" style="width:990px;display: block;"
  82. :key="i.title + index">
  83. <td v-if="num != 2" class="tdLabel1 cursor"
  84. style="width: 75%;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;"
  85. @click="viewChange(i.baseEntityId ? i.baseEntityId : i.projectId, index, num)">
  86. <span class="spot"></span>
  87. {{ $t(i.title ? i.title : i.projectName) }}
  88. </td>
  89. <td v-if="num == 0" class="tdLabel2" style="width: 20%;text-align: center;">
  90. {{ formatDate(i.publishDate) }}
  91. </td>
  92. <td v-if="num == 1" class="tdLabel2" style="width: 20%;text-align: center;">
  93. {{ formatDate(i.createDate) }}
  94. </td>
  95. <td v-if="num === 2" class="tdLabel1 cursor"
  96. style="width: 75%;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;"
  97. @click="viewChange(i.id, index, num)">
  98. <span class="spot"></span>
  99. {{ $i18n.locale.toUpperCase() == 'ZH' ? i.meetingName : i.meetingNameEn }}
  100. </td>
  101. <td v-if="num === 2" class="tdLabel2" style="width: 20%;text-align: center;">
  102. {{ formatDate(i.meetingReleaseDate) }}
  103. </td>
  104. </tr>
  105. <span v-if="item.newItem.length > 0"
  106. style="position: absolute;right: 20px;bottom: 10px;font-size: 14px;" class="cursor"
  107. @click="toViewChange(num)">
  108. {{ $t('common.More') }}
  109. </span>
  110. </table>
  111. </div>
  112. </li>
  113. </ul>
  114. </div>
  115. <el-dialog width="50%" :visible.sync="detialPlayVideoVideo" @close="closePlay">
  116. <player :video-url="videoUrl" :state="state"></player>
  117. </el-dialog>
  118. <el-dialog width="50%" :visible.sync="detialPlayVideoPdf">
  119. <!-- <div style="margin-bottom: 15px; text-align: right">
  120. <el-button type="primary" size="small" @click.stop="previousPage">
  121. 上一页
  122. </el-button>
  123. <el-button type="primary" size="small" @click.stop="nextPage">
  124. 下一页
  125. </el-button>
  126. <span>当前第{{pdfPage}}页 / 共{{pageCount}}页</span>
  127. </div> -->
  128. <div>
  129. <!-- <pdf
  130. :src="src"
  131. :page="pdfPage"
  132. @num-pages="pageCount = $event"
  133. @page-loaded="pdfPage = $event"
  134. style="display: inline-block; width: 100%"
  135. ></pdf> -->
  136. <iframe width="100%" id="embed" height="600px" :src="src" frameborder="0"></iframe>
  137. </div>
  138. </el-dialog>
  139. <div class="box3">
  140. <span class="cursor" @click="toView('developmentCooperation')"> <i class="el-icon-folder-remove"></i>
  141. {{ $t('common.DevelopmentCooperationForum') }} </span>
  142. <span class="cursor" @click="toView('onlineMeeting')"> <i class="el-icon-data-analysis"></i> {{
  143. $t('common.OnlineMeeting')
  144. }} </span>
  145. </div>
  146. <footers></footers>
  147. </div>
  148. </template>
  149. <script>
  150. import { getLatestInformationPortal } from "@/api/baseUnitView";
  151. import headers from '@/components/header'
  152. import HeaderItem from '@/components/headerItem'
  153. import editor from '@/components/dialog'
  154. import tabers from '@/components/taber'
  155. import search from '@/components/search'
  156. import vshare from 'vshare'
  157. import QRCode from 'qrcodejs2'
  158. import footers from '@/components/footers'
  159. import { gateGetProjectViewInfo, getBannerPath, getLatestBaseProjectViewPortal } from "@/api/project/baseProjectView";
  160. import { allInformationViewCount } from "@/api/information/information";
  161. import { getLatestMeetingListPortal } from "@/api/meeting/meetingOutInfo";
  162. import Bus from "@/api/bus"; //注意引入
  163. // import {get} from "@/api/work/wtDeptWorkTaskInfo"; //注意引入
  164. import player from "@/components/Player";
  165. import pdf from 'vue-pdf'
  166. export default {
  167. name: 'Home',
  168. components: { headers, tabers, HeaderItem, search, footers, editor, vshare, player, pdf },
  169. data() {
  170. return {
  171. dialogVisible: false,
  172. ShareNum: false,
  173. videoUrl: require('../assets/pdfAndVideo/video.mp4'),
  174. currentPage: 0, // pdf文件页码
  175. pageCount: 0, // pdf文件总页数
  176. fileType: 'pdf', // 文件类型
  177. src: null,
  178. pdfPage: 1,
  179. pageCount: 0,
  180. detialPlayVideoVideo: false,
  181. detialPlayVideoPdf: false,
  182. state: false,
  183. params: {
  184. pageNo: 1,
  185. pageSize: 3,
  186. language: '',
  187. //0为默认排序,1为关注排序
  188. descStatus: 0,
  189. status: 1
  190. },
  191. vshareConfig: {
  192. shareList: [
  193. // 此处放分享列表(ID)
  194. 'more',
  195. 'qzone',
  196. 'tsina',
  197. 'renren',
  198. 'weixin'
  199. ],
  200. common: {
  201. //此处放置通用设置
  202. bdUrl: window.location.href,
  203. },
  204. share: [{
  205. //此处放置分享按钮设置
  206. }
  207. ],
  208. image: [
  209. //此处放置图片分享设置
  210. ],
  211. selectShare: [
  212. //此处放置划词分享设置
  213. ]
  214. },
  215. initData: {
  216. data1: {
  217. label: 'common.ProjectResources',
  218. value: 'projectPresentation',
  219. icon: 'resources@2x',
  220. dataitem: [{
  221. label: 'common.Pre-planning',
  222. value: 'projectPresentation'
  223. }, {
  224. label: 'common.ProjectShowcase',
  225. value: 'projectPresentation'
  226. }, {
  227. label: 'common.EvaluationAnalysis',
  228. value: 'projectPresentation'
  229. }, {
  230. label: 'common.MatchTracking',
  231. value: 'projectPresentation'
  232. }],
  233. },
  234. data2: {
  235. label: 'common.InformationData',
  236. icon: 'information@2x',
  237. value: 'realTimeInfo',
  238. dataitem: [{
  239. label: 'common.Information',
  240. value: 'realTimeInfo',
  241. json: '0'
  242. }, {
  243. label: 'common.DataInformation',
  244. value: 'realTimeInfo',
  245. json: '1'
  246. }, {
  247. label: 'common.JournalInformation',
  248. value: 'realTimeInfo',
  249. json: '2'
  250. }],
  251. },
  252. data3: {
  253. label: 'common.CountryInformation',
  254. icon: 'country@2x',
  255. value: 'countryInformation',
  256. dataitem: [{
  257. label: 'common.Resources',
  258. value: 'countryInformation'
  259. }, {
  260. label: 'common.EnergyDevelopmentPlanning',
  261. value: 'countryInformation'
  262. }, {
  263. label: 'common.ProjectStatus',
  264. value: 'countryInformation'
  265. }, {
  266. label: 'common.ProjectDevelopmentGuide',
  267. value: 'countryInformation'
  268. }],
  269. },
  270. data4: {
  271. icon: 'enterprise@2x',
  272. label: 'common.EnterpriseShow',
  273. value: 'enterprise',
  274. dataitem: [{
  275. label: 'common.CompanyProfile',
  276. value: 'enterprise'
  277. }, {
  278. label: 'common.ProductInformation',
  279. value: 'enterprise'
  280. }, {
  281. label: 'common.CoreTechnology',
  282. value: 'enterprise'
  283. }, {
  284. label: 'common.ProjectPerformance',
  285. value: 'enterprise'
  286. }],
  287. },
  288. data5: {
  289. label: 'common.FinancialServices',
  290. icon: 'finance@2x',
  291. value: 'financialServices',
  292. dataitem: [{
  293. label: 'common.FinancialInstitutions',
  294. value: 'financialServices'
  295. }, {
  296. label: 'common.Fund',
  297. value: 'financialServices'
  298. }, {
  299. label: 'common.Investment&FinancingCases',
  300. value: 'financialServices'
  301. }],
  302. },
  303. data6: {
  304. label: 'common.ThinkTankConsulting',
  305. icon: 'ThinkTank@2x',
  306. value: 'thinkTankConsulting',
  307. dataitem: [{
  308. label: 'common.ThinkTankNews',
  309. value: 'thinkTankConsulting'
  310. }, {
  311. label: 'common.ServiceScope',
  312. value: 'thinkTankConsulting'
  313. }, {
  314. label: 'common.ProjectCase',
  315. value: 'thinkTankConsulting'
  316. }, {
  317. label: 'common.WillingnessToCooperate',
  318. value: 'thinkTankConsulting'
  319. }],
  320. },
  321. data7: {
  322. label: 'common.CooperationNetwork',
  323. icon: 'cooperation@2x',
  324. value: 'IntroductionMemberProfile',
  325. dataitem: [{
  326. label: 'common.MemberIntroduction',
  327. value: 'IntroductionMemberProfile',
  328. json: 'member'
  329. }, {
  330. label: 'common.AllianceIntroduction',
  331. value: 'IntroductionMemberProfile',
  332. json: 'union'
  333. }, {
  334. label: 'common.CooperativeUnitIntroduction',
  335. value: 'IntroductionMemberProfile',
  336. json: 'cooperation'
  337. }, {
  338. label: 'common.CustomService',
  339. value: 'IntroductionMemberProfile',
  340. json: 'custom'
  341. }],
  342. },
  343. data8: {
  344. label: 'common.Cooperation&Communication',
  345. icon: 'exchange@2x',
  346. value: 'cooperationExchange',
  347. dataitem: [{
  348. label: 'common.MemberActivities',
  349. value: 'cooperationExchange'
  350. }, {
  351. label: 'common.AllianceActivities',
  352. value: 'cooperationExchange'
  353. }, {
  354. label: 'common.CooperationActivities',
  355. value: 'cooperationExchange'
  356. }],
  357. },
  358. data9: {
  359. label: 'common.ResourceSharing',
  360. icon: 'share@2x',
  361. value: 'resourceSharing',
  362. dataitem: [{
  363. label: 'common.ResearchResults',
  364. value: 'resourceSharing'
  365. }, {
  366. label: 'common.ResearchResources',
  367. value: 'resourceSharing'
  368. }, {
  369. label: 'common.ConferenceFacilities',
  370. value: 'resourceSharing'
  371. }],
  372. },
  373. data10: {
  374. label: 'common.ConferenceService',
  375. icon: 'discussion@2x',
  376. value: 'conferenceServices',
  377. dataitem: [{
  378. label: 'common.ConferenceInformation',
  379. value: 'conferenceServices'
  380. },
  381. // {
  382. // label:'common.ConferenceRegistration',
  383. // value:'conferenceServices'
  384. // },
  385. {
  386. label: 'common.ConferenceResults',
  387. value: 'conferenceServices'
  388. }, {
  389. label: 'common.ConferenceFeedback',
  390. value: 'conferenceServices'
  391. }],
  392. },
  393. // data11:{
  394. // label:'common.ExhibitionService',
  395. // icon:'Exhibition@2x',
  396. // value:'exhibitionService',
  397. // dataitem:[{
  398. // label:'common.ExhibitionService',
  399. // value:'exhibitionService'
  400. // },{
  401. // label:'common.OnlineExhibition',
  402. // value:'exhibitionService'
  403. // },{
  404. // label:'common.Exhibitionresults',
  405. // value:'exhibitionService'
  406. // },{
  407. // label:'common.Exhibitionfeedback',
  408. // value:'exhibitionService'
  409. // }],
  410. // },
  411. data11: {
  412. label: "common.ExhibitionService",
  413. icon: "Exhibition",
  414. value: "exhibitionService",
  415. dataitem: [
  416. {
  417. label: 'common.ExhibitionService',
  418. value: 'exhibitionService'
  419. }, {
  420. label: 'common.ExhibitionService',
  421. value: 'exhibitionService'
  422. }, {
  423. label: 'common.ExhibitionService',
  424. value: 'exhibitionService'
  425. }, {
  426. label: 'common.ExhibitionService',
  427. value: 'exhibitionService'
  428. }
  429. ],
  430. },
  431. data12: {
  432. label: 'common.NationalregionalCommissions',
  433. icon: 'commissions@2x',
  434. value: 'nationalregionalCommittees',
  435. dataitem: [{
  436. label: 'common.BriefintroductiontotheCommittee',
  437. value: 'nationalregionalCommittees'
  438. }, {
  439. label: 'common.Committeelayout',
  440. value: 'nationalregionalCommittees'
  441. }, {
  442. label: 'common.Committeeactivities',
  443. value: 'nationalregionalCommittees'
  444. }],
  445. },
  446. },
  447. news: [{
  448. icon: 'new',
  449. label: "common.LatestNews",
  450. newItem: []
  451. }, {
  452. icon: 'project',
  453. label: 'common.LatestProject',
  454. newItem: []
  455. }, {
  456. icon: 'meeting',
  457. label: 'common.LatestMeeting',
  458. newItem: []
  459. }],
  460. informationTotal: '',
  461. }
  462. },
  463. watch: {
  464. '$i18n.locale'() {
  465. this.getRelevantList(1, null, this.$i18n.locale.toUpperCase())
  466. this.getBaseProject();
  467. this.getConfrences()
  468. },
  469. videoUrl: function (val) {
  470. // const myPlayer = this.$refs.videoPlayer.player
  471. if (val !== '') {
  472. this.$refs.videoPlayer.player.src(val)
  473. }
  474. },
  475. state: function (val) {
  476. if (val) {
  477. this.$refs.videoPlayer.player.pause()
  478. }
  479. }
  480. },
  481. mounted() {
  482. // this.src = '../assets/pdfAndVideo/SchemeOfOnlineExhibitionHall.pdf';
  483. if (window._bd_share_main) {
  484. window._bd_share_main.init();
  485. }
  486. // this.src = pdf.createLoadingTask(this.src)
  487. window.addEventListener("scroll", this.showbtn, true);
  488. this.getRelevantList(1, null, this.$i18n.locale.toUpperCase());// 最新资讯
  489. this.getBaseProject();
  490. this.getConfrences();
  491. this.qrcode();
  492. this.src = '/api/file/pub/def/Scheme3ofonlineexhibitionhall.pdf';
  493. document.all.iframeid.src = this.src ? this.src : '';
  494. this.$forceUpdate();
  495. },
  496. loadPdfHandler(e) {
  497. this.currentPage = 1 // 加载的时候先加载第一页
  498. },
  499. destroyed() {
  500. window.removeEventListener('scroll', this.scrollToTop);
  501. },
  502. methods: {
  503. previewPDF(row) {
  504. },
  505. closeDialog() {
  506. this.pdfPage = 1;
  507. },
  508. //PDF改变页数
  509. previousPage() {
  510. var p = this.pdfPage
  511. p = p > 1 ? p - 1 : this.pageCount
  512. this.pdfPage = p
  513. },
  514. nextPage() {
  515. var p = this.pdfPage
  516. p = p < this.pageCount ? p + 1 : 1
  517. this.pdfPage = p
  518. },
  519. getConfrences() {
  520. var page = {
  521. pageSize: 3,
  522. pageNo: 1
  523. }
  524. getLatestMeetingListPortal(page).then(res => {
  525. if (res.data) {
  526. this.news[2].newItem = res.data.meetingBasicInfos || [];
  527. }
  528. })
  529. },
  530. closePlay(val) {
  531. console.log(val);
  532. },
  533. qrcode() {
  534. this.url = window.location.href;
  535. let qrcode = new QRCode('qrcode', {
  536. width: 132,
  537. height: 132,
  538. text: this.url, // 二维码地址
  539. })
  540. },
  541. ShareChange() {
  542. this.ShareNum = !this.ShareNum;
  543. },
  544. mouseOver() {
  545. this.ShareNum = false;
  546. this.$refs['QRCode'].style.display = 'block';
  547. },
  548. mouseLeave() {
  549. this.$refs['QRCode'].style.display = 'none';
  550. },
  551. getRelevantList(num, type, language, title) {
  552. let page = {
  553. typeDict: type,
  554. language: language,
  555. pageSize: 3,
  556. pageNo: num,
  557. businessType: "information",
  558. title: title ? title : ''
  559. }
  560. getLatestInformationPortal(page).then(res => {
  561. if (res.data) {
  562. this.news[0].newItem = res.data.portalInformationList || []
  563. }
  564. });
  565. },
  566. getBaseProject() {
  567. this.params.language = this.$i18n.locale.toUpperCase();
  568. getLatestBaseProjectViewPortal(this.params).then((result) => {
  569. var data = result.data;
  570. if (data.baseProjectViews) {
  571. this.news[1].newItem = result.data.baseProjectViews || [];
  572. }
  573. })
  574. allInformationViewCount().then(result => {
  575. var data = result.data;
  576. if (data) {
  577. this.informationTotal = data.cmsInformationViewCount;
  578. }
  579. })
  580. },
  581. viewChange(id, index, num) {
  582. if (id) {
  583. if (num == 0) {
  584. this.toView('realTimeInfoItemdetails', id)
  585. }
  586. if (num == 1) {
  587. this.toView('projectPresentationDetails', id)
  588. }
  589. if (num == 2) {
  590. localStorage.setItem('conferenceId', id);
  591. this.$store.commit('modify', 'ConferenceDetail')
  592. this.$router.push({ name: 'ConferenceDetail', params: { key: id } })
  593. }
  594. }
  595. },
  596. toViewChange(index) {
  597. if (index == 0) {
  598. this.toView('realTimeInfo');
  599. }
  600. console.log(index + "index")
  601. if (index == 1) {
  602. this.toView('projectPresentation');
  603. }
  604. if (index == 2) {
  605. this.toView('conferenceServices');
  606. }
  607. },
  608. CreateMeeting() {
  609. this.dialogVisible = true
  610. },
  611. showbtn() {
  612. let topBtn = document.getElementById('toUp');
  613. let scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop;
  614. let browserHeight = window.outerHeight;
  615. if (scrollTop > 100) {
  616. if (topBtn) {
  617. topBtn.style.display = 'block';
  618. }
  619. } else {
  620. if (topBtn) {
  621. topBtn.style.display = 'none';
  622. }
  623. }
  624. },
  625. getIconUrl(url) {
  626. return require("@/assets/img/home/" + url + ".png");
  627. },
  628. // 返回顶部
  629. toUp() {
  630. // window.scrollTo(0,0);
  631. var timer = setInterval(function () {
  632. let osTop = document.documentElement.scrollTop || document.body.scrollTop;
  633. let ispeed = Math.floor(-osTop / 5);
  634. document.documentElement.scrollTop = document.body.scrollTop = osTop + ispeed;
  635. this.isTop = true;
  636. if (osTop === 0) {
  637. clearInterval(timer);
  638. }
  639. }, 30)
  640. },
  641. toView(router, json, item, i) {
  642. console.log(router)
  643. if (i && i.label == 'common.ExhibitionService') {
  644. // window.open('http://tour.quanjingke.com/xiangmu/quanqiunengyuan_vtour_v7/');
  645. this.state = true;
  646. this.detialPlayVideoVideo = true;
  647. } else if (i && i.label == 'common.OnlineExhibition') {
  648. window.open("http://119.3.163.174:1080/23-2/", '_blank');
  649. } else if (i && i.label == 'common.Exhibitionfeedback') {
  650. this.detialPlayVideoPdf = true;
  651. } else {
  652. if (json) {
  653. if (router == 'projectPresentationDetails') {
  654. this.$router.push({ name: 'routerItem', query: { key: json } })
  655. } else {
  656. this.$router.push({ name: 'routerItem', query: { key: json } })
  657. }
  658. } else {
  659. this.$router.push({ name: 'routerItem' })
  660. }
  661. this.$store.commit('modify', router)
  662. window.localStorage.setItem('router', router)
  663. }
  664. // get().then(result => {
  665. // console.log(result)
  666. // })
  667. }
  668. }
  669. }
  670. </script>
  671. <!-- Add "scoped" attribute to limit CSS to this component only -->
  672. <style scoped>
  673. /* * {
  674. padding: 0;
  675. margin: 0;
  676. } */
  677. body {
  678. margin: 0;
  679. }
  680. .box,
  681. .box2,
  682. .box3 {
  683. width: 1200px;
  684. height: 360px;
  685. margin: auto;
  686. position: relative;
  687. border-bottom: 1px solid #fff;
  688. /* background-color: #000; */
  689. }
  690. .box3 {
  691. height: 40px;
  692. border: none;
  693. }
  694. .box3 span:nth-child(1) {
  695. width: 600px;
  696. height: 40px;
  697. display: block;
  698. float: left;
  699. background: #06c4e2;
  700. color: #fff;
  701. }
  702. .box3 span:nth-child(2) {
  703. width: 600px;
  704. height: 40px;
  705. display: block;
  706. float: left;
  707. background: #f0d06b;
  708. color: #666;
  709. }
  710. .box3 span {
  711. text-align: center;
  712. line-height: 40px;
  713. font-size: 14px;
  714. }
  715. .box ul {
  716. text-align: top;
  717. display: flex;
  718. display: -webkit-flex;
  719. /* Safari */
  720. justify-content: space-between;
  721. flex-wrap: wrap;
  722. }
  723. .box2 ul li {
  724. display: block;
  725. height: 120px;
  726. background: #fff;
  727. }
  728. .box2 ul li:nth-child(1) {
  729. border-left: 3px solid #608cc4;
  730. }
  731. .box2 ul li:nth-child(2) {
  732. border-left: 3px solid #57c4a8;
  733. }
  734. .box2 ul li:nth-child(3) {
  735. border-left: 3px solid #e9b767;
  736. }
  737. .box ul li {
  738. /* display: inline-block; */
  739. /* float: left; */
  740. width: 188px;
  741. height: 170px;
  742. background: #fff;
  743. margin: 6px 0;
  744. text-align: center;
  745. background-image: url("../assets/img/home/green.png");
  746. background-size: 120px 120px;
  747. background-repeat: no-repeat;
  748. background-position: 68px 50px;
  749. background-color: rgba(167, 225, 123, 0.5);
  750. color: #638F3F;
  751. border-radius: 10px;
  752. }
  753. .box ul li:nth-child(-n+6) {
  754. background-image: url("../assets/img/home/bule.png");
  755. background-color: rgba(115, 209, 240, 0.5);
  756. color: #3F85A7;
  757. }
  758. .initDataItem {
  759. font-size: 14px;
  760. margin-bottom: 10px;
  761. ;
  762. /* height: 30px; */
  763. font-weight: 400;
  764. text-align: left;
  765. margin-left: 65px;
  766. }
  767. .initDataItem2 {
  768. font-size: 14px;
  769. font-weight: 400;
  770. text-align: left;
  771. margin-left: 36px;
  772. line-height: 23px;
  773. }
  774. .tdLabel1,
  775. .tdLabel2 {
  776. font-size: 14px;
  777. color: #666;
  778. line-height: 28px;
  779. display: inline-block;
  780. }
  781. .spot {
  782. display: inline-block;
  783. width: 6px;
  784. height: 6px;
  785. background-color: #d8d8d8;
  786. margin-right: 5px;
  787. margin-bottom: 2px;
  788. }
  789. .cursor:hover {
  790. color: #ff0000;
  791. /* border-bottom: 1px solid #7CBA4B; */
  792. }
  793. .Boxcursor:hover {
  794. border-bottom: 1px solid #7CBA4B;
  795. cursor: pointer;
  796. }
  797. .box ul li:nth-child(-n+6) .Boxcursor:hover {
  798. border-bottom: 1px solid #45ACE0;
  799. cursor: pointer;
  800. }
  801. .box ul li .borderBottomNone span:hover {
  802. border-bottom: none !important;
  803. }
  804. .el-button {
  805. padding: 5px 10px;
  806. }
  807. .CreateMeeting p {
  808. line-height: 25px;
  809. }
  810. .el-popper[x-placement^=right] {
  811. max-height: none;
  812. }
  813. .box ul li:hover {
  814. /* content:''; */
  815. /* position:absolute;
  816. left:0;
  817. bottom:0; */
  818. width: 188px;
  819. height: 170px;
  820. transform: translate(-3px, -5px) scale(1);
  821. /* transition-timing-function:cubic-bezier(0.75,0,0.125,1); */
  822. transition: all 0.5s;
  823. /* transform:; */
  824. }
  825. </style>