dev/dcp-web-gate/src_old/views/FinancialServices/FinancialServicesIdeasDetails2.vue

<template>
    <div style="width: 100%;background:#fff">
        <div class="autoBox box cool">
            <div class="crumbs">
                <el-breadcrumb separator="/">
                    <el-breadcrumb-item :to="{ path: 'home' }" replace>{{$t('common.Home')}}</el-breadcrumb-item>
                    <el-breadcrumb-item :to="{ path: 'financialServices' }" replace>{{$t('common.FinancialServices')}}</el-breadcrumb-item>
                    <el-breadcrumb-item :to="{ path: 'FinancialServicesFundIdeas' }" replace>{{$t('common.FundIdeas')}}</el-breadcrumb-item>
                    <el-breadcrumb-item >{{iniData.title}}</el-breadcrumb-item>
                </el-breadcrumb>
            </div>
        </div>
        <div class="autoBox box1">
            <div style="padding: 0 80px">
                <div class="ideasTitle">
                    {{iniData.title}}

                    <p style="text-align: center;font-size: 18px;color: #666666;font-weight: 700;margin-top: 30px">{{iniData.subtitle}}</p>
                </div>
                <div style=" width: 100%;display: flex;justify-content: space-between;">
                        <div v-html="iniData.introduction"></div>
<!--                    <div  style="margin-top: 30px;width: 33.2%">-->
<!--                        <div style="width: 90%">-->
<!--                            <div style="width: 100%">-->
<!--                                <img src="@/assets/img/financialService/initiativeOne.png" alt="" style="width: 100%;height: 250px">-->
<!--                            </div>-->
<!--                           <div style="margin-top: 30px">-->
<!--                                <div style="width: 16px;height: 16px;background: #E99C45;display: inline-block"></div>-->
<!--                                {{$t(keyContent[0].title)}}-->
<!--                           </div>-->
<!--                            <p style="font-size: 18px;color: #666666;font-weight: normal">{{$t(keyContent[0].label)}}</p>-->
<!--                        </div>-->
<!--                    </div>-->
<!--                    <div style="margin-top: 30px;width: 33.2%">-->
<!--                        <div style="width: 90%">-->
<!--                            <div style="width: 100%">-->
<!--                                <img src="@/assets/img/financialService/initiativeTwo.png" alt="" style="width: 100%;height: 250px">-->
<!--                            </div>-->
<!--                            <div  style="margin-top: 30px">-->
<!--                                <div style="width: 16px;height: 16px;background: #274586;display: inline-block"></div>-->
<!--                                {{$t(keyContent[1].title)}}-->
<!--                            </div>-->
<!--                            <p style="font-size: 18px;color: #666666;font-weight: normal">{{$t(keyContent[1].label)}}</p>-->
<!--                        </div>-->
<!--                    </div>-->
<!--                    <div style="margin-top: 30px;width: 33.2%">-->
<!--                        <div style="width: 90%">-->
<!--                            <div style="width: 100%">-->
<!--                                <img src="@/assets/img/financialService/initiativeThree.png" alt="" style="width: 100%;height: 250px">-->
<!--                            </div>-->
<!--                            <div  style="margin-top: 30px">-->
<!--                                <div style="width: 16px;height: 16px;background: #4E70B5;display: inline-block"></div>-->
<!--                                {{$t(keyContent[2].title)}}-->
<!--                            </div>-->
<!--                            <p style="font-size: 18px;color: #666666;font-weight: normal">{{$t(keyContent[2].label)}}</p>-->
<!--                        </div>-->
<!--                    </div>-->
                </div>
