dev/dcp-web-gate/src_old/views/userCenter/userCenterItem/userCenterResourceSharing.vue

<template>
    <div style="width: 100%;background: #fff;min-height: 700px;color: #666;" class="userCenterResourceSharing">
        <div style="height: 60px;line-height: 60px;padding-top: 30px;margin-left: 30px;margin-right: 30px; border-bottom: 1px solid rgba(228, 228, 228, 1);">
            {{$t('common.myResourceSharing')}}
        </div>
        <!-- 模糊查询      -->
        <div style="width: 100%;height: 60px;line-height: 60px;padding: 0 30px;box-sizing: border-box" class="tableSearch">
            <div style="width: 300px;float: right;margin: 0 10px 0 0;">
                <el-input class="input-with-select"
                          style="height: 40px;"
                          :placeholder="$t('common.resourceInputName')"
                          v-model="searchValue"
                          maxlength="10"
                          show-word-limit
                          @change="getTableData">
                    <el-button slot="append" icon="el-icon-search" @change="getTableData"></el-button>
                </el-input>
            </div>
            <div style="float: right;margin: 0 30px 0 0;">
                <span style="font-size: 16px;color: #5E5E5E;margin: 0 10px 0 0;">{{$t('common.resourceState')}}</span>
                <el-select v-model="selectValue" :placeholder="$t('common.EnterContent')" @change="selectChange">
                    <el-option
                            v-for="item in selectOptions"
                            :label="$t(item.value)"
                            :value="item">
                    </el-option>
                </el-select>
            </div>
            <div style="clear: both;"></div>
        </div>
        <!-- 表格      -->
        <div style="width: 100%;padding: 0 30px;box-sizing: border-box;margin-top: 10px;">
            <el-table
                    ref="singleTable"
                    :data="tableData"
                    highlight-current-row
                    @current-change="tableChange"
                    style="width: 100%">
                <template slot="empty">
                    {{ $t('common.resourceData') }}
                </template>
                <el-table-column
                        :label="$t('common.Name')"
                        >
                    <template slot-scope="scope">
                        <span style="color: #1890FF;cursor: pointer;" class="threeLine" @click="toDetailDialog(scope.row)">{{ scope.row.name }}</span>
                    </template>
                </el-table-column>
                <el-table-column
                        :label="$t('common.ApplicationType')"
                        width="160">
                    <template slot-scope="scope">
                        <span style="">{{$t(scope.row.reserveOneValue)}}</span>
                    </template>
                </el-table-column>
                <el-table-column
                        :label="$t('common.resourceState')"
                        width="180">
                    <template slot-scope="scope">
                        <span style="">{{$t(scope.row.approveStatusValue)}}</span>
                    </template>
                </el-table-column>
                <el-table-column
                        :label="$t('common.ApplicationTime')"
                        width="180">
                    <template slot-scope="scope">
                        <span style="">{{ scope.row.createDate }}</span>
                    </template>
                </el-table-column>
                <el-table-column :label="$t('common.Option')">
                    <template slot-scope="scope">
                        <i class="el-icon-view"
                           style="color: #1296db;font-size: 14px;margin: 0 10px;"
                           @click="toApplyDialog(scope.row, scope.$index)"></i>
                        <i class="el-icon-user-solid"
                           style="color: #1296db;font-size: 14px;margin: 0 10px;"
                           @click="toApplyListDialogChange(scope.row, scope.$index)"
                           v-show="scope.row.approveStatus==3&&scope.row.reserveOne==1"></i>
                        <i class="el-icon-delete"
                           style="color: #1296db;font-size: 14px;margin: 0 10px;"
                           @click="tableApplyDelete(scope.$index, scope.row)"
                           v-show="scope.row.approveStatus !=3"></i>
                    </template>
                </el-table-column>
            </el-table>
        </div>
        <!-- 表格分页      -->
        <div style="width: 100%;position: relative;height: 100px;margin-bottom: 30px;">
            <el-pagination
                    background
                    style="height: 80px;position: absolute;left: 50%;top: 100px;transform: translate(-50%,-50%);"
                    :current-page="currentPage"
                    :page-size="10"
                    @current-change="pageChange"
                    layout="prev, pager, next"
                    :page-count="totalPage-0"
            ></el-pagination>
        </div>
        <!-- 详情dialog-->
        <el-dialog
                :title="$i18n.locale=='zh'?'资源发布申请详情':'Details of resource publication application'"
                center
                :visible.sync="detailDialog"
                width="1200px"
                class="detailDialog"
                :before-close="beforeClose">
            <div style="height: 80%;font-size: 16px;font-weight: 700">
                <div style="height: 60px;line-height: 60px;margin-left: 30px;margin-right: 30px; border-bottom: 1px solid rgba(228, 228, 228, 1);">
                    <span>{{$i18n.locale=='zh'?'资源基本信息':'Basic resource information'}}</span>
                    <!--                    <span style="float: right;"><i class="el-icon-arrow-down" style="color: #00f;font-size: 30px;font-weight: 700"></i></span>-->
                </div>
                <div v-if="reserveOne==1" style="width: 100%;padding: 0 150px;box-sizing: border-box;font-size: 14px;font-weight: 400;margin-top: 30px;">
                    <el-tabs v-model="editableTabsValue" type="card" closable>
                        <el-tab-pane
                                v-for="(item, index) in detailList"
                                :key="item.language"
                                :label="$t(item.languageIndex)"
                        >
                            <div style="width: 100%;;box-sizing: border-box">
                                <!-- <el-form ref="form" :model="form" label-width="25%" class="formStyle"> -->
                                <el-form ref="form" :model="form" label-width="25%">
                                    <!--图片-->
                                    <el-form-item :label="$t('common.resourceThePicture')">
                                        <div style="height: 80px;">
                                            <img :src="'api/file/pub/'+ item.researchResourcesMedia" alt="" style="width: 80px;height: 80px;margin-right: 10px">
                                            <!-- <img :src="'api/file/pub/'+ i" alt="" style="width: 80px;height: 80px;margin-right: 10px"  v-for="i in item.researchResourcesMedia"> -->
                                            <div style="clear: both"></div>
                                        </div>
                                        <!-- <div style="height: 80px;padding: 0 15px">
                                            <span>{{$i18n.locale=='zh'?'暂无图片':'No pictures'}}</span>
                                        </div> -->
                                    </el-form-item>
                                    <!--名称-->
                                    <el-form-item :label="$t('common.resourceName')">
                                        <el-input :value="item.name" style="width: 320px;float: left;" disabled></el-input>
                                    </el-form-item>
                                    <!--所属单位-->
                                    <el-form-item :label="$t('common.resourceSubordinateUnits')">
                                        <el-input :value="item.affiliatedUnitName" style="width: 320px;float: left;" disabled></el-input>
                                    </el-form-item>
                                    <!--地址-->
                                    <el-form-item :label="$t('common.resourceAddress')">
                                        <el-input :value="item.address" style="width: 320px;float: left;" disabled></el-input>
                                    </el-form-item>
                                    <!--国家-->
                                    <el-form-item :label="$t('common.resourceCountries')">
                                        <el-input :value="item.country" style="width: 320px;float: left;" disabled></el-input>
                                    </el-form-item>
                                    <!--容纳人数-->
                                    <!--<el-form-item :label="$i18n.locale=='zh'?'容纳人数':'galleryful'">
                                        <el-input :value="item.a" style="width: 320px;float: left;" disabled></el-input>
                                    </el-form-item>-->
                                    <!--对接方式-->
                                    <el-form-item :label="$t('common.resourceDockingWay')">
                                        <el-input v-show="$i18n.locale=='zh'" :value="item.dockingMode=='dbwdj'?'本单位对接':'合作组织对接'" style="width: 320px;float: left;" disabled></el-input>
                                        <el-input v-show="$i18n.locale=='en'" :value="item.dockingMode=='dbwdj'?'This unit docking':'This unit docking'" style="width: 320px;float: left;" disabled></el-input>
                                    </el-form-item>
                                    <!--联系人-->
                                    <el-form-item :label="$t('common.resourceTheContact')">
                                        <el-input :value="item.contactsName" style="width: 320px;float: left;" disabled></el-input>
                                    </el-form-item>
                                    <!--联系电话-->
                                    <el-form-item :label="$t('common.resourceContactPhoneNumber')">
                                        <el-input :value="item.contactsNumber" style="width: 320px;float: left;" disabled></el-input>
                                    </el-form-item>
                                    <!--邮箱-->
                                    <el-form-item :label="$t('common.resourceEmail')">
                                        <el-input :value="item.contactsEmail" style="width: 320px;float: left;" disabled></el-input>
                                    </el-form-item>
                                    <!--详情介绍-->
                                    <el-form-item :label="$t('common.resourceDetailsAreIntroduced')" v-if="item.informationList">
                                        <div style="width: 80%;height: 200px;border: 1px solid rgba(204, 204, 204, 1);" v-if="item.informationList.length>0">
                                            <div style="width: 80px;height: 100%;float: left;border-right: 1px solid rgba(204, 204, 204, 1);">
                                                {{item.informationList[0].content}}
                                            </div>
                                            <div style="height: 100%;float: left;overflow: hidden;width: calc(100% - 82px);padding: 15px;box-sizing: border-box" v-html="item.informationList[0].content">

                                            </div>
                                            <div style="clear: both"></div>
                                        </div>
                                        <div style="width: 80%;height: 200px;border: 1px solid rgba(204, 204, 204, 1);margin-top: 20px;" v-if="item.informationList&&item.informationList.length>1">
                                            <div style="width: 80px;height: 100%;float: left;border-right: 1px solid rgba(204, 204, 204, 1);">
                                                {{item.informationList[1].content}}
                                            </div>
                                            <div style="height: 100%;float: left;overflow: hidden;width: calc(100% - 82px);padding: 15px;box-sizing: border-box" v-html="item.informationList[1].content">

                                            </div>
                                            <div style="clear: both"></div>
                                        </div>
                                    </el-form-item>
                                    <!--附件-->
                                    <!--<el-form-item :label="$t('common.resourceTheAttachment')">
                                        <el-input v-if="item.researchResultFile" :value="'api/file/pub'+item.researchResourcesFile" style="width: 320px;float: left;" disabled class="inputFile"></el-input>
                                    </el-form-item>-->
                                    <el-form-item style="margin-left: 30%">
                                        <el-button style="margin-right: 50px;" @click="beforeClose">{{$t('common.resourceCancel')}}</el-button>
                                    </el-form-item>
                                </el-form>
                            </div>
                        </el-tab-pane>
                    </el-tabs>
                    <!--<div v-show="detailListLength==undefined||detailListLength==0" style="text-align: center;height: 60px;border-bottom: 1px solid #eee;border-top: 1px solid #eee;">
                        <span v-if="$i18n.locale=='en'" style="line-height: 60px;">no data</span>
                        <span v-else="$i18n.locale=='zh'" style="line-height: 60px;">暂无数据</span>
                    </div>-->
                </div>
                <div v-else-if="reserveOne==0" style="width: 100%;padding: 0 150px;box-sizing: border-box;font-size: 14px;font-weight: 400;margin-top: 30px;">
                    <el-tabs  v-model="editableTabsValue" type="card" closable>
                        <el-tab-pane
                                v-for="(item, index) in detailList"
                                :key="item.language"
                                :label="$t(item.languageIndex)"
                        >
                            <div style="width: 100%;padding: 0 150px;box-sizing: border-box">
                                <!-- <el-form ref="resultForm" :model="form" label-width="140px"  class="formStyle"> -->
                                <el-form ref="resultForm" :model="form" label-width="140px">
                                    <!--成果封面-->
                                    <el-form-item :label="$t('common.resourceResultsTheCover')">
                                        <div style="height: 60px;">
                                            <img :src="'api/file/pub/'+item.researchResultCover" alt="" style="width: 80px;height: 80px;margin-right: 10px">
                                            <div style="clear: both"></div>
                                        </div>
                                    </el-form-item>
                                    <!--名称-->
                                    <el-form-item :label="$t('common.resourceName')">
                                        <el-input :value="item.name" style="width: 320px;float: left;" disabled></el-input>
                                    </el-form-item>
                                    <!--所属单位-->
                                    <el-form-item :label="$t('common.resourceSubordinateUnits')">
                                        <el-input :value="item.affiliatedUnitName" style="width: 320px;float: left;" disabled></el-input>
                                    </el-form-item>
                                    <!--国家-->
                                    <el-form-item :label="$t('common.resourceCountries')">
                                        <el-input :value="item.country" style="width: 320px;float: left;" disabled></el-input>
                                    </el-form-item>
                                    <!--联系人-->
                                    <el-form-item :label="$t('common.resourceTheContact')">
                                        <el-input :value="item.contactsName" style="width: 320px;float: left;" disabled></el-input>
                                    </el-form-item>
                                    <!--联系电话-->
                                    <el-form-item :label="$t('common.resourceContactPhoneNumber')">
                                        <el-input :value="item.contactsNumber" style="width: 320px;float: left;" disabled></el-input>
                                    </el-form-item>
                                    <!--摘要-->
                                    <el-form-item :label="$t('common.resourceDetailsAbstract')">
                                        <el-input
                                                type="textarea"
                                                maxlength="500"
                                                show-word-limit
                                                rows="6"
                                                disabled
                                                class="inputTextarea"
                                                :value="item.researchResultAbstract"
                                        >
                                        </el-input>
                                                <!-- v-html="item.researchResultAbstract" -->
                                    </el-form-item>
                                    <!--附件-->
                                    <!--<el-form-item :label="$t('common.resourceTheAttachment')">
                                        <el-input v-if="item.researchResultFile" :value="'api/file/pub'+item.researchResultFile" style="width: 320px;float: left;" disabled class="inputFile"></el-input>
                                        <el-input v-else value="" style="width: 320px;float: left;" disabled class="inputFile"></el-input>
                                    </el-form-item>-->
                                    <el-form-item style="margin-left: 30%">
                                        <el-button style="margin-right: 50px;" @click="beforeClose">{{$t('common.resourceCancel')}}</el-button>
                                    </el-form-item>
                                </el-form>
                            </div>
                        </el-tab-pane>
                    </el-tabs>
                </div>
            </div>
        </el-dialog>
        <!-- 查看申请dialog-->
        <el-dialog
                :title="$i18n.locale=='zh'?'资源发布申请信息':'Resource release application information'"
                center
                :visible.sync="applyDialog"
                width="1200px"
                class="applyDialog">
            <div style="height: 80%;font-size: 16px;font-weight: 700">
                <div style="height: 60px;line-height: 60px;margin-left: 30px;margin-right: 30px; border-bottom: 1px solid rgba(228, 228, 228, 1);">
                    {{$i18n.locale=='zh'?'资源发布申请结果':'Resource release application results'}}
                </div>
                <div style="width: 100%;padding: 0 50px;box-sizing: border-box;font-size: 14px;font-weight: 400;position: relative;">
                    <div style="width: 100%;border-bottom: 1px dashed rgba(102,102,102,0.4);">
                        <div style="width: 100px; height: 140px;float: left;">
                            <div style="margin-top:20px;height: 100px;">
