<template>
  <div>
    <div class="autoBox box">
      <div style="margin-left: 20px">
        <el-breadcrumb separator="/">
          <el-breadcrumb-item :to="{ path: 'home' }">{{
            $t("common.Home")
          }}</el-breadcrumb-item>
          <el-breadcrumb-item :to="{ path: 'cooperationExchange' }">
            {{ $t("common.Cooperation&Communication") }}
          </el-breadcrumb-item>
          <el-breadcrumb-item>{{
            $t("common.ActivitiesInfo")
          }}</el-breadcrumb-item>
        </el-breadcrumb>
      </div>
      <div
        style="margin-top: 10px; width: 100%; height: 260px; margin-left: 20px"
      >
        <div style="float: left; width: 55%; height: 100%">
          <img
            :src="
              'api/file/pub/' + countryList.activityLogo + '?custom=600_260'
            "
            alt=""
            style="width: 100%; height: 260px"
            v-if="countryList.activityLogo"
          />
          <img
            :src="'api/file/pub/'"
            alt=""
            style="width: 100%; height: 260px"
            v-if="!countryList.activityLogo"
          />
        </div>
        <div style="float: left; width: 42%; height: 100%; position: relative">
          <!-- <span style="position: absolute;top: 0;right: 0;font-size: 14px;
                    color: #0000ff;cursor: pointer;">分享</span> -->
          <div style="margin-top: 20px; width: 100%">
            <div
              style="
                line-height: 25px;
                text-align: left;
                margin-left: 50px;
                font-weight: 700;
              "
            >
              {{ countryList.activityName }}
              <el-tag type="success">{{
                $i18n.locale == "zh"
                  ? countryList.activityStatus
                  : activityStatusMap.get(countryList.activityStatus)
              }}</el-tag>
            </div>
            <div style="width: 100%; line-height: 45px; font-size: 14px">
              <span style="margin-left: 50px; margin-right: 15px"
                >{{ $t("common.place") }}：{{ countryList.activityCity }}
              </span>
              <span
                >{{ $t("common.line") }}：{{
                  formatDate(countryList.activityStartTime)
                }}
              </span>
              <!-- <el-button type="" style="margin-left: 10px;margin-top: 10px;height: 40px;width: 170px;" icon="el-icon-star-off" :style="ifcommon?'color: #66b1ff;':''" @click="follow()">
                                    {{ifcommon?$t('common.Concerned'):$t('common.follow')}}
                            </el-button> -->
              <!-- <span  style="margin-left: 10px;margin-top: 10px;height: 40px;width: 170px;" :style="ifcommon?'color: #66b1ff;':''" @click="follow()">
                                    ifcommon? <svg t="1602568727676" class="icon" viewBox="0 0 1092 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1935" width="16" height="16"><path d="M1080.270639 453.733718c-77.161903 88.184889-214.58473 234.425705-214.58473 234.425705s22.045972 160.203798 35.273956 269.70066c5.878993 55.85193-37.478953 80.101899-85.980892 58.054927-92.594883-43.357945-233.690706-110.96686-265.290665-126.399841-32.334959 14.697981-174.165781 81.571897-267.495663 124.928843-49.236938 21.310973-92.594883-2.204997-87.45089-58.054927 12.492984-109.496862 35.273956-268.965661 35.273955-268.965661S91.123885 541.917607 13.227983 453.732718c-27.924965-32.334959-9.551988-77.896902 44.827944-85.980891 111.701859-19.841975 284.397642-51.441935 284.397642-51.441935s94.798881-163.143794 154.324805-263.086669C529.848333-7.7717 552.629304-0.422709 556.304299 1.047289c10.287987 2.939996 26.455967 15.431981 47.032941 52.175934 58.789926 99.943874 152.119808 263.087669 152.119808 263.087669s170.491785 31.60096 280.723647 51.441935c53.645932 8.08399 71.28291 54.380931 44.092944 85.980891z" fill="#1296db" p-id="1936"></path></svg>
                                   :<svg t="1602568727676" class="icon" viewBox="0 0 1092 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1935" width="16" height="16"><path d="M1080.270639 453.733718c-77.161903 88.184889-214.58473 234.425705-214.58473 234.425705s22.045972 160.203798 35.273956 269.70066c5.878993 55.85193-37.478953 80.101899-85.980892 58.054927-92.594883-43.357945-233.690706-110.96686-265.290665-126.399841-32.334959 14.697981-174.165781 81.571897-267.495663 124.928843-49.236938 21.310973-92.594883-2.204997-87.45089-58.054927 12.492984-109.496862 35.273956-268.965661 35.273955-268.965661S91.123885 541.917607 13.227983 453.732718c-27.924965-32.334959-9.551988-77.896902 44.827944-85.980891 111.701859-19.841975 284.397642-51.441935 284.397642-51.441935s94.798881-163.143794 154.324805-263.086669C529.848333-7.7717 552.629304-0.422709 556.304299 1.047289c10.287987 2.939996 26.455967 15.431981 47.032941 52.175934 58.789926 99.943874 152.119808 263.087669 152.119808 263.087669s170.491785 31.60096 280.723647 51.441935c53.645932 8.08399 71.28291 54.380931 44.092944 85.980891z" fill="#8a8a8a" p-id="1936"></path></svg>

                                   {{ifcommon?:$t('common.follow')}}
                            </span> -->
              <span
                v-if="ifcommon"
                @click="follow()"
                style="margin-left: 30px; color: #66b1ff; cursor: pointer"
              >
                <i class="el-icon-star-off"></i>
                {{ $t("common.Concerned") }}
              </span>
              <span
                v-else
                @click="follow()"
                style="margin-left: 30px; cursor: pointer"
              >
                <i class="el-icon-star-off"></i>
                {{ $t("common.follow") }}
              </span>

              <div
                style="
                  width: 80%;
                  font-size: 14px;
                  height: 75px;
                  -webkit-box-orient: vertical;
                  position: relative;
                  line-height: 1.4em;
                  overflow: hidden;
                  height: 3.6em;
                  color: #666666;
                  margin-left: 50px;
                  line-height: 25px;
                  margin-top: -10px;
                "
                class="plateCountry"
              >
                {{ countryList.activityIntroduce }}
              </div>
              <div
                style="
                  width: 80%;
                  font-size: 14px;
                  height: 40px;
                  margin-left: 50px;
                  margin-top: 20px;
                "
                v-if="this.activityApplyCount != 0"
              >
                {{ $t("common.Existing") }} {{ this.activityApplyCount }}
                {{ $t("common.UnitRegistration") }}
              </div>
              <div
                style="
                  font-size: 14px;
                  height: 40px;
                  text-align: center;
                  margin-top: 20px;
                "
                v-if="
                  $i18n.locale == 'zh' &&
                  countryList.activityStatus == '报名中' &&
                  countryList.registtrationFlag == 'y'
                "
              >
                <el-button
                  :type="
                    countryList.activityStatus == '未开始'
                      ? 'success'
                      : countryList.activityStatus == '报名中'
                      ? 'primary'
                      : countryList.activityStatus == '已结束'
                      ? 'info'
                      : 'warning'
                  "
                  round
                  style="width: 76px; height: 24px; line-height: 4px"
                  @click="signUp"
                >
                  报名
                </el-button>
              </div>
              <div
                style="
                  font-size: 14px;
                  height: 40px;
                  text-align: center;
                  margin-top: 0px;
                "
                v-if="
                  $i18n.locale == 'en' &&
                  countryList.activityStatus == '报名中' &&
                  countryList.registtrationFlag == 'y'
                "
              >
                <el-button
                  :type="
                    countryList.activityStatus == '未开始'
                      ? 'success'
                      : countryList.activityStatus == '报名中'
                      ? 'primary'
                      : countryList.activityStatus == '已结束'
                      ? 'info'
                      : 'warning'
                  "
                  round
                  style="width: 196px; height: 34px; line-height: 4px"
                  @click="signUp"
                >
                  {{ activityStatusMap.get(countryList.activityStatus) }}
                </el-button>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div
        style="width: 100%; height: 25px; margin-top: 20px; margin-left: 20px"
      >
        <div>
          <span
            v-for="(item, index) in screen"
            :class="i == index ? 'screen2 cursor' : 'screen1 cursor'"
            @click="screens(item, index)"
            >{{ $t(item.lable) }}</span
          >
        </div>
      </div>
      <div>
        <!-- 活动介绍 -->
        <CooperationActiveIntroduce
          style="min-height: 200px"
          :activityIntroduction="countryList.activityIntroduction"
          v-if="i == 0"
        >
        </CooperationActiveIntroduce>
        <!-- 活动议程 -->
        <CooperationActiveAgenda
          style="min-height: 200px"
          :programOutline="countryList.programOutline"
          v-if="i == 1"
        >
        </CooperationActiveAgenda>
        <!-- 活动回顾 -->
        <CooperationActiveReview
          style="min-height: 200px"
          :activityReview="countryList.activityReview"
          :id="countryList.baseActivityEntityId"
          :countryList="countryList"
          v-if="i == 2"
        >
        </CooperationActiveReview>
        <!-- 活动成果 -->
        <CooperationActiceResults
          style="min-height: 200px"
          :activityReview="countryList.activityReview"
          :id="countryList.id"
          v-if="i == 3"
        >
        </CooperationActiceResults>
      </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>
    <el-dialog
      :title="$t('common.ActivityRegistration')"
      :visible.sync="centerDialogVisible"
      width="50%"
    >
      <el-form
        :rules="rules"
        ref="formLabelAlign"
        :model="formLabelAlign"
        class="demo-ruleForm"
        v-show="$i18n.locale == 'zh'"
        label-width="200px"
        style="width: 700px; margin: auto; margin-top: -20px"
      >
        <el-form-item
          :label="$t('common.ActivityName')"
          style="font-weight: 600; color: rgb(153, 153, 153) !important"
        >
          <span style="line-height: 50px">{{ countryList.activityName }}</span>
        </el-form-item>

        <el-form-item label="姓名" class="el-label">
          <el-input
            class="el-input"
            v-model="formLabelAlign.name"

            :placeholder="$t('common.NameTips')"
          ></el-input>
        </el-form-item>
        <el-form-item
          :label="$t('common.NameoftheEntity')"
          class="el-label"
          prop="unitName"
        >
          <el-select
            popper-class="mySelect"
            style="width: 400px"
            v-model="formLabelAlign.unitName"
            filterable
            :placeholder="$t('common.NameEntityTips')"
            @blur="selectBlur"
          >
            <el-option
              v-for="item in projectList"
              :key="item.baseEntityId"
              :label="item.unitName"
              :value="item.baseEntityId"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item
          :label="$t('common.Position')"
          class="el-label"
          prop="post"
        >
          <el-input
            class="el-input"
            v-model="formLabelAlign.post"
            :placeholder="$t('common.PositionTips')"
          ></el-input>
        </el-form-item>

        <el-form-item
          style="position: relative"
          :label="$t('common.ContactPhoneNumber')"
          prop="contactNumber"
          class="dcp_input"
        >
          <GlobalRoaming
            ref="GlobalRoaming"
            :size="{ width: '398px' }"
            v-model="formLabelAlign.contactNumber"
            @getAreaCode="getPassAreaCode"
          ></GlobalRoaming>
        </el-form-item>

        <el-form-item
          :label="$t('common.Email')"
          class="el-label"
          prop="mailbox"
        >
          <el-input
            class="el-input"
            v-model="formLabelAlign.mailbox"
            :placeholder="$t('common.EmailTips')"
          ></el-input>
        </el-form-item>
      </el-form>
      <el-form
        :rules="rules"
        ref="formLabelAlign"
        :model="formLabelAlign"
        class="demo-ruleForm"
        v-show="$i18n.locale == 'en'"
        label-width="200px"
        style="width: 700px; margin: auto; margin-top: -20px"
      >
        <el-form-item
          :label="$t('common.ActivityName')"
          style="font-weight: 600; color: rgb(153, 153, 153) !important"
        >
          <span style="line-height: 50px">{{ countryList.activityName }}</span>
        </el-form-item>
        <el-form-item
          label="Country"
          class="el-label"
          prop="unitCountry"
          v-if="$i18n.locale !== 'zh'"
        >
          <el-select
            class="el-select"
            filterable
            v-model="formLabelAlign.unitCountry"
            :placeholder="$t('common.CountryTips')"
            style="width: 400px"
          >
            <el-option
              :label="item.label"
              :value="item.value"
              v-for="(item, index) in countrydate"
            ></el-option>
          </el-select>
        </el-form-item>

        <el-form-item
          label="Region"
          class="el-label"
          prop="Region"
          v-if="$i18n.locale == 'en'"
        >
          <el-select
            class="el-select"
            filterable
            v-model="formLabelAlign.Region"
            :placeholder="$t('common.RegionTips')"
            style="width: 400px"
          >
            <el-option
              :label="item.label"
              :value="item.label"
              v-for="(item, index) in Regiondate"
            ></el-option>
          </el-select>
          <!-- <el-input class="el-input" v-model="formLabelAlign.Region" :placeholder="$t('common.RegionTips')"></el-input> -->
        </el-form-item>
        <el-form-item
          label="Title"
          class="el-label"
          prop="Title"
          v-if="$i18n.locale == 'en'"
        >
          <!-- <el-input class="el-input" v-model="formLabelAlign.Title"></el-input> -->
          <el-select
            class="el-select"
            filterable
            v-model="formLabelAlign.Title"
            :placeholder="$t('common.TitleTips')"
            style="width: 400px"
          >
            <el-option
              :label="item.label"
              :value="item.value"
              v-for="(item, index) in titleList"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item
          label="First(given) Name(s)"
          class="el-label"
          prop="FirstName"
          v-if="$i18n.locale == 'en'"
        >
          <el-input
            class="el-input"
            v-model="formLabelAlign.FirstName"
            :placeholder="$t('common.FirstNameTips')"
          ></el-input>
        </el-form-item>
        <el-form-item
          label="Last Name"
          class="el-label"
          prop="LastName"
          v-if="$i18n.locale == 'en'"
        >
          <el-input
            class="el-input"
            v-model="formLabelAlign.LastName"
            :placeholder="$t('common.LastNameTips')"
          ></el-input>
        </el-form-item>

        <el-form-item
          :label="$t('common.NameoftheEntity')"
          class="el-label"
          prop="unitName"
        >
          <el-select
            :no-match-text="$i18n.locale == 'zh' ? '无匹配数据' : 'No Data'"
            popper-class="mySelect"
            style="width: 400px"
            v-model="formLabelAlign.unitName"
            filterable
            :placeholder="$t('common.NameEntityTips')"
            @blur="selectBlur"
          >
            <el-option
              v-for="item in projectList"
              :key="item.baseEntityId"
              :label="item.unitName"
              :value="item.baseEntityId"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item
          :label="$t('common.Position')"
          class="el-label"
          prop="post"
        >
          <el-input
            class="el-input"
            v-model="formLabelAlign.post"
            :placeholder="$t('common.PositionTips')"
          ></el-input>
        </el-form-item>

        <el-form-item
          style="position: relative"
          :label="$t('common.ContactPhoneNumber')"
          prop="contactNumber"
          class="dcp_input"
        >
          <GlobalRoaming
            ref="GlobalRoaming"
            :size="{ width: '398px' }"
            v-model="formLabelAlign.contactNumber"
            @getAreaCode="getPassAreaCode"
          ></GlobalRoaming>
        </el-form-item>

        <el-form-item
          :label="$t('common.Email')"
          class="el-label"
          prop="mailbox"
        >
          <el-input
            class="el-input"
            v-model="formLabelAlign.mailbox"
            :placeholder="$t('common.EmailTips')"
          ></el-input>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="centerDialogVisible = false">{{
          $t("common.Cancel")
        }}</el-button>
        <el-button type="primary" @click="save()">{{
          $t("common.Confirm")
        }}</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
