<template>
  <div class="occupation-content">
    <div class="mian-title">{{ $t('home.college.program') }}</div>
    <div class="mian">
      <tab :data="tabList" :defaultActive="1" @tabChangeIndex="tabChangeIndex" />
      <div class="occupation-content-mian">
        <template v-if="showModule === 1">
          <div class="module-1 module-content-box">
            <img
              :src="
                isEn
                  ? 'https://webapp-pub.ezijing.com/www/pc/services/major/page1_01.png'
                  : 'https://webapp-pub.ezijing.com/www/pc/services/major/page1_01.png'
              "
              class="banner"
            />
            <div class="content-mian">
              <div class="module-title">{{isEn ? '培养目标' : '培养目标'}}</div>
              <p style="font-size:16px;line-height: 32px;color: #424242;margin:10px 0 30px;">聚焦金融科技人才复合型、创新型与国际化，通过学科交叉设置，打造全新课程体系，学生通过学习金融数字化，掌握量化金融、金融风险管理、大数据、机器学习、深度学习等领域技术核心原理方法及应用，深刻理解金融科技应用场景，具备数字化和智能化项目解决架构和实施管理能力，培养企业数字化转型和金融科技应用的中坚力量和具备国际竞争的金融科技应用创新型人才。</p>
              <div class="module-title">{{isEn ? '对应专业' : '对应专业'}}</div>
              <img
                :src="
                  isEn
                    ? 'https://webapp-pub.ezijing.com/www/pc/services/major/page1_02.png'
                    : 'https://webapp-pub.ezijing.com/www/pc/services/major/page1_02.png'
                "
                style="margin:15px 20px 25px;"
              />
              <div class="module-title">{{isEn ? '课程设置' : '课程设置'}}</div>
              <img
                :src="
                  isEn
                    ? 'https://webapp-pub.ezijing.com/www/pc/services/major/page1_03.png'
                    : 'https://webapp-pub.ezijing.com/www/pc/services/major/page1_03.png'
                "
                style="margin:15px 0 40px;"
              />
              <img
                :src="
                  isEn
                    ? 'https://webapp-pub.ezijing.com/www/pc/services/major/page1_04.png'
                    : 'https://webapp-pub.ezijing.com/www/pc/services/major/page1_04.png'
                "
              />
              <div class="module-title">{{isEn ? '就业岗位' : '就业岗位'}}</div>
              <img
                :src="
                  isEn
                    ? 'https://webapp-pub.ezijing.com/www/pc/services/major/page1_05.png'
                    : 'https://webapp-pub.ezijing.com/www/pc/services/major/page1_05.png'
                "
              />
            </div>
          </div>
        </template>
        <template v-if="showModule === 2">
          <div class="module-1 module-content-box">
            <img
              :src="
                isEn
                  ? 'https://webapp-pub.ezijing.com/www/pc/services/major/page2_01.png'
                  : 'https://webapp-pub.ezijing.com/www/pc/services/major/page2_01.png'
              "
              class="banner"
            />
            <div class="content-mian">
              <div class="module-title">{{isEn ? '培养目标' : '培养目标'}}</div>
              <!-- <div class="cart-txt">
                <div>
                  <h5>{{isEn ? '初级' : '初级'}}</h5>
                  <p class="bold">{{isEn ? '工具操作+业务执行' : '工具操作+业务执行'}}</p>
                  <p>{{isEn ? '客户管理能力' : '客户管理能力'}}</p>
                  <p>{{isEn ? '产品理解能力' : '产品理解能力'}}</p>
                  <p>{{isEn ? '营销专业知识能力' : '营销专业知识能力'}}</p>
                  <p>{{isEn ? '网络与新媒体传播能力' : '网络与新媒体传播能力'}}</p>
                </div>
                <div>
                  <h5>{{isEn ? '中级' : '中级'}}</h5>
                  <p class="bold">{{isEn ? '知识运用+任务统筹' : '知识运用+任务统筹'}}</p>
                  <p>{{isEn ? '方案策划能力' : '方案策划能力'}}</p>
                  <p>{{isEn ? '数字媒体操作能力' : '数字媒体操作能力'}}</p>
                  <p>{{isEn ? '投放管理能力' : '投放管理能力'}}</p>
                  <p>{{isEn ? '数据分析能力' : '数据分析能力 '}}</p>
                </div>
                <div>
                  <h5>{{isEn ? '高级' : '高级'}}</h5>
                  <p class="bold">{{isEn ? '策略制定+创新升级' : '策略制定+创新升级'}}</p>
                  <p>{{isEn ? '行业洞察能力' : '行业洞察能力'}}</p>
                  <p>{{isEn ? '跨行业整合能力' : '跨行业整合能力'}}</p>
                  <p>{{isEn ? '策略制定能力' : '策略制定能力'}}</p>
                  <p>{{isEn ? '创意思维能力' : '创意思维能力'}}</p>
                </div>
              </div> -->
              <img
                :src="
                  isEn
                    ? 'https://webapp-pub.ezijing.com/www/pc/services/major/page2_02.png'
                    : 'https://webapp-pub.ezijing.com/www/pc/services/major/page2_02.png'
                "
              />
              <img
                :src="
                  isEn
                    ? 'https://webapp-pub.ezijing.com/www/pc/services/major/page2_03.png'
                    : 'https://webapp-pub.ezijing.com/www/pc/services/major/page2_03.png'
                "
              />
              <img
                :src="
                  isEn
                    ? 'https://webapp-pub.ezijing.com/www/pc/services/major/page2_04.png'
                    : 'https://webapp-pub.ezijing.com/www/pc/services/major/page2_04.png'
                "
              />
              <img
                :src="
                  isEn
                    ? 'https://webapp-pub.ezijing.com/www/pc/services/major/page2_05.png'
                    : 'https://webapp-pub.ezijing.com/www/pc/services/major/page2_05.png'
                "
              />
              <div class="module-title">{{isEn ? '就业岗位' : '就业岗位'}}</div>
              <div class="module-sub-title" style="margin-bottom:20px;">
                <span>{{isEn ? '就业行业' : '就业行业'}}</span>
              </div>
              <ul class="cart-img">
                <li>
                  <img src="https://webapp-pub.ezijing.com/www/pc/services/major/page2_card_01.png" alt="" />
                  <div class="txt">
                    <div class="name">
                      {{
                        isEn ? '新型互联网行业' : '新型互联网行业'
                      }}
                    </div>
                  </div>
                </li>
                <li>
                  <img src="https://webapp-pub.ezijing.com/www/pc/services/major/page2_card_02.png" alt="" />
                  <div class="txt">
                    <div class="name">
                      {{
                        isEn ? '汽车行业' : '汽车行业'
                      }}
                    </div>
                  </div>
                </li>
                <li>
                  <img src="https://webapp-pub.ezijing.com/www/pc/services/major/page2_card_03.png" alt="" />
                  <div class="txt">
                    <div class="name">
                      {{
                        isEn ? '房地产行业' : '房地产行业'
                      }}
                    </div>
                  </div>
                </li>
                <li>
                  <img src="https://webapp-pub.ezijing.com/www/pc/services/major/page2_card_04.png" alt="" />
                  <div class="txt">
                    <div class="name">
                      {{
                        isEn ? '教育行业' : '教育行业'
                      }}
                    </div>
                  </div>
                </li>
                <li>
                  <img src="https://webapp-pub.ezijing.com/www/pc/services/major/page2_card_05.png" alt="" />
                  <div class="txt">
                    <div class="name">
                      {{
                        isEn ? '美妆行业' : '美妆行业'
                      }}
                    </div>
                  </div>
                </li>
                <li>
                  <img src="https://webapp-pub.ezijing.com/www/pc/services/major/page2_card_06.png" alt="" />
                  <div class="txt">
                    <div class="name">
                      {{
                        isEn ? '金融行业' : '金融行业'
                      }}
                    </div>
                  </div>
                </li>
                <li>
                  <img src="https://webapp-pub.ezijing.com/www/pc/services/major/page2_card_07.png" alt="" />
                  <div class="txt">
                    <div class="name">
                      {{
                        isEn ? '新媒体行业' : '新媒体行业'
                      }}
                    </div>
                  </div>
                </li>
                <li>
                  <img src="https://webapp-pub.ezijing.com/www/pc/services/major/page2_card_08.png" alt="" />
                  <div class="txt">
                    <div class="name">
                      {{
                        isEn ? '咨询服务行业' : '咨询服务行业'
                      }}
                    </div>
                  </div>
                </li>
                <li>
                  <img src="https://webapp-pub.ezijing.com/www/pc/services/major/page2_card_09.png" alt="" />
                </li>
              </ul>
              <div class="module-sub-title">
                <span>{{isEn ? '就业岗位' : '就业岗位'}}</span>
              </div>
              <div class="cart-txt">
                <div>
                  <h5>{{isEn ? '品牌及数字化营销' : '品牌及数字化营销'}}</h5>
                  <p>{{isEn ? '品牌管理经理' : '品牌管理经理'}}</p>
                  <p>{{isEn ? '品牌公关经理' : '品牌公关经理'}}</p>
                  <p>{{isEn ? '品牌投放经理' : '产品理解能力'}}</p>
                  <p>{{isEn ? '品牌传播策略经理' : '品牌传播策略经理'}}</p>
                  <p>{{isEn ? '数字营销平台项目经理' : '数字营销平台项目经理'}}</p>
                  <p>{{isEn ? '营销策划师' : '营销策划师'}}</p>
                </div>
                <div>
                  <h5>{{isEn ? '市场客户关系管理' : '市场客户关系管理'}}</h5>
                  <p>{{isEn ? '市场营销经理' : '市场营销经理'}}</p>
                  <p>{{isEn ? '新媒体营销经理' : '新媒体营销经理'}}</p>
                  <p>{{isEn ? '客户数据库管理员' : '客户数据库管理员'}}</p>
                  <p>{{isEn ? '客户体验设计师' : '客户体验设计师'}}</p>
                  <p>{{isEn ? '客户经理' : '客户经理 '}}</p>
                </div>
                <div>
                  <h5>{{isEn ? '视觉表现与制作' : '视觉表现与制作'}}</h5>
                  <p>{{isEn ? '摄影、摄像师' : '摄影、摄像师'}}</p>
                  <p>{{isEn ? '后期编辑工程师' : '后期编辑工程师'}}</p>
                  <p>{{isEn ? '交互设计与制作' : '交互设计与制作'}}</p>
                  <p>{{isEn ? '新媒体运营制作' : '新媒体运营制作'}}</p>
                  <p>{{isEn ? '短视频编导制作' : '短视频编导制作'}}</p>
                  <p>{{isEn ? '直播电商运营' : '直播电商运营'}}</p>
                </div>
              </div>
            </div>
          </div>
        </template>
        <template v-if="showModule === 3">
          <div class="module-1 module-content-box">
            <img
              :src="
                isEn
                  ? 'https://webapp-pub.ezijing.com/www/pc/services/major/page3_0.png'
                  : 'https://webapp-pub.ezijing.com/www/pc/services/major/page3_0.png'
              "
              class="banner"
            />
            <div class="content-mian">
              <div class="module-title">{{isEn ? '培养目标' : '培养目标'}}</div>
              <div style="color:#A81840;font-size:20px;margin-top:15px;">企业信息决策</div>
              <div class="cart-txt">
                <div>
                  <h5>{{isEn ? '理解企业数据' : '理解企业数据'}}</h5>
                  <p class="bold">{{isEn ? '基础知识培养' : '基础知识培养'}}</p>
                  <p>{{isEn ? '商业经济与运行管理知识' : '商业经济与运行管理知识'}}</p>
                  <p>{{isEn ? '数理统计等数学思维' : '数理统计等数学思维'}}</p>
                </div>
                <div>
                  <h5>{{isEn ? '发现业务问题' : '发现业务问题'}}</h5>
                  <p class="bold">{{isEn ? '大数据分析平台工具使用' : '大数据分析平台工具使用'}}</p>
                </div>
                <div>
                  <h5>{{isEn ? '开发预测模型' : '开发预测模型'}}</h5>
                  <p class="bold">{{isEn ? '核心技术方法培养' : '核心技术方法培养'}}</p>
                  <p>{{isEn ? '数据收集' : '数据收集'}}</p>
                  <p>{{isEn ? '数据处理' : '数据处理'}}</p>
                  <p>{{isEn ? '数据可视化' : '数据可视化'}}</p>
                  <p>{{isEn ? '预测建模' : '预测建模'}}</p>
                </div>
              </div>
              <img
                :src="
                  isEn
                    ? 'https://webapp-pub.ezijing.com/www/pc/services/major/page3_01.png'
                    : 'https://webapp-pub.ezijing.com/www/pc/services/major/page3_01.png'
                "
                style="margin-bottom:15px;"
              />
              <img
                :src="
                  isEn
                    ? 'https://webapp-pub.ezijing.com/www/pc/services/major/page3_02.png'
                    : 'https://webapp-pub.ezijing.com/www/pc/services/major/page3_02.png'
                "
              />
              <img
                :src="
                  isEn
                    ? 'https://webapp-pub.ezijing.com/www/pc/services/major/page3_03.png'
                    : 'https://webapp-pub.ezijing.com/www/pc/services/major/page3_03.png'
                "
              />
              <img
                :src="
                  isEn
                    ? 'https://webapp-pub.ezijing.com/www/pc/services/major/page3_04.png'
                    : 'https://webapp-pub.ezijing.com/www/pc/services/major/page3_04.png'
                "
              />
              <div class="module-title">{{isEn ? '就业岗位' : '就业岗位'}}</div>
              <div class="module-sub-title" style="margin-bottom:20px;">
                <span>{{isEn ? '就业行业' : '就业行业'}}</span>
              </div>
              <ul class="cart-img col-4" style="margin-bottom:48px;">
                <li>
                  <img src="https://webapp-pub.ezijing.com/www/pc/services/major/page3_card_01.png" alt="" />
                  <div class="txt">
                    <div class="name">
                      {{
                        isEn ? '新型互联网行业' : '新型互联网行业'
                      }}
                    </div>
                  </div>
                </li>
                <li>
                  <img src="https://webapp-pub.ezijing.com/www/pc/services/major/page3_card_02.png" alt="" />
                  <div class="txt">
                    <div class="name">
                      {{
                        isEn ? '能源行业' : '能源行业'
                      }}
                    </div>
                  </div>
                </li>
                <li>
                  <img src="https://webapp-pub.ezijing.com/www/pc/services/major/page3_card_03.png" alt="" />
                  <div class="txt">
                    <div class="name">
                      {{
                        isEn ? '制造行业' : '制造行业'
                      }}
                    </div>
                  </div>
                </li>
                <li>
                  <img src="https://webapp-pub.ezijing.com/www/pc/services/major/page3_card_04.png" alt="" />
                  <div class="txt">
                    <div class="name">
                      {{
                        isEn ? '医疗行业' : '医疗行业'
                      }}
                    </div>
                  </div>
                </li>
                <li>
                  <img src="https://webapp-pub.ezijing.com/www/pc/services/major/page3_card_05.png" alt="" />
                  <div class="txt">
                    <div class="name">
                      {{
                        isEn ? '快消零售行业' : '快消零售行业'
                      }}
                    </div>
                  </div>
                </li>
                <li>
                  <img src="https://webapp-pub.ezijing.com/www/pc/services/major/page3_card_06.png" alt="" />
                  <div class="txt">
                    <div class="name">
                      {{
                        isEn ? '咨询服务行业' : '咨询服务行业'
                      }}
                    </div>
                  </div>
                </li>
                <li>
                  <img src="https://webapp-pub.ezijing.com/www/pc/services/major/page3_card_07.png" alt="" />
                  <div class="txt">
                    <div class="name">
                      {{
                        isEn ? '金融行业' : '金融行业'
                      }}
                    </div>
                  </div>
                </li>
                <li>
                  <img src="https://webapp-pub.ezijing.com/www/pc/services/major/page3_card_08.png" alt="" />
                </li>
              </ul>
              <img
                :src="
                  isEn
                    ? 'https://webapp-pub.ezijing.com/www/pc/services/major/page3_05.png'
                    : 'https://webapp-pub.ezijing.com/www/pc/services/major/page3_05.png'
                "
              />
            </div>
          </div>
        </template>
        <template v-if="showModule === 4">
          <div class="module-1 module-content-box">
            <img
              :src="
                isEn
                  ? 'https://webapp-pub.ezijing.com/www/pc/services/major/page4_01.png'
                  : 'https://webapp-pub.ezijing.com/www/pc/services/major/page4_01.png'
              "
              class="banner"
            />
            <div class="content-mian">
              <img
                :src="
                  isEn
                    ? 'https://webapp-pub.ezijing.com/www/pc/services/major/page4_02.png'
                    : 'https://webapp-pub.ezijing.com/www/pc/services/major/page4_02.png'
                "
              />
              <img
                :src="
                  isEn
                    ? 'https://webapp-pub.ezijing.com/www/pc/services/major/page4_03.png'
                    : 'https://webapp-pub.ezijing.com/www/pc/services/major/page4_03.png'
                "
              />
              <img
                :src="
                  isEn
                    ? 'https://webapp-pub.ezijing.com/www/pc/services/major/page4_04.png'
                    : 'https://webapp-pub.ezijing.com/www/pc/services/major/page4_04.png'
                "
              />
            </div>
          </div>
        </template>
        <template v-if="showModule === 5">
          <div class="module-1 module-content-box">
            <img
              :src="
                isEn
                  ? 'https://webapp-pub.ezijing.com/www/pc/services/major/page5_01.png'
                  : 'https://webapp-pub.ezijing.com/www/pc/services/major/page5_01.png'
              "
              class="banner"
            />
            <div class="content-mian">
              <img
                :src="
                  isEn
                    ? 'https://webapp-pub.ezijing.com/www/pc/services/major/page5_02.png'
                    : 'https://webapp-pub.ezijing.com/www/pc/services/major/page5_02.png'
                "
              />
              <img
                :src="
                  isEn
                    ? 'https://webapp-pub.ezijing.com/www/pc/services/major/page5_03.png'
                    : 'https://webapp-pub.ezijing.com/www/pc/services/major/page5_03.png'
                "
              />
              <div class="module-title">{{isEn ? '就业岗位' : '就业岗位'}}</div>
              <p>就业方向和岗位：主要面向电子商务公司、传统企业数字化转型公司及企事业单位从事数字运营岗、数据管理岗</p>
              <div class="cart-txt">
                <div>
                  <h5>{{isEn ? '高级岗位' : '高级岗位'}}</h5>
                  <p>{{isEn ? '数字运营总监' : '数字运营总监'}}</p>
                  <p>{{isEn ? '数字运营数据专家' : '数字运营数据专家'}}</p>
                  <p>{{isEn ? '数字运营营销总监' : '数字运营营销总监'}}</p>
                  <p>{{isEn ? '数字运营项目总监' : '数字运营项目总监'}}</p>
                </div>
                <div>
                  <h5>{{isEn ? '中级岗位' : '中级岗位'}}</h5>
                  <p>{{isEn ? '数字运营经理' : '数字运营经理'}}</p>
                  <p>{{isEn ? '数字运营数据经理' : '数字运营数据经理'}}</p>
                  <p>{{isEn ? '数字运营营销经理' : '数字运营营销经理'}}</p>
                  <p>{{isEn ? '数字运营项目经理' : '数字运营项目经理'}}</p>
                </div>
                <div>
                  <h5>{{isEn ? '初级岗位' : '初级岗位'}}</h5>
                  <p>{{isEn ? '数字商家运营专员' : '数字商家运营专员'}}</p>
                  <p>{{isEn ? '数字用户运营专员' : '数字用户运营专员'}}</p>
                  <p>{{isEn ? '商务数据分析专员' : '商务数据分析专员'}}</p>
                  <p>{{isEn ? '数字营销专员' : '数字营销专员'}}</p>
                  <p>{{isEn ? '数字项目专员' : '数字项目专员'}}</p>
                </div>
              </div>
            </div>
          </div>
        </template>
        <template v-if="showModule === 6">
          <div class="module-6 module-content-box">
            <img
              :src="
                isEn
                  ? 'https://webapp-pub.ezijing.com/www/pc/services/major/page6_01.png'
                  : 'https://webapp-pub.ezijing.com/www/pc/services/major/page6_01.png'
              "
              class="banner"
            />
            <div class="content-mian">
              <img
                :src="
                  isEn
                    ? 'https://webapp-pub.ezijing.com/www/pc/services/major/page6_02.png'
                    : 'https://webapp-pub.ezijing.com/www/pc/services/major/page6_02.png'
                "
              />
              <div class="module-title">{{isEn ? '专业分类' : '专业分类'}}</div>
              <div class="tabs">
                <div :class="{item: true, active: module6TabActive === 0}" @click="module6TabActive = 0">
                  <img src="https://webapp-pub.ezijing.com/www/pc/services/major/page6_tab_icon1.png">
                  <p>人工智能方向</p>
                </div>
                <div :class="{item: true, active: module6TabActive === 1}"  @click="module6TabActive = 1">
                  <img src="https://webapp-pub.ezijing.com/www/pc/services/major/page6_tab_icon2.png">
                  <p>数据技术方向</p>
                </div>
                <div :class="{item: true, active: module6TabActive === 2}"  @click="module6TabActive = 2">
                  <img src="https://webapp-pub.ezijing.com/www/pc/services/major/page6_tab_icon3.png">
                  <p>云计算方向</p>
                </div>
                <div :class="{item: true, active: module6TabActive === 3}"  @click="module6TabActive = 3">
                  <img src="https://webapp-pub.ezijing.com/www/pc/services/major/page6_tab_icon4.png">
                  <p>网络安全方向</p>
                </div>
              </div>
              <div v-show="module6TabActive === 0">
                <img
                  :src="
                    isEn
                      ? 'https://webapp-pub.ezijing.com/www/pc/services/major/page6_tab1_01.png'
                      : 'https://webapp-pub.ezijing.com/www/pc/services/major/page6_tab1_01.png'
                  "
                  style="margin:15px 0 0"
                />
                <img
                  :src="
                    isEn
                      ? 'https://webapp-pub.ezijing.com/www/pc/services/major/page6_tab1_02.png'
                      : 'https://webapp-pub.ezijing.com/www/pc/services/major/page6_tab1_02.png'
                  "
                  style="margin:35px 0 0;width:890px;"
                />
              </div>
              <template v-if="module6TabActive === 1">
                <div class="img-text">
                  <img
                    :src="
                      isEn
                        ? 'https://webapp-pub.ezijing.com/www/pc/services/major/page6_tab2_01.png'
                        : 'https://webapp-pub.ezijing.com/www/pc/services/major/page6_tab2_01.png'
                    "
                    class="img3"
                  />
                  <div>
                    <h5>人才培养方向</h5>
                    <p>大数据技术生态系统解析，科技创新前沿实践<br>创新思维 + 应用场景 + 实践应用，多维度培养数据技术人才</p>
                  </div>
                </div>
                <div class="module-title" style="margin-top:30px;">{{isEn ? '就业行业' : '就业行业'}}</div>
                <div class="swiper-content">
                  <div v-swiper:mySwiper="swiperOption">
                    <div class="swiper-wrapper">
                      <div class="swiper-slide">
                        <img src="https://webapp-pub.ezijing.com/www/pc/services/job/occupation_swipe_01.png">
                        <p>
                          <img src="https://webapp-pub.ezijing.com/www/pc/services/major/page6_tab2_swiper_icon01.png">
                          <span>{{isEn ? '医学类' : '医学类'}}</span>
                        </p>
                      </div>
                      <div class="swiper-slide">
                        <img src="https://webapp-pub.ezijing.com/www/pc/services/job/occupation_swipe_02.png">
                        <p>
                          <img src="https://webapp-pub.ezijing.com/www/pc/services/major/page6_tab2_swiper_icon02.png">
                          <span>{{isEn ? '生物行业' : '生物行业'}}</span>
                        </p>
                      </div>
                      <div class="swiper-slide">
                        <img src="https://webapp-pub.ezijing.com/www/pc/services/job/occupation_swipe_03.png">
                        <p>
                          <img src="https://webapp-pub.ezijing.com/www/pc/services/major/page6_tab2_swiper_icon03.png">
                          <span>{{isEn ? '金融行业' : '金融行业'}}</span>
                        </p>
                      </div>
                      <div class="swiper-slide">
                        <img src="https://webapp-pub.ezijing.com/www/pc/services/job/occupation_swipe_04.png">
                        <p>
                          <img src="https://webapp-pub.ezijing.com/www/pc/services/major/page6_tab2_swiper_icon04.png">
                          <span>{{isEn ? '零售行业' : '零售行业'}}</span>
                        </p>
                      </div>
                      <div class="swiper-slide">
                        <img src="https://webapp-pub.ezijing.com/www/pc/services/job/occupation_swipe_01.png">
                        <p>
                          <img src="https://webapp-pub.ezijing.com/www/pc/services/major/page6_tab2_swiper_icon05.png">
                          <span>{{isEn ? '电商行业' : '电商行业'}}</span>
                        </p>
                      </div>
                      <div class="swiper-slide">
                        <img src="https://webapp-pub.ezijing.com/www/pc/services/job/occupation_swipe_02.png">
                        <p>
                          <img src="https://webapp-pub.ezijing.com/www/pc/services/major/page6_tab2_swiper_icon06.png">
                          <span>{{isEn ? '农牧行业' : '农牧行业'}}</span>
                        </p>
                      </div>
                      <div class="swiper-slide">
                        <img src="https://webapp-pub.ezijing.com/www/pc/services/job/occupation_swipe_03.png">
                        <p>
                          <img src="https://webapp-pub.ezijing.com/www/pc/services/major/page6_tab2_swiper_icon07.png">
                          <span>{{isEn ? '交通行业' : '交通行业'}}</span>
                        </p>
                      </div>
                      <div class="swiper-slide">
                        <img src="https://webapp-pub.ezijing.com/www/pc/services/job/occupation_swipe_04.png">
                        <p>
                          <img src="https://webapp-pub.ezijing.com/www/pc/services/major/page6_tab2_swiper_icon08.png">
                          <span>{{isEn ? '教育行业' : '教育行业'}}</span>
                        </p>
                      </div>
                      <div class="swiper-slide">
                        <img src="https://webapp-pub.ezijing.com/www/pc/services/job/occupation_swipe_01.png">
                        <p>
                          <img src="https://webapp-pub.ezijing.com/www/pc/services/major/page6_tab2_swiper_icon09.png">
                          <span>{{isEn ? '体育行业' : '体育行业'}}</span>
                        </p>
                      </div>
                      <div class="swiper-slide">
                        <img src="https://webapp-pub.ezijing.com/www/pc/services/job/occupation_swipe_02.png">
                        <p>
                          <img src="https://webapp-pub.ezijing.com/www/pc/services/major/page6_tab2_swiper_icon10.png">
                          <span>{{isEn ? '食品行业' : '食品行业'}}</span>
                        </p>
                      </div>
                      <div class="swiper-slide">
                        <img src="https://webapp-pub.ezijing.com/www/pc/services/job/occupation_swipe_03.png">
                        <p>
                          <img src="https://webapp-pub.ezijing.com/www/pc/services/major/page6_tab2_swiper_icon11.png">
                          <span>{{isEn ? '政府行业' : '政府行业'}}</span>
                        </p>
                      </div>
                    </div>
                  </div>
                  <div class="swiper-btn swiper-button-prev">
                    <img src="https://webapp-pub.ezijing.com/www/pc/swipe-prev-btn.png">
                  </div>
                  <div class="swiper-btn swiper-button-next">
                    <img src="https://webapp-pub.ezijing.com/www/pc/swipe-next-btn.png">
                  </div>
                </div>
                <div class="module-title" style="margin-top:30px;">{{isEn ? '广泛需求岗位' : '广泛需求岗位'}}</div>
                <img
                :src="
                  isEn
                    ? 'https://webapp-pub.ezijing.com/www/pc/services/major/page6_tab2_02.png'
                    : 'https://webapp-pub.ezijing.com/www/pc/services/major/page6_tab2_02.png'
                "
              />
              </template>
              <template v-if="module6TabActive === 2">
                <div class="img-text">
                  <img
                    :src="
                      isEn
                        ? 'https://webapp-pub.ezijing.com/www/pc/services/major/page6_tab3_01.png'
                        : 'https://webapp-pub.ezijing.com/www/pc/services/major/page6_tab3_01.png'
                    "
                  />
                  <div>
                    <h5>人才培养方向</h5>
                    <p>复合 + 创新 + 可持续发展<br>赋能未来，夯实云计算人才培养</p>
                  </div>
                </div>
                <div class="module-title" style="margin-top:30px;">{{isEn ? '就业行业' : '就业行业'}}</div>
                <div class="swiper-content">
                  <div v-swiper:mySwiper="swiperOption">
                    <div class="swiper-wrapper">
                      <div class="swiper-slide">
                        <img src="https://webapp-pub.ezijing.com/www/pc/services/job/occupation_swipe_01.png">
                        <p>
                          <img src="https://webapp-pub.ezijing.com/www/pc/services/major/page7_swiper_icon_01.png">
                          <span>{{isEn ? '政务云' : '政务云'}}</span>
                        </p>
                      </div>
                      <div class="swiper-slide">
                        <img src="https://webapp-pub.ezijing.com/www/pc/services/job/occupation_swipe_02.png">
                        <p>
                          <img src="https://webapp-pub.ezijing.com/www/pc/services/major/page7_swiper_icon_02.png">
                          <span>{{isEn ? '城市云' : '城市云'}}</span>
                        </p>
                      </div>
                      <div class="swiper-slide">
                        <img src="https://webapp-pub.ezijing.com/www/pc/services/job/occupation_swipe_03.png">
                        <p>
                          <img src="https://webapp-pub.ezijing.com/www/pc/services/major/page7_swiper_icon_03.png">
                          <span>{{isEn ? '教育云' : '教育云'}}</span>
                        </p>
                      </div>
                      <div class="swiper-slide">
                        <img src="https://webapp-pub.ezijing.com/www/pc/services/job/occupation_swipe_04.png">
                        <p>
                          <img src="https://webapp-pub.ezijing.com/www/pc/services/major/page7_swiper_icon_04.png">
                          <span>{{isEn ? '医疗云' : '医疗云'}}</span>
                        </p>
                      </div>
                      <div class="swiper-slide">
                        <img src="https://webapp-pub.ezijing.com/www/pc/services/job/occupation_swipe_01.png">
                        <p>
                          <img src="https://webapp-pub.ezijing.com/www/pc/services/major/page7_swiper_icon_05.png">
                          <span>{{isEn ? '工业云' : '工业云'}}</span>
                        </p>
                      </div>
                    </div>
                  </div>
                  <div class="swiper-btn swiper-button-prev">
                    <img src="https://webapp-pub.ezijing.com/www/pc/swipe-prev-btn.png">
                  </div>
                  <div class="swiper-btn swiper-button-next">
                    <img src="https://webapp-pub.ezijing.com/www/pc/swipe-next-btn.png">
                  </div>
                </div>
                <div class="module-title" style="margin-top:30px;">{{isEn ? '广泛需求岗位' : '广泛需求岗位'}}</div>
                <img
                :src="
                  isEn
                    ? 'https://webapp-pub.ezijing.com/www/pc/services/major/page6_tab3_02.png'
                    : 'https://webapp-pub.ezijing.com/www/pc/services/major/page6_tab3_02.png'
                "
              />
              </template>
              <template v-if="module6TabActive === 3">
                <div class="img-text">
                  <img
                    :src="
                      isEn
                        ? 'https://webapp-pub.ezijing.com/www/pc/services/major/page6_tab4_01.png'
                        : 'https://webapp-pub.ezijing.com/www/pc/services/major/page6_tab4_01.png'
                    "
                  />
                  <div>
                    <h5>人才培养方向</h5>
                    <p>复合 + 国际 + 创新<br>加快网络安全人才培养，打造人才培养“新样板”</p>
                  </div>
                </div>
                <div class="module-title" style="margin-top:30px;">{{isEn ? '就业行业' : '就业行业'}}</div>
                <div class="swiper-content">
                  <div v-swiper:mySwiper="swiperOption">
                    <div class="swiper-wrapper">
                      <div class="swiper-slide">
                        <img src="https://webapp-pub.ezijing.com/www/pc/services/job/occupation_swipe_01.png">
                        <p>
                          <img src="https://webapp-pub.ezijing.com/www/pc/services/major/page6_tab4_swiper_icon01.png">
                          <span>{{isEn ? 'IT/互联网行业' : 'IT/互联网行业'}}</span>
                        </p>
                      </div>
                      <div class="swiper-slide">
                        <img src="https://webapp-pub.ezijing.com/www/pc/services/job/occupation_swipe_02.png">
                        <p>
                          <img src="https://webapp-pub.ezijing.com/www/pc/services/major/page6_tab4_swiper_icon02.png">
                          <span>{{isEn ? '通信/电子行业' : '通信/电子行业'}}</span>
                        </p>
                      </div>
                      <div class="swiper-slide">
                        <img src="https://webapp-pub.ezijing.com/www/pc/services/job/occupation_swipe_03.png">
                        <p>
                          <img src="https://webapp-pub.ezijing.com/www/pc/services/major/page6_tab4_swiper_icon03.png">
                          <span>{{isEn ? '制造行业' : '制造行业'}}</span>
                        </p>
                      </div>
                      <div class="swiper-slide">
                        <img src="https://webapp-pub.ezijing.com/www/pc/services/job/occupation_swipe_04.png">
                        <p>
                          <img src="https://webapp-pub.ezijing.com/www/pc/services/major/page6_tab4_swiper_icon04.png">
                          <span>{{isEn ? '政府机关' : '政府机关'}}</span>
                        </p>
                      </div>
                      <div class="swiper-slide">
                        <img src="https://webapp-pub.ezijing.com/www/pc/services/job/occupation_swipe_01.png">
                        <p>
                          <img src="https://webapp-pub.ezijing.com/www/pc/services/major/page6_tab4_swiper_icon05.png">
                          <span>{{isEn ? '建筑房地产业' : '建筑房地产业'}}</span>
                        </p>
                      </div>
                      <div class="swiper-slide">
                        <img src="https://webapp-pub.ezijing.com/www/pc/services/job/occupation_swipe_02.png">
                        <p>
                          <img src="https://webapp-pub.ezijing.com/www/pc/services/major/page6_tab4_swiper_icon06.png">
                          <span>{{isEn ? '咨询服务行业' : '咨询服务行业'}}</span>
                        </p>
                      </div>
                      <div class="swiper-slide">
                        <img src="https://webapp-pub.ezijing.com/www/pc/services/job/occupation_swipe_03.png">
                        <p>
                          <img src="https://webapp-pub.ezijing.com/www/pc/services/major/page6_tab4_swiper_icon07.png">
                          <span>{{isEn ? '金融行业' : '金融行业'}}</span>
                        </p>
                      </div>
                    </div>
                  </div>
                  <div class="swiper-btn swiper-button-prev">
                    <img src="https://webapp-pub.ezijing.com/www/pc/swipe-prev-btn.png">
                  </div>
                  <div class="swiper-btn swiper-button-next">
                    <img src="https://webapp-pub.ezijing.com/www/pc/swipe-next-btn.png">
                  </div>
                </div>
                <img
                :src="
                  isEn
                    ? 'https://webapp-pub.ezijing.com/www/pc/services/major/page6_tab4_02.png'
                    : 'https://webapp-pub.ezijing.com/www/pc/services/major/page6_tab4_02.png'
                "
                style="margin-top:36px;"
              />
              </template>
            </div>
          </div>
        </template>
        <template v-if="showModule === 7">
          <div class="module-7 module-content-box">
            <img
              :src="
                isEn
                  ? 'https://webapp-pub.ezijing.com/www/pc/services/major/page7_01.png'
                  : 'https://webapp-pub.ezijing.com/www/pc/services/major/page7_01.png'
              "
              class="banner"
            />
            <div class="content-mian">
              <img
                :src="
                  isEn
                    ? 'https://webapp-pub.ezijing.com/www/pc/services/major/page7_02.png'
                    : 'https://webapp-pub.ezijing.com/www/pc/services/major/page7_02.png'
                "
              />
              <div class="module-title">{{isEn ? '专业分类' : '专业分类'}}</div>
              <div class="swiper-content">
                <div v-swiper:mySwiper="swiperOption" ref="mySwiper" class="swiper-container">
                  <div class="swiper-wrapper">
                    <div class="swiper-slide">
                      <img src="https://webapp-pub.ezijing.com/www/pc/services/major/page7_swiper_img_01.png">
                      <p>
                        <img src="https://webapp-pub.ezijing.com/www/pc/services/major/page7_swiper_icon_01.png">
                        <span>{{isEn ? '工业机器人' : '工业机器人'}}</span>
                      </p>
                    </div>
                    <div class="swiper-slide">
                      <img src="https://webapp-pub.ezijing.com/www/pc/services/major/page7_swiper_img_02.png">
                      <p>
                        <img src="https://webapp-pub.ezijing.com/www/pc/services/major/page7_swiper_icon_02.png">
                        <span>{{isEn ? '智能控制技术' : '智能控制技术'}}</span>
                      </p>
                    </div>
                    <div class="swiper-slide">
                      <img src="https://webapp-pub.ezijing.com/www/pc/services/major/page7_swiper_img_03.png">
                      <p>
                        <img src="https://webapp-pub.ezijing.com/www/pc/services/major/page7_swiper_icon_03.png">
                        <span>{{isEn ? '物联网技术' : '物联网技术'}}</span>
                      </p>
                    </div>
                    <div class="swiper-slide">
                      <img src="https://webapp-pub.ezijing.com/www/pc/services/major/page7_swiper_img_04.png">
                      <p>
                        <img src="https://webapp-pub.ezijing.com/www/pc/services/major/page7_swiper_icon_04.png">
                        <span>{{isEn ? '智能制造工程' : '智能制造工程'}}</span>
                      </p>
                    </div>
                    <div class="swiper-slide">
                      <img src="https://webapp-pub.ezijing.com/www/pc/services/major/page7_swiper_img_05.png">
                      <p>
                        <img src="https://webapp-pub.ezijing.com/www/pc/services/major/page7_swiper_icon_05.png">
                        <span>{{isEn ? '新能源汽车' : '新能源汽车'}}</span>
                      </p>
                    </div>
                  </div>
                </div>
                <div class="swiper-btn swiper-button-prev">
                  <img src="https://webapp-pub.ezijing.com/www/pc/swipe-prev-btn.png">
                </div>
                <div class="swiper-btn swiper-button-next">
                  <img src="https://webapp-pub.ezijing.com/www/pc/swipe-next-btn.png">
                </div>
              </div>
              <!-- <ul class="cart-img cart-img1">
                <li>
                  <img src="https://webapp-pub.ezijing.com/www/pc/services/major/page7_cart_01.png" alt="" />
                  <div class="txt">
                    <div class="name">
                      {{
                        isEn ? '工业机器人' : '工业机器人'
                      }}
                    </div>
                  </div>
                </li>
                <li>
                  <img src="https://webapp-pub.ezijing.com/www/pc/services/major/page7_cart_02.png" alt="" />
                  <div class="txt">
                    <div class="name">
                      {{
                        isEn ? '智能控制技术' : '智能控制技术'
                      }}
                    </div>
                  </div>
                </li>
                <li>
                  <img src="https://webapp-pub.ezijing.com/www/pc/services/major/page7_cart_03.png" alt="" />
                  <div class="txt">
                    <div class="name">
                      {{
                        isEn ? '物联网技术' : '物联网技术'
                      }}
                    </div>
                  </div>
                </li>
                <li>
                  <img src="https://webapp-pub.ezijing.com/www/pc/services/major/page7_cart_04.png" alt="" />
                  <div class="txt">
                    <div class="name">
                      {{
                        isEn ? '智能制造工程' : '智能制造工程'
                      }}
                    </div>
                  </div>
                </li>
                <li>
                  <img src="https://webapp-pub.ezijing.com/www/pc/services/major/page7_cart_05.png" alt="" />
                  <div class="txt">
                    <div class="name">
                      {{
                        isEn ? '新能源汽车' : '新能源汽车'
                      }}
                    </div>
                  </div>
                </li>
              </ul> -->
              <img
                :src="
                  isEn
                    ? 'https://webapp-pub.ezijing.com/www/pc/services/major/page7_03.png'
                    : 'https://webapp-pub.ezijing.com/www/pc/services/major/page7_03.png'
                "
                style="margin-top:48px;"
              />
              <img
                :src="
                  isEn
                    ? 'https://webapp-pub.ezijing.com/www/pc/services/major/page7_04.png'
                    : 'https://webapp-pub.ezijing.com/www/pc/services/major/page7_04.png'
                "
              />
            </div>
          </div>
        </template>
      </div>
    </div>
  </div>