<!--                                <img src="" alt="" style="width: 100%;background-color: red;">-->
                                <i class="el-icon-time" style="font-size: 100px;color: #3300FF"></i>
                            </div>
                        </div>
                        <div style="float: left;width: 360px;height: 140px; margin-left: 60px;">
                            <span style="font-size: 20px;font-weight: 700;color: #3300FF;margin: 20px 0 10px;display: block;">
                                <span v-show="applyData.approveStatus==2">{{$i18n.locale=='zh'?'您的发布的资源审核中，请耐心等待...':'Please be patient while your release resources are reviewed...'}}</span>
                                <span v-show="applyData.approveStatus==3">{{$i18n.locale=='zh'?'您的资源发布申请已通过！':'Your resource release application has been approved!'}}</span>
                                <span v-show="applyData.approveStatus==4">{{$i18n.locale=='zh'?'您的资源发布申请未通过！':'Your resource publishing application was not approved!'}}</span>
                            </span>
                            <span style="font-size: 12px;font-weight: 400;color: #1296DB;margin: 5px 0 10px;display: block;">
                                <span @click="toDetailDialog(applyData)" style="cursor: pointer;">{{$i18n.locale=='zh'?'查看申请详情':'View application details'}}</span>
                            </span>
                            <!-- <span style="font-size: 16px;font-weight: 400;color: #999999;margin: 5px 0 0;display: block;">
                                <span v-show="applyData.approveStatus==4">{{$i18n.locale=='zh'?'未通过原因：涉及到敏感词':'Reason for not passing: involving sensitive words'}}</span>
                            </span> -->
                        </div>
                        <div style="float: left;width: 289px;height: 140px; ">
                            <span style="font-size: 16px;font-weight: 400;color: #999;margin: 20px 0 10px;display: block;">
                                {{$i18n.locale=='zh'?'申请时间':'Application time'}}：{{applyData.createDate}}
                            </span>
                        </div>
                        <div style="float: right;width: 118px;height: 140px;text-align: center">
                            <span style="line-height: 140px;font-size: 16px;color: #1890FF;">