<!--                <div style="font-size: 18px;font-weight: 700;color: #666666;margin: 30px 0;min-height: 250px;background: #F9FAFC">-->
<!--                    <div style="width: 25%;float: left;height: 223px">-->
<!--                        <img v-if="$i18n.locale=='zh'" src="@/assets/img/financialService/threeFinance.png" alt="" style="width: 333px;height: 100%">-->
<!--                        <img v-if="$i18n.locale=='en'" src="@/assets/img/financialService/threeFinance2.png" alt="" style="width: 333px;height: 100%">-->
<!--                    </div>-->
<!--                    <div style="width: 65%;float: right;margin: 0px 20px 20px 0;">-->
<!--                        <p style="text-align: center;font-weight: 700">{{$t('common.SupportEachOther')}}</p>-->
<!--                        <p style="font-weight: normal">{{$t('common.Projectsincubated')}}</p>-->
<!--                    </div>-->
<!--                    <div style="clear: both"></div>-->
<!--                </div>-->
            </div>
        </div>
        <!--    登录提示-->
<!--        <el-dialog-->
<!--                :title="$i18n.locale=='zh'?'提示':'Reminder'"-->
<!--                :visible.sync="toViewLogin"-->
<!--                :width="$i18n.locale=='zh'?'500px':'750px'"-->
<!--                :height="$i18n.locale=='zh'?'300px':'386px'"-->
<!--                :before-close="toViewLoginChange"-->
<!--        >-->
<!--            <div style="width: 100%;height: 100%;">-->
<!--                <img src="@/assets/img/loginTips.png" alt="" style="width: 180px;height: 180px;margin-left: 20px;">-->
<!--                <div style="float: right;margin-right: 20px;" :style="$i18n.locale=='zh'?'width: 49%;margin-top: 10px;':'width: 453px;margin-top: -25px;'">-->
<!--                    <div style="font-size: 20px;font-weight: normal;color: #333333;-->
<!--                font-family: HiraginoSansGB-W3, HiraginoSansGB;-->
<!--                line-height: 40px;">-->
<!--                        {{$t('common.ReminderFirst')}}-->
<!--                    </div>-->
<!--                    <div style="font-size: 16px;font-family: HiraginoSansGB-W3, HiraginoSansGB;-->
<!--              font-weight: normal;color: #666666;line-height: 30px;">-->
<!--                        {{$t('common.ReminderSecond')}} <span style="color: #0091FF;font-size: 18px;">{{num}}</span> {{$t('common.ReminderThird')}}-->
<!--                    </div>-->
<!--                    <div style="font-size: 14px;font-family: HiraginoSansGB-W3, HiraginoSansGB;-->
<!--              font-weight: normal;color: #666666;line-height: 30px;">-->
<!--                        {{$t('common.ReminderForth')}}-->
<!--                    </div>-->
<!--                    <div style="font-size: 14px;font-family: HiraginoSansGB-W3, HiraginoSansGB;-->
<!--              height:33px;line-height:60px;font-weight: normal;color: #0091FF;">-->
<!--                <span style="margin-left: 40px;" class="cursor" @click="toView('login')">-->
<!--                  {{$t('common.ReminderFifth')}}-->
<!--                </span>-->
<!--                        <span style="margin-left: 10px;" class="cursor" @click="toView('Register')">-->
<!--                  {{$t('common.ReminderSixth')}}-->
<!--                </span>-->
<!--                    </div>-->
<!--                </div>-->
<!--            </div>-->
<!--        </el-dialog>-->
    </div>