import { getList } from "@/api/country";
import CooperationActiveIntroduce from "./CooperationActiveIntroduce"; // 活动介绍
import CooperationActiveAgenda from "./CooperationActiveAgenda"; // 活动议程
import CooperationActiveReview from "./CooperationActiveReview"; // 活动回顾
import CooperationActiceResults from "./CooperationActiceResults"; // 活动成果
import { countryNationalSpace } from "@/api/cooperation/baseCooperationUnit";
import GlobalRoaming from "@/components/GlobalRoaming";
import {
  saveActivityOrUpdate,
  getApproverId,
} from "@/api/meeting/meetingApply";
import { sysAttachmentInfos } from "@/api/cooperation/baseCooperationUnit";
import { getToken } from "@/utils/auth";
import { saveFollowModel } from "@/api/operation/basePortalModelFollowInfo";
import { getFollowModeNumlByModelIdAndUserId } from "@/api/operation/basePortalModelFollowInfo";
import { getDicts } from "@/api/dict";
import { addIntegral, addGrowth } from "@/utils/toCompleteTask";
import Base from "@/views/base/Base";
export default {
  name: "CooperationExchangeListDetails",
  extends: Base,
  components: {
    CooperationActiveIntroduce,
    CooperationActiveAgenda,
    CooperationActiveReview,
    CooperationActiceResults,
    GlobalRoaming,
  },
  data() {
    return {
      index: 1,
      projectList: [],
      i: "0",
      id: this.$route.query.key,
      language: "",
      //流程改造4
      processKey: "MEETING_APPROVE",
      approverId: "",
      centerDialogVisible: false,
      select: "0086",
      countryList: {},
      countrydate: [], //国家数据
      Regiondate: [],
      titleList: [
        {
          value: "Mr.",
          lable: "Mr.",
        },
        {
          value: "Ms.",
          lable: "Ms.",
        },
        {
          value: "Dr.",
          lable: "Dr.",
        },
        {
          value: "Prof.",
          lable: "Prof.",
        },
      ],
      activityStatusMap: new Map(),
      screen: [
        // {
        //     value: '1',
        //     lable: 'common.ActivityIntroduction'
        // }, {
        //     value: '1',
        //     lable: 'common.ActivityAgenda'
        // }, {
        //     value: '1',
        //     lable: 'common.ActivityReview'
        // }
        // ,{
        //     value:'1',
        //     lable:'common.ActivityResults'
        // }
      ],
      formLabelAlign: {
        id: null,
        name: "",
        unitName: "",
        ifName: null,
        post: "",
        contactNumber: "",
        mailbox: "",
        FirstName: "",
        LastName: "",
        unitCountry: "",
        Title: "",
        Region: "",
        auditStatusDict: "",
        language: "",
        selectCode: "",
        invitationCode: "", //邀请码
        meetingId: "", //会议id
      },

      activityApplyCount: "",
      dialogVisible: false,
      toViewLogin: false,
      num: 5,
      ifcommon: false,
      user: {
        umsUser: {},
      },
    };
  },
  //流程改造5
  props: {
    firstTaskConfig: {
      type: Object,
      default: () => {
        return {
          approver: "mutil",
          group: "",
          duty: "",
        };
      },
    },
  },
  watch: {
    "$i18n.locale"() {
      this.getBaseList(); // 获取企业报名信息
      this.getInitData();
    },
    toViewLogin() {
      if (this.toViewLogin == true) {
        this.loginTipsChange();
      }
    },
  },
  destroyed() {
    this.centerDialogVisible = false;
  },
  computed: {
    rules() {
      return {
        // name: [
        //     {required: true, message: '请输入姓名', trigger: 'blur'},
        // ],
        Country: [
          {
            required: true,
            message: "Please enter Country",
            trigger: "change",
          },
        ],
        unitName: [
          {
            required: true,
            message:
              this.$i18n.locale == "zh"
                ? "请输入单位名称"
                : "Please enter the unit name",
            trigger: "change",
          },
        ],
        unitNameEn: [
          {
            required: true,
            message: "Please enter the unit name",
            trigger: "blur",
          },
        ],
        Region: [
          { required: true, message: "Please select an area", trigger: "blur" },
        ],
        Title: [
          { required: true, message: "Please choose a title", trigger: "blur" },
        ],
        unitCountry: [
          {
            required: true,
            message: "Please enter the name of the country",
            trigger: "change",
          },
        ],
        FirstName: [
          {
            required: true,
            message: "Please enter First(given) Name(s)",
            trigger: "blur",
          },
        ],
        LastName: [
          {
            required: true,
            message: "Please enter Last Name",
            trigger: "blur",
          },
        ],
        post: [
          {
            required: true,
            message:
              this.$i18n.locale == "zh"
                ? "请输入职务"
                : "Please enter job title",
            trigger: "blur",
          },
        ],
        postEn: [
          {
            required: true,
            message: "Please enter job title",
            trigger: "blur",
          },
        ],
        contactNumber: [
          {
            required: true,
            message:
              this.$i18n.locale == "zh"
                ? "请输入联系电话"
                : "Please enter cellphone number",
            trigger: "blur",
          },
          {
            pattern: /^0{0,1}(13[0-9]|15[7-9]|153|151|156|18[1-9])[0-9]{8}$/,
            message:
              this.$i18n.locale == "zh"
                ? "联系电话格式不正确，请重新输入"
                : "Contact number format is incorrect, please re-enter",
            trigger: "blur",
          },
        ],
        // contactNumberEn:[
        //     {required: true, message:, trigger: 'blur'},
        //     {
        //         pattern: /^0{0,1}(13[0-9]|15[7-9]|153|156|18[7-9])[0-9]{8}$/,
        //         message: 'Contact number format is incorrect, please re-enter',
        //         trigger: 'blur'
        //     }
        // ],
        // mailboxEn: [
        //     {required: true, message: 'Please enter email address', trigger: 'blur'},
        //     {
        //         pattern: /^[a-zA-Z0-9]+([-_.][a-zA-Z0-9]+)*@[a-zA-Z0-9]+([-_.][a-zA-Z0-9]+)*\.[a-z]{2,}$/,
        //         message: 'Email format is incorrect, please re-enter',
        //         trigger: 'blur,change'
        //     }
        // ],
        mailbox: [
          {
            required: true,
            message:
              this.$i18n.locale == "zh"
                ? "请输入邮箱"
                : "Please enter email address",
            trigger: "blur",
          },
          {
            pattern:
              /^[a-zA-Z0-9]+([-_.][a-zA-Z0-9]+)*@[a-zA-Z0-9]+([-_.][a-zA-Z0-9]+)*\.[a-z]{2,}$/,
            message:
              this.$i18n.locale == "zh"
                ? "邮箱格式不正确，请重新输入"
                : "Email format is incorrect, please re-enter",
            trigger: "blur",
          },
        ],
      };
    },
  },
  mounted() {
    let language = this.$route.query.language;
    window.localStorage.setItem("locale", language);
    this.getBaseList(); // 获取企业报名信息
    this.getInitData();
    this.initData();

    //this.getList();
  },
  methods: {
    initData() {
      this.user = JSON.parse(window.localStorage.getItem("user"));
    },
    selectBlur(e) {
      this.formLabelAlign.unitName = "";
      if (e.target.value) {
        // 不在表单的时候不需要判断，也不需要isname字段
        // 输入内容不在下拉框中时，formLabelAlign.unitName=e.target.value，数据传输为unitName，有内容时，添加字段unitID
        this.formLabelAlign.unitName = e.target.value;
        this.formLabelAlign.ifName = "false";
      } else {
        this.formLabelAlign.ifName = "true";
      }
    },
    follow() {
      if (this.ifcommon) {
        this.followActivitie("unfollow");
      } else {
        this.followActivitie("follow");
      }
    },
    followActivitie(followType) {
      let user = window.localStorage.getItem("user");
      if (!this.$Cookies.get("token")) {
        // this.$message.warning("请先登录");
        // this.$confirm('检测到您未登录，是否登录')
        // .then(_ => {
        //  this.toView('login');
        // })
        // .catch(_ => {});
        this.toViewLogin = true;
      } else {
        var users = JSON.parse(user);
        var token = "" + getToken();
        var projectId = this.countryList.baseActivityEntityId;
        var userId = users.userId;
        // 接口逻辑
        this.submitHandler((token) => {
          saveFollowModel(projectId, "activity", userId, followType, token)
            .then((result) => {
              // console.log(result);
              this.$message({
                message: result.data,
                type: "success",
              });
              this.ifcommon = !this.ifcommon;
              this.resetToken();
            })
            .catch((error) => {
              // 此处你的业务代码
            });
        });
      }
    },
    // 未登录跳转
    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);
    },
    getPassAreaCode(code) {
      this.select = code;
      this.formLabelAlign.selectCode = code;
    },
    getInitData() {
      const that = this;
      var users = localStorage.getItem("user");
      var user = JSON.parse(users);
      if (user != null) {
        this.formLabelAlign.name = user.realName;
      }
      this.language = this.$i18n.locale.toUpperCase();
      countryNationalSpace({
        baseActivityEntityId: this.id,
        language: this.language,
      }).then((res) => {
        console.log(
          res,
          "----------------------报名单位---------------------------"
        );
        this.formLabelAlign.meetingId = res.data.meetingId;
        this.meetingId = res.data.meetingId;
        if (res.data.activityInfos != undefined) {
          that.countryList = res.data.activityInfos[0]
            ? res.data.activityInfos[0]
            : {};
          that.activityApplyCount = res.data.activityApplyCount;
          that.formLabelAlign.invitationCode = that.countryList.activityQrCode;
          that.formLabelAlign.meetingId = res.data.meetingId;
          if (users) {
            var token = "" + getToken();
            var projectId = this.countryList.baseActivityEntityId;
            this.userId = user.userId;
            getFollowModeNumlByModelIdAndUserId(
              projectId,
              "activity",
              this.userId
            ).then((res) => {
              this.ifcommon = res.data;
            });
          }
        } else {
          that.countryList = {};
          that.$message({
            message: "无当前版本",
            type: "error",
          });
        }
        let list = {
          attachmentBusinessId: this.countryList.id,
          attachmentBusinessType: "activityInfo",
        };
        sysAttachmentInfos(list).then((res) => {
          if ("3" == this.countryList.activityStatusDict) {
            if (JSON.stringify(res.data) == "{}") {
              this.screen = [
                {
                  value: "1",
                  lable: "common.ActivityIntroduction",
                },
                {
                  value: "1",
                  lable: "common.ActivityAgenda",
                },
                {
                  value: "1",
                  lable: "common.ActivityReview",
                },
              ];
            } else {
              this.screen = [
                {
                  value: "1",
                  lable: "common.ActivityIntroduction",
                },
                {
                  value: "1",
                  lable: "common.ActivityAgenda",
                },
                {
                  value: "1",
                  lable: "common.ActivityReview",
                },
                {
                  value: "1",
                  lable: "common.ActivityResults",
                },
              ];
            }
          } else {
            this.screen = [
              {
                value: "1",
                lable: "common.ActivityIntroduction",
              },
              {
                value: "1",
                lable: "common.ActivityAgenda",
              },
            ];
          }
        });
      });
      this.activityStatusMap.set("活动中", "In the activity");
      this.activityStatusMap.set("已结束", "Endeded");
      this.activityStatusMap.set("未开始", "To be started");
      this.activityStatusMap.set("报名中", "Signing Up");
    },
    getBaseList() {
      const that = this;
      getList({ language: this.$i18n.locale.toUpperCase() }).then((res) => {
        if (JSON.stringify(res.data) !== "{}") {
          that.projectList = res.data.baseUnitViews || [];
        }
      });
      getDicts("unit_country_dict_en,CONTINENT_CODE_DICT_EN").then((result) => {
        this.countrydate = result.data[0];
        this.Regiondate = result.data[1];
      });
    },
    // 报名弹窗
    signUp(num) {
      // 判断是否是报名结束
      let user = window.localStorage.getItem("user");
      if (!this.$Cookies.get("token")) {
        // this.$message.warning("请先登录");
        // this.$confirm('检测到您未登录，是否登录')
        // .then(_ => {
        //  this.toView('login');
        // })
        // .catch(_ => {});
        this.toViewLogin = true;
      } else {
        this.centerDialogVisible = true;
      }

      // if (this.countryList.registtrationFlag=='y') {
      //
      // } else {
      //     this.$message({
      //         message: '当前会员活动无法加入',
      //         type: 'warning'
      //     });
      // }
    },
    save: function () {
      //流程改造6
      this.formLabelAlign.language = this.language;
      this.formLabelAlign.auditStatusDict = "4";
      this.$refs["formLabelAlign"].validate((valid) => {
        if (valid) {
          if (this.user.umsUser.userUsertypeDict !== "2") {
            addIntegral("activity_registration_successful", "10");
            addGrowth("activity_registration_successful");
          }
          this.upData();
        } else {
          return false;
        }
      });
    },
    upData() {
      this.submitHandler((token) => {
        //流程改造7
        getApproverId(this.formLabelAlign.invitationCode).then((result) => {
          result = result.data;
          //let id = result[0].userId;
          var str = "";
          for (var i = 0; i < result.length; i++) {
            str += result[i].userId + ",";
          }
          if (str.length > 0) {
            str = str.substr(0, str.length - 1);
          }
          this.approverId = str;
          // 会员模块后期加的  可传空字符串
          let activityIds = this.countryList.baseActivityEntityId;
          saveActivityOrUpdate(
            JSON.stringify(this.formLabelAlign),
            this.approverId,
            this.taskComment,
            token,
            activityIds
          )
            .then((res) => {
              let type = "success";
              if (res.msg == "error") {
                res.msg =
                  this.$i18n.locale == "zh"
                    ? "您已报名成功，请勿重复报名。"
                    : "ou have signed up successfully, please do not repeat.";
                type = "warning";
              } else {
                res.msg =
                  this.$i18n.locale == "zh"
                    ? "报名成功"
                    : "Successful registration";
              }
              this.$message({
                message: res.msg,
                type: type,
              });
              this.resetToken();
              this.centerDialogVisible = false;
            })
            .catch((error) => {
              this.resetToken();
            });
        });
      });
    },
    getIconUrl(url) {
      return require("@/assets/img/cooperationExchange/" + url);
    },
    toView(router, json) {
      clearInterval(this.timer);
      this.$router.push({ name: router, params: { key: json } });
    },
    screenBack(data) {
      console.log(data, "screenBackscreenBackscreenBackscreenBack");
    },
    screens(item, index) {
      this.i = index;
    },
  },
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
.box {
  margin-top: 10px;
  background: #fff;
  padding-top: 20px;
  padding-bottom: 10px;
}

body {
  margin: 0;
}

.screen1 {
  padding: 10px 18px;
  font-size: 14px;
  background-color: #e8e8e8;
  color: #8fa0b4;
}

.screen2 {
  padding: 10px 18px;
  font-size: 14px;
  background-color: #12559c;
  color: #fff;
}

.Introduction {
  margin-top: 20px;
}

.Introduction li {
  float: left;
  width: 31%;
  height: 400px;
  margin-right: 22px;
  background: skyblue;
}

.el-button.is-round {
  padding: 0;
}

.el-input {
  width: 400px;
  /* line-height: 52px; */
}
.el-input >>> .el-input__inner {
  height: 50px;
  /* width: 200px; */
}
.el-select >>> .el-input__inner {
  height: 50px;
}
.el-form-item >>> .el-form-item__label {
  padding-top: 5px;
}
.dcp_input /deep/.el-input__inner {
  width: 150px;
}
.dcp_input /deep/.el-select {
  width: 150px;
}

.el-select-dropdown {
  width: 400px !important;
}
.plateCountry::after {
  bottom: 5px;
}
</style>