<!--                               {{$i18n.locale=='zh'?'快捷处理':'Resource release application results'}}-->
                            </span>
                        </div>
                        <div style="clear: both;"></div>
                    </div>
                    <div class="old" v-show="applyDataOld">{{$i18n.locale=='zh'?'历史记录':'history'}}</div>
                    <div v-for="item in applyDataOld">
                        <div style="width: 100%;border-bottom: 1px dashed rgba(102,102,102,0.4);">
                            <div style="width: 100px; height: 140px;float: left;">
                                <div style="margin-top:20px;height: 100px;">
                                    <img src="../../../assets/img/ResourceSharing/u78920.png" alt="" style="width: 100%;background-color: red;">
<!--                                    <i class="el-icon-time" style="font-size: 100px;color: #3300FF"></i>-->
                                </div>
                            </div>
                            <div style="float: left;width: 360px;height: 140px; margin-left: 60px;">
                            <span style="font-size: 20px;font-weight: 700;color: #3300FF;margin: 20px 0 10px;display: block;">
                                <span v-show="item.approvalType==2">{{$i18n.locale=='zh'?'您的发布的资源审核中，请耐心等待...':'Please be patient while your release resources are reviewed...'}}</span>
                                <span v-show="item.approvalType==3">{{$i18n.locale=='zh'?'您的资源发布申请已通过！':'Your resource release application has been approved!'}}</span>
                                <span v-show="item.approvalType==4">{{$i18n.locale=='zh'?'您的资源发布申请未通过！':'Your resource publishing application was not approved!'}}</span>
                            </span>
                                <span style="font-size: 12px;font-weight: 400;color: #1296DB;margin: 5px 0 10px;display: block;">
                                <span></span>
                            </span>
                                <span style="font-size: 16px;font-weight: 400;color: #999999;margin: 5px 0 0;display: block;">
                                <span v-show="item.approvalType==4">{{$i18n.locale=='zh'?'未通过原因：':'Reason for not passing: '}}{{item.approvalMessage}}</span>
                                <!-- <span v-show="item.approvalType==4">{{$i18n.locale=='zh'?'未通过原因：涉及到敏感词':'Reason for not passing: involving sensitive words'}}</span> -->
                            </span>
                            </div>
                            <div style="float: left;width: 289px;height: 140px; ">
                            <span style="font-size: 16px;font-weight: 400;color: #999;margin: 20px 0 10px;display: block;">
                                {{$i18n.locale=='zh'?'申请时间':'Application time'}}：{{item.commitDate}}
                            </span>
                            </div>
                            <div style="float: right;width: 118px;height: 140px;text-align: center">
                            </div>
                            <div style="clear: both;"></div>
                        </div>
                    </div>
                </div>
            </div>
        </el-dialog>
        <!-- 申请列表dialog-->
        <el-dialog
                :visible.sync="applyListDialog"
                width="1200px"
                class="applyListDialog">
            <div style="height: 80%;font-size: 14px;font-weight: 700">
                <!-- 模糊查询      -->
                <div style="line-height: 60px;margin-left: 30px;margin-right: 30px; border-bottom: 1px solid rgba(228, 228, 228, 1);">
                    <div style="width: 100%;line-height: 60px;padding: 0;box-sizing: border-box">
                        <div style="float: left;margin: 0 10px 0 0;">
                            <span style="font-size: 14px;color: #5E5E5E;margin: 0 10px 0 0;line-height: 60px;">{{$i18n.locale=='zh'?'申请单位':'Employer name'}}:</span>
                            <el-input :placeholder="$i18n.locale=='zh'?'请输入申请单位':'plese enter the employer name'" clearable v-model="searchFrom.affiliatedUnitName" class="input-with-select" style="height: 40px;width: 260px;"></el-input>
                        </div>
                        <div style="float: left;margin: 0 10px 0 0;height: 61px;"  class="search">
                            <span style="font-size: 14px;color: #5E5E5E;margin: 0 10px 0 0;">{{$i18n.locale=='zh'?'联系电话':'Contact phone'}}:</span>
                            <el-input :placeholder="$i18n.locale=='zh'?'请输入联系电话':'Please enter the contact phone'" clearable v-model="searchFrom.contactsNumber" class="input-with-select" style="height: 40px;width: 260px;"></el-input>
                        </div>
                        <!-- <div style="float: left;margin: 0 10px 0 0;height: 61px;">
                            <span style="font-size: 14px;color: #5E5E5E;margin: 0 10px 0 0;">{{$i18n.locale=='zh'?'参观时间':'Visit time'}}:</span>
                            <el-date-picker
                                    v-model="value1"
                                    type="datetimerange"
                                    :range-separator="$i18n.locale=='zh'?'至':'to'"
                                    :start-placeholder="$i18n.locale=='zh'?'开始日期':'Start date'"
                                    :end-placeholder="$i18n.locale=='zh'?'结束日期':'End date'">
                            </el-date-picker>
                        </div> -->
                        <div style="float: left;margin: 0 10px 0 0;height: 61px;"  class="search">
                            <el-button type="primary" @click="tableSearch()">{{$t('common.uquery')}}</el-button>
                        </div>
                        <div style="float: right;margin: 0 10px 0 0;height: 61px;">
                            <!-- 导出-->
                            <el-button size="mini" @click="tableExport()">{{$t('common.export')}}</el-button>
                            <!-- 删除-->
                            <el-button size="mini" type="danger"  @click="tableDelete()">{{$t('common.delete')}}</el-button>
                        </div>
                        <div style="clear: both;"></div>
                    </div>
                </div>
                <!-- 表格      -->
                <div style="width: 100%;padding: 0 30px;box-sizing: border-box;margin-top: 10px;font-size: 14px;">
                    <el-table
                            ref="singleTable"
                            :data="tableList"
                            highlight-current-row
                            @selection-change ="selectionChange"
                            :header-cell-style="{textAlign: 'center'}"
                            :cell-style="{ textAlign: 'center' }"
                            style="width: 100%">
                        <template slot="empty">
                            {{ $t('common.resourceData') }}
                        </template>
                        <el-table-column
                                type="selection"
                                width="55">
                        </el-table-column>
                        <el-table-column
                                :label="$i18n.locale=='zh'?'申请单位':'Employer name'"
                                width="130">
                            <template slot-scope="scope">
                                <span style="color: #1890FF;cursor: pointer;" @click="tableDetail(scope.row)">{{ scope.row.affiliatedUnitName }}</span>
                            </template>
                        </el-table-column>
                        <el-table-column
                                :label="$i18n.locale=='zh'?'参观时间':'Visit time'"
                                width="200">
                            <template slot-scope="scope">
                                <span >{{ scope.row.startDateOfVisitors }}--{{ scope.row.endDateOfVisitors }}</span>
                            </template>
                        </el-table-column>
                        <el-table-column
                                property="numberOfVisitors"
                                :label="$i18n.locale=='zh'?'参观人数':'Attendance'"
                                width="130">
                            <!-- <template slot-scope="scope">
                                <span style="color: #1890FF;cursor: pointer;" @click="toDetailDialog(scope.row)">{{ scope.row.numberOfVisitors }}</span>
                            </template> -->
                        </el-table-column>
                        <el-table-column
                                property="contactsName"
                                :label="$i18n.locale=='zh'?'联系人':'Contact person'">
                            <!-- <template slot-scope="scope">
                                <span style="color: #1890FF;cursor: pointer;" @click="toDetailDialog(scope.row)">{{ scope.row.contactsName }}</span>
                            </template> -->
                        </el-table-column>
                        <el-table-column
                                property="contactsNumber"
                                :label="$i18n.locale=='zh'?'联系电话':'Contact phone'">
                            <!-- <template slot-scope="scope">
                                <span style="color: #1890FF;cursor: pointer;" @click="toDetailDialog(scope.row)">{{ scope.row.contactsNumber }}</span>
                            </template> -->
                        </el-table-column>
                        <el-table-column
                                property="contactsEmail"
                                :label="$i18n.locale=='zh'?'邮箱':'Email'">
                            <!-- <template slot-scope="scope">
                                <span style="color: #1890FF;cursor: pointer;" @click="toDetailDialog(scope.row)">{{ scope.row.contactsEmail }}</span>
                            </template> -->
                        </el-table-column>
                        <!-- <el-table-column
                                property="otherInstructions"
                                :label="$i18n.locale=='zh'?'其他说明':'Other instructions'"
                                width="200">
                        </el-table-column> -->
                    </el-table>
                </div>
                <!-- 表格分页      -->
                <div v-if="listtotalPage >0" style="width: 100%;position: relative;height: 100px;">
                    <el-pagination
                            background
                            style="height: 80px;position: absolute;right:0;top: 100px;transform: translate(-50%,-50%);"
                            :current-page="listcurrentPage"
                            :page-sizes="[6, 12, 18, 24]"
                            :page-size="1"
                            @current-change="listpageChange"
                            layout="prev, pager, next"
                            :total="listtotalPage-0"
                    ></el-pagination>
                </div>
            </div>
            <span slot="footer" class="dialog-footer">
                <el-button @click="applyListDialog = false">{{$i18n.locale=='zh'?'取消':'Cancel'}}</el-button>
            </span>
        </el-dialog>
        <!-- 申请列表详情 -->
        <el-dialog :visible.sync="applyListDetailDialog" width="1200px">
            <div class="apply">
                <el-form :model="applyFrom" label-width="140px">
                    <el-form-item :label="$t('common.resourceAttendance')">
                        <el-input v-model="applyFrom.numberOfVisitors" style="width: 40%;" disabled>
                        </el-input>
                    </el-form-item>
                    <el-form-item :label="$t('common.resourceVisitTime')">
                        <el-input v-model="applyFrom.data" style="width: 40%;" disabled>
                        </el-input>
                    </el-form-item>
                    <el-form-item  :label="$t('common.resourceTheContact')" >
                        <el-input v-model="applyFrom.contactsName" style="width: 95%;" disabled></el-input>
                    </el-form-item>
                    <el-form-item  :label="$t('common.resourceToApplyForTheUnit')" >
                        <el-input v-model="applyFrom.affiliatedUnitName" style="width: 95%;" disabled></el-input>
                    </el-form-item>
                    <el-form-item  :label="$t('common.resourceContactPhoneNumber')" >
                        <el-input v-model="applyFrom.contactsNumber" style="width: 95%;" disabled></el-input>
                    </el-form-item>
                    <el-form-item  :label="$t('common.resourceEmail')" >
                        <el-input v-model="applyFrom.contactsEmail" style="width: 95%;" disabled></el-input>
                    </el-form-item>
                    <el-form-item :label="$t('common.resourceOtherInstructions')">
                        <el-input disabled type="textarea" v-model="applyFrom.otherInstructions" style="width: 95%;" rows="6" disabled>
                        </el-input>
                    </el-form-item>
                </el-form>
            </div>
            <span slot="footer" class="dialog-footer">
                <el-button @click="applyListDetailDialog = false">{{$t('common.resourceCancel')}}</el-button>
            </span>
        </el-dialog>
    </div>