</template>
<script>
    import {getBaseFundIdeasInfos} from '@/api/financialService/baseFundIdeasInfo'
    import {getFollowModeNumlByModelIdAndUserId} from "../../api/operation/basePortalModelFollowInfo";
    import {getToken } from "@/utils/auth";
    import Base from "@/views/base/Base";
    import { saveFollowModel } from "@/api/operation/basePortalModelFollowInfo";

    export default{
        name:'FinancialServicesIdeasDetails2',
        extends: Base,
        data(){
            return{
                num:5,
                iniData:{},
                ifcommon:false,
                toViewLogin:false,
                keyContent:[
                    {
                        title:'common.GreenDevelopmentFund',
                        label:'common.Development1'
                    },
                    {
                        title:'common.GreenInnovationFund',
                        label:'common.Innovation1'
                    },
                    {
                        title:'common.GreenConstructionFund',
                        label:'common.Construction1'
                    },
                ],
                params:{
                    pageSize:"5",
                    pageNo:"1",
                    language:'',
                    baseEntityId:'',
                    statusDict:'2'
                }
            }
        },
        mounted() {
            this.getDetails();

        },
        watch: {
            '$i18n.locale'(){
                this.getDetails();
            },
        },
        methods:{
            // 未登录跳转
            loginTipsChange(){
                const that=this;
                this.num =5;
                // clearInterval(timer_interval);

                this.timer = setInterval(function() {
                    if (that.num > 0) {
                        that.num--;
                    } else {
                        if(that.toViewLogin==true){
                            clearInterval(that.timer);
                            that.toView('login');
                        }else {
                            clearInterval(that.timer);
                        }
                    }
                }, 1000)
            },
            // 判断未登录跳转是否关闭
            toViewLoginChange(done){
                this.toViewLogin=false;
                this.num=5;
                clearInterval(this.timer);
            },
            getDetails(){
                this.params.language = this.$i18n.locale.toUpperCase();
                this.params.baseEntityId = this.$route.query.key;
                getBaseFundIdeasInfos(this.params).then((res)=>{
                    this.iniData = res.data.baseFundIdeasInfos[0];

                    this.iniData.introduction = this.iniData.introduction.replace(/<img[^>]*>/gi, function(match, capture) {
                        var match = match.replace(/(title="(.*?)")/ig,'');
                        return match;
                    })

                    this.iniData.keyword = this.iniData.keyword.split(',');
                    this.getMyCollecModel()
                })
            },
            // 项目收藏改变
            // shareChange() {
            //     if (this.ifcommon) {
            //         this.Collection("unfollow");
            //     }else{
            //         this.Collection("follow");
            //     }
            // },
            // Collection: function (collectType) {
            //     let user = window.localStorage.getItem("user");
            //     if (!this.$Cookies.get('token')) {
            //         this.toViewLogin = true;
            //     } else {
            //         var users = JSON.parse(user);
            //         var token = "" + getToken();
            //         var userId = users.userId;
            //         var baseEntityId =this.iniData.baseEntityId;
            //
            //         // 接口逻辑
            //         this.submitHandler((token) => {
            //             saveFollowModel(baseEntityId, "finance", userId, collectType, token)
            //                 .then((result) => {
            //                     console.log(result)
            //                     this.$message({
            //                         message: result.data,
            //                         type: "success",
            //                     });
            //                     this.ifcommon = !this.ifcommon;
            //                     this.resetToken();
            //                 })
            //                 .catch((error) => {
            //                     this.$message({
            //                         message: result.data,
            //                         type: "failed",
            //                     });
            //                 });
            //         });
            //     }
            // },
            // getMyCollecModel(){
            //     const that= this;
            //     let user = window.localStorage.getItem("user");
            //     if (this.$Cookies.get('token')) {
            //
            //         var users = JSON.parse(user);
            //         var token = "" + getToken();
            //         var baseEntityId = this.iniData.baseEntityId;
            //         this.userId = users.userId;
            //         getFollowModeNumlByModelIdAndUserId(
            //             baseEntityId,
            //             "finance",
            //             this.userId
            //         ).then((res) => {
            //             this.ifcommon = res.data;
            //             console.log(
            //                 res.data,
            //                 "---------------------------------------------------------------------------"
            //             );
            //         });
            //
            //     }
            // },

        }
    }
</script>

<style scoped>
    .box {
        margin-top: 10px;
        background: #fff;
        /* height: 500px; */
        padding: 20px 0;
    }
    .crumbs {
        margin-left: 20px;
    }
    .box1 {
        padding: 0;
        /* transform: translateX(-20px); */
        background: #fff;
        margin-top: 15px;
    }

    body {
        margin: 0;
    }
    .ideasTitle{
        font-size: 28px;
        color: #666666;
        font-weight: 700;
        margin: 30px auto;
        text-align: center;
    }
    .contentList{
        width: 100%;
        display: flex;
        justify-content: space-between;

    }
</style>