</template>
<script>
import tab from '../../components/services/tab'
export default {
  components: { tab },
  data() {
    const _this = this
    return {
      tabList: [
        {
          name: this.isEn ? '新文科' : '新文科',
          disabled: true
        },
        {
          name: this.isEn ? '数字金融' : '数字金融'
        },
        {
          name: this.isEn ? '数字营销' : '数字营销'
        },
        {
          name: this.isEn ? '商业数据分析' : '商业数据分析'
        },
        {
          name: this.isEn ? '数字媒体艺术' : '数字媒体艺术'
        },
        {
          name: this.isEn ? '智能运营' : '智能运营'
        },
        {
          name: this.isEn ? '新工科' : '新工科'
        },
        {
          name: this.isEn ? '智能制造' : '智能制造'
        }
      ],
      showModule: 1,
      isEn: false,
      swiperOption: {
        // observer: true,
        observeParents: true,
        speed: 400,
        autoplay: true,
        delay: 3000,
        loop: true,
        slidesPerView: 'auto',
        centeredSlides: true,
        spaceBetween: 20,
        navigation: {
          nextEl: '.swiper-button-next',
          prevEl: '.swiper-button-prev',
        }
      },
      module6TabActive: 0
    }
  },
  created() {
    this.isEn = this.$cookies.get('lang') === 'en-US'
  },
  methods: {
    tabChangeIndex(n) {
      if (n === 0) return
      this.showModule = n
    }
  },
  computed: {
    m1SetStyle() {
      return url => {
        return `background: url(${url});background-size: 100% 100%`
      }
    }
  }
}
</script>
<style lang="scss" scoped>
.occupation-content {
  width: 1200px;
  margin: 0 auto;
  padding-bottom: 100px;
  .mian {
    display: flex;
    justify-content: space-between;
  }
  .mian-title {
    font-size: 28px;
    font-weight: 500;
    line-height: 100%;
    color: #aa1941;
    padding: 48px 0 31px;
  }
  .module-sub-title{
    margin-top:20px;
    span{
      display:inline-block;
      font-size:20px;
      line-height:36px;
      color:#424242;
      border-bottom:1px solid #aa1941;
    }
  }
  .occupation-content-mian {
    width: 1000px;
    .module-content-box {
      background: #fff;
      .banner {
        width: 100%;
        height: 320px;
        display: block;
      }
      .content-mian{
        padding: 60px 50px 15px;
        img {
          width: 100%;
          display: block;
          margin-bottom:48px;
        }
        .module-title{
          font-size:22px;
          font-weight: 500;
          line-height:34px;
          color:#424242;
          margin-bottom:20px;
        }
        .swiper-content{
          padding: 0 25px;
          margin-top:37px;
          position:relative;
          // overflow: auto;
          // width: 100%;
          .swiper-slide{
            position: relative;
            width: 176px;
            height: 224px;
            // margin-top: 10px;
            p{
              position: absolute;
              top: 0;
              left: 0;
              width: 100%;
              height: 100%;
              text-align:center;
              background: rgba(51, 51, 51, 0.65);
              box-sizing: border-box;
              padding-top:70px;
              font-size: 20px;
              color: #FEFEFE;
              overflow: hidden;
              text-overflow:ellipsis;
              white-space: nowrap;
              img{
                width:50px;
                height:41px;
                display:inline-block;
                margin-bottom:16px;
              }
              span{
                display:block;
                line-height: 40px;
                font-size:16px;
              }
            }
            img{
              width: 100%;
            }
          }
          .swiper-slide-active {
            width: 176px;
            height: 224px;
            margin-top: 0;
            img{
              width: 100%;
              height: 100%;
              display: block;
            }
          }
          .swiper-btn{
            width:20px;
            height:35px;
            position:absolute;
            left:-5px;
            top:50%;
            transform:translateY(-50%);
            z-index:2;
            display:none;
            img{
              width:100%;
              height:100%;
              display:block;
            }
          }
          .swiper-button-next{
            left:unset;
            right: -5px;
          }
        }
        .cart-txt{
          display:flex;
          justify-content: space-between;
          margin:36px 0 40px;
          div{
            width:31%;
            // border-top:8px solid #F9F8F8;
            background:#F9F8F8;
            text-align:center;
            min-height:220px;
            box-sizing:border-box;
            padding:20px 0;
            h5{
              line-height:60px;
              font-size:18px;
              color:#aa1941;
            }
            p{
              line-height:34px;
              color:#424242;
            }
            p.bold{
              font-weight:bold;
            }
          }
          div:hover{
            // border-color:#fff;
            background:#fff;
            box-shadow: 0px 1px 25px rgba(0, 0, 0, 0.06);
          }
        }
        .cart-img {
          display: flex;
          flex-wrap: wrap;
          li {
            margin-right: 5px;
            margin-bottom: 5px;
            width: 295px;
            height: 170px;
            position: relative;
            overflow: hidden;
            &:hover {
              img {
                transform: scale(1.1);
              }
            }
            img {
              transition: all 0.3s;
              width: 100%;
              height: 100%;
              display: block;
            }
            .txt {
              width: 100%;
              height: 100%;
              position: absolute;
              top: 0;
              left: 0;
              background: rgba(0, 0, 0, 0.3);
              .name {
                position: absolute;
                bottom: 20px;
                left: 20px;
                font-size: 16px;
                font-weight: 300;
                // line-height: 170px;
                color: #ffffff;
              }
            }
          }
        }
        .cart-img.col-4{
          li{
            width:220px;
            height:170px;
          }
        }
      }
    }
    .module-6{
      .content-mian{
        .tabs{
          display:flex;
          .item{
            width:150px;
            height:150px;
            background: #F4F4F4;
            text-align:center;
            box-sizing:border-box;
            padding-top:30px;
            border-top:6px solid #f4f4f4;
            cursor:pointer;
            img{
              width:42px;
              height:42px;
              display:inline-block;
              margin-bottom:16px;
            }
          }
          .item.active{
            border-color:#aa1941;
            background:#fff;
            color:#aa1941;
          }
        }
        .img-text{
          position:relative;
          margin-top:15px;
          div{
            position:absolute;
            left:0;
            top:0;
            width:100%;
            height:100%;
            background:rgba(51,51,51,.6);
            color:#fff;
            display:flex;
            box-sizing:border-box;
            padding-top:100px;
            h5{
              width:300px;
              text-align:center;
              font-size:20px;
            }
            p{
              line-height:28px;
            }
          }
          
        }
      }
    }
    .module-7{
      .content-mian{
        .cart-img1{
          margin-top:20px;
          li{
            width:300px;
            height:300px;
            margin-right: 0;
            margin-bottom: 0;
          }
          li:first-child{
            width:600px;
          }
        }
      }
    }
  }
}
</style>