</template>
<script>
    import Base from "@/views/base/Base"
    import {getDicts} from '@/api/dict';
    import {getAllEntityByUserCenter,deleteOr} from '@/api/research/baseResearchResultEntity';
    import {getBaseResearchResultViews, gateResearchResultViewById,gateResearchResultFileById } from "@/api/research/baseResearchResultView";
    import { gateResearchResourcesViewById ,getBaseResearchResourcesViews} from "@/api/research/resource/baseResearchResourcesView";
    import { getBaseResearchApplications,del,downloadResearchApplication } from "@/api/research/resource/baseResearchApplication";
    import { getInfosByEntityId} from "@/api/research/baseResearchResultEntity";
    import { getReleaseStatus } from "@/api/project/baseProjectView";
    import { getTreeByLanguagePortal } from "@/api/operation/baseCityInformationDict";
    import {formatDate} from "@/utils/formatUtils";
    export default {
        name: 'userCenterResourceSharing',
        extends: Base,
        data() {
            return {
                params:{
                    pageNo:'',
                    pageSize:'',
                    language:'',
                },
                languageList:[
                    {
                        label: "common.Chinese",
                        name: '1',
                        value: 'ZH',
                    },
                    {
                        label: 'common.English',
                        name: '2',
                        value: 'EN',
                    },
                ],
                countryList:[],
                //搜索
                searchValue: '',
                searchFrom:{
                    affiliatedUnitName:'',
                    contactsNumber:''
                },
                //选择
                selectValue: '',
                selectOptions: [
                    {
                        value:'common.All',
                        approveStatus: 0,
                        label: '全部'
                    },
                    {
                        value:'common.resourcePending',
                        approveStatus: 2,
                        label: '待审批'
                    },
                    {
                        value:'common.resourceTrough',
                        approveStatus: 3,
                        label: '已通过'
                    },
                    {
                        value:'common.resourceUnfinished',
                        approveStatus: 4,
                        label: '未通过'
                    },
                ],
                //表格
                tableData: [],
                currentRow: null,
                //分页
                currentPage: 1,
                totalPage:'',
                listcurrentPage: 1,
                listtotalPage:'',
                entityId:'',
                //详情dialog
                detailDialog:false,
                editableTabsValue:'0',
                reserveOne:'',
                detailList:[],
                detailListLength:'',
                form:{},
                bannerImg:[],
                //查看申请dialog
                applyDialog:false,
                applyData:'',
                applyDataOld:'',
                //申请列表dialog
                applyListDialog:false,
                tableList:[],
                value1:'',
                multipleSelection:[],//调研资源申请列表选择
                applyListDetailDialog:false,
                applyFrom:{},//申请详情
            }
        },
        watch: {
            '$i18n.locale'() {
                this.getDicts()
                this.getTableData()
            },
            // 'selectValue'(){
            //     this.getTableData()
            // }
        },
        mounted() {
            this.getDicts()
            this.getTableData()
        },
        methods: {
            //字典
            async getDicts() {
                if (this.$i18n.locale === 'zh') {
                    getDicts("APPROVE_STATUS_DICT,MEMBER_APPLY_PHASE_DICT,SERVICE_TYPE_DICT,SERVICE_CHILD_TYPE_DICT,SUPPORT_WAY_DICT,CUSTOM_SERVICE_STATUS,MEMBER_APPLY_AUDIT_STATUS_DICT").then(result => {
                        if (result.data) {
                            this.memberApplyStatus = result.data[0];
                            this.phaseDicts = result.data[1];
                            this.serviceTypeDicts = result.data[2];
                            this.childTypeDicts = result.data[3];
                            this.supportWayDicts = result.data[4]
                            this.statusDicts = result.data[5] || []
                            this.auditStatusDicts = result.data[6] || []
                            this.statusDicts.forEach((item,index) =>{
                                if(index === 1){
                                    item.label = '待审核'
                                }else if(index === 0){
                                    item.label = '待审核'
                                }
                            });
                            // this.getinitData(this.taberIndex)
                            // this.getTableData(this.taberIndex)
                        }
                    });
                } else {
                    getDicts("APPROVE_STATUS_DICT_EN,MEMBER_APPLY_PHASE_DICT,SERVICE_TYPE_DICT_EN,SERVICE_CHILD_TYPE_DICT_EN,SUPPORT_WAY_DICT_EN").then(result => {
                        if (result.data) {
                            this.memberApplyStatus = result.data[0];
                            this.phaseDicts = result.data[1];
                            this.serviceTypeDicts = result.data[2];
                            this.childTypeDicts = result.data[3];
                            this.supportWayDicts = result.data[4]
                            // this.getinitData(this.taberIndex)
                            //  this.getTableData(this.taberIndex)
                        }
                    });
                }
                await getTreeByLanguagePortal(this.$i18n.locale.toUpperCase()).then(result => {
                    if (result.data) {
                        let values = Object.values(result.data);
                        this.countryList = values;
                    }
                })
                /*await getDicts(
                    "LANGUAGE_DICT"
                ).then(result => {
                    if (result.data) {
                        this.languageList = result.data[0] || [];
                    }
                })*/
            },

            //资源状态选择框事件
            selectChange(){
                this.currentPage = 1
                this.getTableData()
            },

            //Data
            getTableData(){
                const that = this;
                let params;
                params = {
                    pageNo:this.currentPage,
                    pageSize:10,
                    language:'',
                    createBy:'',
                    name:that.searchValue?that.searchValue:'',
                    approveStatus:that.selectValue?(that.selectValue.approveStatus==0?'':that.selectValue.approveStatus):''
                }
                if (this.$i18n.locale.toUpperCase() == 'ZH') {
                    params.language = 'ZH';
                } else if (this.$i18n.locale.toUpperCase() == 'EN') {
                    params.language = 'EN';
                }
                let createBy = window.localStorage.getItem("user");
                params.createBy = JSON.parse(createBy).userId;
                getAllEntityByUserCenter(params).then((res)=>{
                    that.tableData = res.data.allEntity;
                    that.totalPage = res.data.page.totalPage;
                    that.tableData.forEach((i)=>{
                        if(i.approveStatus==2){
                            i.approveStatusValue = 'common.resourcePending'
                        }else if(i.approveStatus==3){
                            i.approveStatusValue = 'common.resourceTrough'
                        }else if(i.approveStatus==4){
                            i.approveStatusValue = 'common.resourceUnfinished'
                        }
                        if(i.reserveOne==0){
                            i.reserveOneValue = "common.resource"
                        }else if(i.reserveOne==1){
                            i.reserveOneValue = "common.researchResource"
                        }
                        i.createDate = i.createDate ? formatDate(i.createDate, "YYYY-MM-DD") : "";
                    })
                    
                })
            },
            //资源共享删除
            tableApplyDelete(index, row){
                this.$confirm(this.$i18n.locale.toUpperCase() == 'ZH' ?'确定删除该记录吗？':'Are you sure to delete this record?', 
                    this.$i18n.locale.toUpperCase() == 'ZH' ? '提示':'message', {
                    confirmButtonText: this.$i18n.locale.toUpperCase() == 'ZH' ?'确定':'OK',
                    cancelButtonText: this.$i18n.locale.toUpperCase() == 'ZH' ?'取消':'Cancel',
                    type: 'warning'
                }).then(() => {
                    deleteOr(row.entityId,row.reserveOne).then(res =>{
                        if(res.data){
                            this.$message({
                                message: this.$i18n.locale.toUpperCase() == 'ZH' ?'删除成功!':'successfully delete!',
                                type: 'success'
                            });
                        }else{
                            this.$message({
                                message: this.$i18n.locale.toUpperCase() == 'ZH' ?'删除失败!':'failure delete!',
                                type: 'warning'
                            });
                        }
                        this.getTableData()
                    })
                }).catch(() => {
                    this.$message({
                        type: 'info',
                        message: this.$i18n.locale.toUpperCase() == 'ZH' ?'已取消删除':'Cancelled Delete'
                    });
                });

            },


            //资源共享删除
            // tableApplyDelete(index, row){
            //     deleteOr(row.entityId,row.reserveOne).then(res =>{
            //         if(res.data){
            //             this.$message({
            //                 message: this.$i18n.locale.toUpperCase() == 'ZH' ?'删除成功!':'successfully delete!',
            //                 type: 'success'
            //             });
            //         }else{
            //             this.$message({
            //                 message: this.$i18n.locale.toUpperCase() == 'ZH' ?'删除失败!':'failure delete!',
            //                 type: 'warning'
            //             });
            //         }
            //         this.getTableData()
            //     })
            // },
            //表格
            tableChange(val) {
                this.currentRow = val;
            },

            selectionChange(row){
                this.multipleSelection =[]
                if(row.length > 0){
                    row.forEach((i) =>{
                        this.multipleSelection.push(i.id)
                    })
                }
            },
            //调研申请表格查询
            tableSearch(){
                this.toApplyListDialog(this.entityId)
            },
            //调研申请表格导出
            tableExport(){
                let param ={
                    affiliatedUnitName:this.searchFrom.affiliatedUnitName,
                    contactsNumber:this.searchFrom.contactsNumber,
                    pageNo: this.listcurrentPage,
                    pageSize: 10,
                    researchResourcesEntityId: this.entityId.entityId,
                    language:this.$i18n.locale.toUpperCase(),
                }
                downloadResearchApplication(param).then(response =>{
                    let blob = new Blob([response.data],{type:"application/vnd.ms-excel"});
                    let objectURL = URL.createObjectURL(blob);
                    const a = document.createElement('a');
                    document.body.appendChild(a);
                    a.setAttribute('style', 'display:none');
                    a.setAttribute('href', objectURL);

                    a.setAttribute('download', decodeURIComponent(response.fileName));
                    a.click();
                    URL.revokeObjectURL(objectURL);
                })
            },
            //调研申请表格详情
            tableDetail(row) {
                this.applyFrom = row
                this.applyFrom.data = row.startDateOfVisitors +' -- '+ row.endDateOfVisitors
                this.applyListDetailDialog = true
            },
            //调研申请表格删除
            tableDelete() {
                if(this.multipleSelection.length > 0){
                    this.$confirm(this.$i18n.locale.toUpperCase() == 'ZH' ?'确定删除该记录吗？':'Are you sure to delete this record?', 
                        this.$i18n.locale.toUpperCase() == 'ZH' ? '提示':'message', {
                        confirmButtonText: this.$i18n.locale.toUpperCase() == 'ZH' ?'确定':'OK',
                        cancelButtonText: this.$i18n.locale.toUpperCase() == 'ZH' ?'取消':'Cancel',
                        type: 'warning'
                    }).then(() => {
                        del(this.multipleSelection).then(res => {
                            if(res.status === '200'){
                                this.$message({
                                    type: 'success',
                                    message: this.$i18n.locale.toUpperCase() == 'ZH' ?'删除成功!':'successfully delete!'
                                })
                            }
                        })
                        this.toApplyListDialog(this.entityId)
                    }).catch(() => {
                        this.$message({
                            type: 'info',
                            message: this.$i18n.locale.toUpperCase() == 'ZH' ?'已取消删除':'Cancelled Delete'
                        });
                    });
                }else{
                    this.$message({type: 'warning',message: this.$i18n.locale.toUpperCase() == 'ZH' ?'请选择数据':'Please Select Data'});
                }

            },
            //表格分页
            pageChange(val) {
                this.currentPage = val;
                this.params.pageNo = val;
                this.getTableData();
            },
            listpageChange(val) {
                this.listcurrentPage = val;
                this.toApplyListDialog(this.entityId);
            },
            //详情dialog
            async toDetailDialog(ele,index){
                const that = this;
                this.detailDialog = true;
                that.reserveOne = ele.reserveOne;
                if(ele.reserveOne==0){
                    let param = {
                        id:ele.entityId,
                        reserveOne:ele.reserveOne,
                    };
                    await getInfosByEntityId(param).then((resulet) => {
                        let data = resulet.data;
                        if (data.baseResearchResultInfos) {
                            that.detailList = data.baseResearchResultInfos;
                            that.detailList.forEach((i)=>{
                                i.updateDate = i.updateDate ? formatDate(i.updateDate, "YYYY-MM-DD") : "";
                            })
                        }
                    });
                }
                if(ele.reserveOne==1){
                    let param = {
                        id:ele.entityId,
                        reserveOne:ele.reserveOne,
                    };
                    await getInfosByEntityId(param).then((resulet) => {
                        let data = resulet.data;
                        if (data.baseResearchResourcesInfos) {
                            that.detailList = data.baseResearchResourcesInfos;
                            that.detailList.forEach((i)=>{
                                i.updateDate = i.updateDate ? formatDate(i.updateDate, "YYYY-MM-DD") : "";
                                // if(i.researchResourcesMedia&&i.researchResourcesMedia!='null'&&i.researchResourcesMedia!=null){
                                //     that.bannerImg  = i.researchResourcesMedia.split(',')
                                // }
                                // for(let i=0;i<that.bannerImg.length;i++){
                                //     that.bannerImg[i] = that.bannerImg[i].replace(' ','')
                                // }
                                // i.researchResourcesMedia = JSON.parse(JSON.stringify(that.bannerImg))
                            })
                        }
                    });
                }
                if(that.detailList.length!=0||that.detailList.length!=undefined){
                    that.detailList.forEach((i)=>{
                        if(i.language=='ZH'){
                            that.$set(i,'languageIndex','common.Chinese')
                        }else{
                            that.$set(i,'languageIndex','common.English')
                        }
                    })
                }
                if(that.detailList.length!=0||that.detailList.length!=undefined){
                    for(let i=0;i<that.detailList.length;i++){
                        that.countryList.forEach((o)=>{
                            if(that.detailList[i].continent==o.value){
                                for(let j=0;j<o.data.length;j++){
                                    if(that.detailList[i].country==o.data[j].value){
                                            that.detailList[i].country=o.data[j].label;
                                    }
                                }
                            }
                        })
                    }
                }
            },
            beforeClose(done){
                this.detailList = []
                this.detailDialog=false
                done()
            },
            //查看申请dialog
            toApplyDialog(ele){
                const that = this;
                that.applyDataOld = ''
                that.applyData = ele;
                this.applyDialog = true;
                let params = {
                    baseEntityName:'',
                    baseEntityId:ele.entityId,
                }
                if(ele.reserveOne==0){
                    params.baseEntityName = ''
                }else{
                    params.baseEntityName = 'baseResearchResources'
                }
                getReleaseStatus(params).then((res)=>{
                    console.log(res.data,'res.data.baseApprovalMessages')
                    that.applyDataOld = res.data.baseApprovalMessages;
                    that.applyDataOld.forEach((i)=>{
                        i.commitDate = i.commitDate ? formatDate(i.commitDate, "YYYY-MM-DD") : "";
                    })

                })
            },
            
            //申请列表dialog
            toApplyListDialogChange(ele,index){
                this.searchFrom = {
                    affiliatedUnitName: '',
                    contactsNumber: '',
                }
                this.toApplyListDialog(ele)
            },
            //申请列表dialog数据
            toApplyListDialog(ele,index){
                this.applyListDialog = true;
                const that = this;
                that.tableList = [];
                that.listtotalPage = 0;
                that.entityId = ele;
                let param = {
                    researchResourcesEntityId:ele.entityId,
                    pageNo:that.listcurrentPage,
                    pageSize:10,
                    affiliatedUnitName:that.searchFrom.affiliatedUnitName,
                    contactsNumber:that.searchFrom.contactsNumber,
                };
                getBaseResearchApplications(param).then((resulet) => {
                    let data = resulet.data;
                    if (data.baseResearchApplications) {
                        that.tableList = data.baseResearchApplications;
                        that.tableList.forEach((i)=>{
                            i.createDate = i.createDate ? formatDate(i.createDate, "YYYY-MM-DD") : "";
                            i.startDateOfVisitors = i.startDateOfVisitors ? formatDate(i.startDateOfVisitors, "YYYY-MM-DD") : "";
                            i.endDateOfVisitors = i.endDateOfVisitors ? formatDate(i.endDateOfVisitors, "YYYY-MM-DD") : "";
                        })
                        this.listtotalPage = resulet.data.page.totalPage;
                    }
                });
            },
            //跳转详情
            toDetail(){

            },
            toView(router,json){
                this.$router.push({name:router,params:{key:json}})
            },
        }
    }
</script>
<style scoped>
    .threeLine {
        overflow: hidden ;
        text-overflow: ellipsis ;
        display: -webkit-box ;
        -webkit-line-clamp: 3 ;
        -webkit-box-orient: vertical ;
    }
    .oneLine{
        /* 隐藏溢出元素 */
        overflow: hidden;
        /* 单行显示 */
        white-space: nowrap;
        /* 溢出显示省略号 */
        text-overflow: ellipsis;
    }
</style>
<style>
    .tableSearch  .el-input__inner{
        height: 40px;
    }
    .detailDialog .el-input__inner{
        height: 40px;
    }
    .detailDialog .formStyle .el-input__inner{
         border: none;
         background-color: white;
         color: #606266;
         cursor: text;
     }
    .detailDialog .formStyle .inputTextarea .el-textarea__inner{
        border: none;
        background-color: white;
        color: #606266;
        cursor: text;
    }
    .detailDialog .formStyle .inputFile .el-input__inner{
        color: #1890FF;
    }
    .applyDialog .old{
        position: absolute;
        top: 131px;
        width: 60px;
        height: 20px;
        background-color: white;
        display: block;
    }
    .applyListDialog .search .el-input-group{
        width: 70%;
    }
</style>