123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420 |
- <template>
- <view class="customService">
- <view class="serviceTab">
- <text class="tabListLeft" :class="curNow==0?'black':''" @click="sectionChange(0)">
- {{$i18n.locale ==='zh'? '定制服务' : 'Costomized'}}
- </text>
- <text :class="curNow!==0?'active2':'active'">
- </text>
- <text class="tabListRight" :class="curNow!==0?'black':''" @click="sectionChange(1)">
- {{ $i18n.locale ==='zh'? '资助洽商' : 'Donantion'}}
- </text>
- </view>
- <view class="service">
- <view class="custom" v-if="!curNow">
- <view class="custom-ser">
- <view class="custom-item" v-for="(item,index) in initData" :key="index">
- <view class="item-img">
- <image :src="getIconUrl(item.img)" mode=""></image>
- </view>
- <view class="item-content">
- <view class="item-cont-title">{{$t(item.lable)}}</view>
- <view class="item-cont" v-html="$t(item.value).replace(/[;;]/g,'$&\n')"></view>
- </view>
- </view>
- </view>
- <view class="custom-exam">
- <view class="exam-title">
- <text class="title">{{$t('common.CustomizedServicesUnit')}}</text>
- <view class="qiehuan" @tap="nextBatch">
- {{$t('common.NextBatch')}}
- <uni-icons class="loop" type="loop" color="#666666" size="16" />
- </view>
- </view>
- <view class="exam-unit">
- <u-row gutter="16">
- <u-col span="6" v-for="(info,index) in collaboratorList" :key="index">
- <view class="exam-item" @tap="unitDetail" :data-key="info.id">
- <view class="item-logo">
- <image class="logo" :src="websiteUrl + photoMap[info.unitId]" mode=""></image>
- </view>
- <view class="item-name u-line-2">
- {{$i18n.locale === 'zh'?info.unitZhName:info.unitEnName}}</view>
- <view class="item-cont u-line-2" v-if="$i18n.locale === 'zh'">
- {{info.unitIntroduction?info.unitIntroduction.replace(/<[^>]+>|&[^>]+;/g, ""):""}}
- </view>
- <view class="item-cont u-line-2" v-if="$i18n.locale === 'en'">
- {{unitIntroductionMap[info.unitId]?unitIntroductionMap[info.unitId].replace(/<[^>]+>|&[^>]+;/g, ""):""}}
- </view>
- </view>
- </u-col>
- </u-row>
- </view>
- </view>
- </view>
- <view class="support" v-if="curNow">
- <view class="support-img">
- <image class="img" src="../../../static/img/cooperationNetwork/zzqs.png" mode=""></image>
- </view>
- <view class="module-classify-border"></view>
- <view class="support-cont">
- {{$t('common.IntroductionToFundingNegotiations')}}
- </view>
- </view>
- </view>
- <view style="height: 150upx;width: 100%;"></view>
- <view class="memberBtn">
- <u-button type="primary" shape="circle" @click="toCustomApply" v-show="!curNow" style="height: 88upx;">
- <!-- {{$t('common.CustomServiceApplication')}} -->
- {{$i18n.locale ==='zh'? '定制服务' : 'Costomized'}}
- </u-button>
- <u-button type="primary" shape="circle" @click="toDonationApply" v-show="curNow" style="height: 88upx;">
- {{$t('common.Donation')}}
- </u-button>
- </view>
- </view>
- </template>
- <script>
- export default {
- data() {
- return {
- curNow: 0,
- page: {
- pageNo: 1,
- pageSize: 8,
- },
- initData: [{
- lable: 'common.ExclusiveProjects',
- img: 'zsxm.png',
- value: 'common.IntroductionToExclusiveProjects'
- }, {
- lable: 'common.ThematicResearch',
- img: 'zxyj.png',
- value: 'common.IntroductionToExclusiveResearch'
- }, {
- lable: 'common.TailoredService',
- img: 'gxfw.png',
- value: 'common.IntroductionToPersonalizedService'
- }, {
- lable: 'common.CustomizedInformation',
- img: 'dzzx.png',
- value: 'common.CustomizedInformationIntroduction'
- }, {
- lable: 'common.JointConference',
- img: 'lhbh.png',
- value: 'common.IntroductionToTheJointMeeting'
- }],
- collaboratorList: [],
- unitIntroductionMap: {},
- photoMap: {},
- }
- },
- mounted() {
- this.setLang();
- },
- methods: {
- sectionChange(index) {
- this.curNow = index;
- },
- getIconUrl(url) {
- return require("../../../static/img/cooperationNetwork/" + url);
- },
- async setLang() {
- let param = {
- serviceTypeDict: '1',
- pageSize: 8,
- pageNo: this.page.pageNo,
- statusDict: '3'
- };
- const res = await this.$myRequest({
- url: '/project/coopCustomServices/',
- data: param
- });
- // console.log(res);
- const data = res.data;
- if (data) {
- this.collaboratorList = [];
- this.collaboratorList = data.coopCustomServices;
- this.photoMap = data.photoMap;
- this.collaboratorList.forEach(item => {
- if (this.photoMap[item.unitId] === '') {
- this.photoMap[item.unitId] = 'def/enterpriseDefault.png';
- }
- });
- this.unitIntroductionMap = data.unitIntroductionMap;
- this.page = data.page;
- }
- },
- nextBatch() {
- if (this.page.pageNo * 8 > (this.page.totalCount - 0)) {
- this.page.pageNo = 1;
- this.setLang();
- return;
- } else {
- this.page.pageNo++;
- this.setLang();
- }
- },
- unitDetail(e) {
- let key = e.currentTarget.dataset.key;
- uni.navigateTo({
- url: './components/customServiceDetails?key=' + key
- });
- },
- toCustomApply() {
- let user = uni.getStorageSync('user');
- let token = uni.getStorageSync('Auth-Token');
- if (user && token) {
- uni.navigateTo({
- url: '/pages/service/membership/customServiceApplication'
- })
- } else {
- uni.navigateTo({
- url: '/pages/public/login'
- })
- }
- },
- toDonationApply() {
- let user = uni.getStorageSync('user');
- let token = uni.getStorageSync('Auth-Token');
- if (user && token) {
- uni.navigateTo({
- url: '/pages/service/membership/donationApplication'
- })
- } else {
- uni.navigateTo({
- url: '/pages/public/login'
- })
- }
- }
- }
- }
- </script>
- <style lang="scss" scoped>
- .customService {
- padding-bottom: 140upx;
- .serviceTab {
- margin: 20upx 20upx 0 20upx;
- .tabListLeft,
- .tabListRight {
- width: 40%;
- height: 100upx;
- line-height: 100upx;
- display: inline-block;
- text-align: center;
- background-color: #fafafa;
- color: #C3C3C3;
- }
- .tabListLeft {
- border-radius: 20upx 0 0 0;
- }
- .tabListRight {
- border-radius: 0upx 20upx 0 0;
- }
- .active2 {
- display: inline-block;
- background-color: #fafafa;
- vertical-align: top;
- width: 20%;
- height: 100%;
- border-bottom: 100upx solid #fff;
- border-left: 120upx solid transparent;
- }
- .active {
- display: inline-block;
- background-color: #fafafa;
- vertical-align: top;
- width: 20%;
- height: 100%;
- border-bottom: 100upx solid #fff;
- border-right: 120upx solid transparent;
- }
- .black {
- background-color: #fff;
- font-weight: 600;
- color: #000;
- }
- }
- .service {
- margin: 0 20upx;
- padding-bottom: 20upx;
- .custom {
- .custom-ser {
- padding: 20upx 30upx;
- background-color: #FFFFFF;
- border-radius: 0 0 20upx 20upx;
- .custom-item {
- display: flex;
- justify-content: space-between;
- padding-top: 20upx;
- .item-img {
- width: 20%;
- height: 130upx;
- .image {
- width: 100%;
- height: 100%;
- }
- }
- .item-content {
- width: 75%;
- padding-bottom: 20upx;
- border-bottom: 1px solid #f1f1f1;
- .item-cont-title {
- font-size: 28upx;
- color: #0B0B11;
- font-weight: bold;
- }
- .item-cont {
- font-size: 26upx;
- color: #767676;
- }
- }
- &:last-child .item-content {
- border-bottom: none;
- }
- }
- }
- .custom-exam {
- margin-top: 20upx;
- background-color: #FFFFFF;
- padding: 20upx 30upx;
- border-radius: 20upx;
- .exam-title {
- display: flex;
- justify-content: space-between;
- .title {
- color: #333333;
- font-size: 30upx;
- font-weight: bold;
- position: relative;
- padding-left: 20upx;
- }
- .title:before {
- width: 10rpx;
- height: 32rpx;
- content: '';
- position: absolute;
- left: 0;
- top: 6upx;
- background-color: #6DD400;
- }
- .qiehuan {
- color: #666666;
- font-size: 28upx;
- .loop {
- margin-left: 5upx;
- }
- }
- }
- .exam-unit {
- margin: 0 -8upx;
- .exam-item {
- width: 100%;
- height: 350upx;
- border: 1px solid #E1E1E1;
- padding: 20upx;
- box-sizing: border-box;
- margin-top: 20upx;
- background-color: #F9FCFF;
- border-radius: 20upx;
- .item-logo {
- height: 120upx;
- .logo {
- width: 100%;
- height: 100%;
- }
- }
- .item-name {
- font-size: 30upx;
- font-weight: bold;
- margin: 10upx 0;
- color: #333333;
- text-align: center;
- }
- .item-cont {
- font-size: 28upx;
- color: #333333;
- }
- }
- }
- }
- }
- .support {
- background-color: #FFFFFF;
- .support-img {
- width: 100%;
- height: 380upx;
- padding: 30upx;
- .img {
- width: 100%;
- height: 100%;
- }
- }
- .module-classify-border {
- background-color: #f2f2f2;
- height: 20upx;
- width: 100%;
- }
- .support-cont {
- text-indent: 2em;
- padding: 20upx 30upx;
- color: #333333;
- font-size: 30upx;
- }
- }
- }
- .memberBtn {
- // position: fixed;
- // bottom: 0;
- // left: 0;
- // width: 100%;
- // background-color: #FFFFFF;
- padding: 30upx;
- height: 150upx;
- width: 100%;
- position: fixed;
- bottom: 0;
- left: 0;
- box-shadow: 0px -4px 10px 0px rgba(0, 0, 0, 0.06);
- background-color: white;
- }
- }
- </style>
|