bocai_supplyChain_pc/src/views/main.vue

<template>
	<div class="index-container" @click="isspecialboxshow = false">
		<!-- title部分 -->
		<div class="pagetitle" v-if="isLogin && routertitleindex != 0"
			   :class="pagrTitle == 'list' || pagrTitle == 'detail' || pagrTitle == 'mybill' ? 'page-title-list-active' : ''"
		>
			<div class="w fsa">
				<div class="fss">
					<router-link to="/main">
						<!-- <svg class="svg_icon f64" aria-hidden="true">
							<use xlink:href="#icon-daotian2" />
						</svg> -->
						<img src="../../static/img/bcgyl.png" style="width: 40px;margin-right: 12px;" alt="" />
						<span style="font-size: 16px">伯才供应链平台</span>
					</router-link>
				</div>
				<span class="login fsa">
					<div class="f14 pr16 mr16" style="line-height: 1; border-right: 1px solid #979797; cursor: pointer">
						<!-- <i class="iconfont icon-qiehuan cf4 f12 mr4"></i>切换到公开版 -->
					</div>
					<div>
						<ul class="fsa titleTag">
							<li>
								<router-link to="/" :class="routertitleindex == 0 ? 'titleactive' : ''" rel="opener">首页</router-link>
							</li>
							<li>
								<router-link to="/list" @click.native="toList" :class="routertitleindex == 1 ? 'titleactive' : ''" rel="opener">职位列表</router-link>
							</li>
							<li v-if="false">
								<router-link to="/list?type=vocational" :class="routertitleindex == 8 ? 'titleactive' : ''" rel="opener">职教职培</router-link>
							</li>
							<li v-if="false">
								<a-dropdown
									overlayClassName="logindropdown"
									placement="bottomRight"
									:getPopupContainer="
										(triggerNode) => {
											return triggerNode.parentNode || document.body;
										}
									"
								>
									<span class="" style="cursor: pointer">
										<div :class="routertitleindex == 5 ? 'titleactive' : ''">报名工单</div>
									</span>
									<div class="loginbox" style="" slot="overlay">
										<router-link to="/mybill">
											<div>
												<span>报名工单</span>
												<i class="iconfont icon-youjiantou"></i>
											</div>
										</router-link>
										<router-link to="/vocationalBill">
											<div>
												<span>职教报名</span>
												<i class="iconfont icon-youjiantou"></i>
											</div>
										</router-link>
									</div>
								</a-dropdown>
							</li>
							<li v-else>
								<router-link to="/mybill" :class="routertitleindex == 5 ? 'titleactive' : ''">
									<!-- <div> -->
									<span>报名工单</span>
									<!-- <i class="iconfont icon-youjiantou"></i> -->
									<!-- </div> -->
								</router-link>
							</li>
							<!--<li>
                <router-link to="/mytownsman" :class="routertitleindex == 4 ? 'titleactive' : ''">我的老乡</router-link>
              </li>-->
							<!-- <li>
              <router-link to="/dataStatistics" :class="routertitleindex == 6 ? 'titleactive' : ''">团队数据</router-link>
              </li>-->
							<!-- <li>
              <router-link to="/serviceoutlets"
                ><a
                  href="javascript:;"
                  :class="routertitleindex === 2 ? 'titleactive' : ''"
                  >服务网点</a
                >
              </router-link>
            </li>
            <li>
              <router-link to="/aboutus">
                <a
                  href="javascript:;"
                  :class="routertitleindex === 3 ? 'titleactive' : ''"
                  >关于我们</a
                >
              </router-link>
              </li>-->
						</ul>
					</div>
					<span v-if="isLogin" class="logined fsa">
						<div class v-if="loginValue.agencyName == '郑州一才工作'">
							<a-dropdown
								:trigger="['click']"
								v-if="false"
								overlayClassName="logindropdown"
								placement="bottomRight"
								:getPopupContainer="
									(triggerNode) => {
										return triggerNode.parentNode || document.body;
									}
								"
							>
								<div class="mr20 user-box">
									<i class="iconfont icon-xiaoxi"></i>
								</div>
								<div class="loginbox" slot="overlay">
									<router-link to="/systemMsg">
										<div>
											<span> <i class="iconfont icon-xitongtongzhi"></i>系统通知 </span>
											<i class="iconfont icon-youjiantou"></i>
										</div>
									</router-link>
									<router-link to="/teamMsg">
										<div style="border-bottom: none">
											<span> <i class="iconfont icon-tuanduitongzhi"></i>团队通知 </span>
											<i class="iconfont icon-youjiantou"></i>
										</div>
									</router-link>
								</div>
							</a-dropdown>
						</div>
						<!-- v-if="false" -->
						<!-- <div class="g_mr_16 more-team">
							<a-dropdown :trigger="['click']" class="" placement="bottomRight" :getPopupContainer="(node) => node.parentNode">
								<div class="fsa more-team-button" style="padding: 0px 12px">
									<div class="fss">
										<div>
											<div class="logo">{{ userbaseInfo.agencyName && userbaseInfo.agencyName.charAt(0) }}</div>
										</div>
										<div class="hover-f40" style="max-width: 98px">{{ userbaseInfo.agencyName }}</div>
									</div>
									<i class="iconfont icon-paixu f12" style="color: #ccc; margin-left: 4px"></i>
								</div>

								<div class="" slot="overlay" style="box-shadow: 0px 2px 4px 0px rgba(229, 229, 229, 0.5), 0px 4px 12px 0px rgba(0, 0, 0, 0.15)">
									<div class="more-team-drop">
										<div class="fsa p12 pr8 hover-blue" style="border-radius: 4px; cursor: pointer" @click="changeTeam(item)" v-for="(item, index) in teamList">
											<div class="fss">
												<div>
													<img v-if="item.logo" :src="item.logo" alt="" />
													<div v-else class="logo">{{ item.agencyName && item.agencyName.charAt(0) }}</div>
												</div>
												<div class="" style="width: 98px">{{ item.agencyName }}</div>
											</div>
											<div class="ml12 f12 cf4" v-if="item.checked">当前</div>
										</div>
									</div>
								</div>
							</a-dropdown>
						</div> -->
						<a-dropdown
							:trigger="['click']"
							placement="bottomRight"
							overlayClassName="logindropdown"
							:getPopupContainer="
								(triggerNode) => {
									return triggerNode.parentNode || document.body;
								}
							"
						>
							<span class="fsa fsa-box">
								<span class="iconfont icon-morentouxiang mr4 f32" style="color: #ccc;" v-if="!userbaseInfo.imgSrc"></span>
								<img :src="userbaseInfo.imgSrc" class="mr4" style="border-radius: 50%; width: 28px; height: 28px" alt v-else />
								<div class="ml4 f14 c6">{{ userbaseInfo.userName || userbaseInfo.nickName || "-" }}</div>
							</span>
							<div class="loginbox" slot="overlay" style="width: 240px">
								<router-link to="/accountsetting">
									<div class="hover-blue br4" style="padding: 12px 12px">
										<span> <i class="iconfont icon-gerenzhongxin"></i>个人中心 </span>
										<i class="iconfont icon-youjiantou c9"></i>
									</div>
								</router-link>
								<!-- <router-link to="/merchantBack" v-if="loginValue.agencyName == '郑州一才工作' ">
                  <div>
                    <span>
                      <i class="iconfont icon-shangjiahoutai"></i>商家后台and1.0
                    </span>
                    <i class="iconfont icon-youjiantou"></i>
                  </div>
                </router-link>-->
								<!-- 2023-11-29 注释该条件 && (loginValue.agencyRole == 2 || loginValue.agencyRole == 1 ) -->
								<!-- v-if="loginValue.agencyName == '郑州一才工作' || loginValue.id == '116253'" -->

								<div @click.stop="goAdmin" class="hover-blue br4 fsa" style="padding: 12px 12px; line-height: 25px; border-bottom: 0" v-if="loginValue.agencyName == '郑州一才工作' || loginValue.id == '116253'">
									<span class="f14"> <i class="iconfont icon-shangjiahoutai mr6"></i>商家后台 </span>
									<i class="iconfont icon-youjiantou c9"></i>
								</div>
								<a-dropdown :trigger="['click']" class="more-team" :getPopupContainer="(node) => node.parentNode" overlayClassName="setPosition">
									<span class="fsa more-team-button hover-blue br4" style="padding: 6px 12px" @click.stop>
										<div class="fss">
											<div>
												<i class="icon-qiehuantuandui iconfont g_mr_5" style="font-size: 16px"></i>
												切换团队
											</div>
										</div>
										<div class="fse">
											<div class="cblue esl" style="max-width: 98px">{{ userbaseInfo.fullName || userbaseInfo.agencyName }}</div>
											<i class="iconfont icon-youjiantou c9"></i>
										</div>
									</span>
									<div class="more-team-drop" slot="overlay">
										<div class="fsa p12 hover-blue" style="border-radius: 4px; cursor: pointer" @click="changeTeam(item)" v-for="(item, index) in teamList">
											<div class="fss">
												<div>
													<img v-if="item.logo" class="mr8" :src="item.logo" style="width: 16px; height: 16px" alt="" />
													<div v-else class="logo mr8">{{ item.fullName && item.fullName.charAt(0) }}</div>
												</div>
												<div class="tl esl" style="width: 98px">{{ item.fullName || item.agencyName }}</div>
											</div>
											<div class="ml12 f12 cf4" v-if="item.checked">当前</div>
										</div>
									</div>
								</a-dropdown>
								<!-- <router-link to="###" v-if="loginValue.agencyName == '郑州一才工作'">
                  <div @click="goJiaofu">
                    <span>
                      <i class="iconfont icon-jiaofuzhushouicon"></i>交付助手
                    </span>
                    <i class="iconfont icon-youjiantou"></i>
                  </div>
                </router-link> -->
								<button @click="logout" class="mb6">退出登录</button>
							</div>
						</a-dropdown>
					</span>
					<span class="loginbtn" v-else>
						<router-link to="/login">
							<button style="cursor: pointer">登录</button>
						</router-link>
					</span>
				</span>
			</div>
		</div>
		<div class="fsa titleSlogan w" v-if="routertitleindex == 0">
			<!-- <div> -->
			<div>
				<img src="../../static/img/logo.svg" style="width: 40px" alt="" />
				<span style="font-size: 16px;color: #fff;">伯才供应链平台</span>
			</div>
			<!-- </div> -->
			<div v-if="!isLogin" class="loginBtn">
				<router-link to="/login" style="display: inline-block; width: 100%">注册/登录</router-link>
			</div>
			<div v-else  class="loginBtn">
				<router-link to="/list" style="display: inline-block; width: 100%">进入伯才</router-link>
			</div>
		</div>

		<router-view :isspecialboxshow.sync="isspecialboxshow" :formvalue="formvalue"></router-view>
		<!-- 老乡广告 -->
		<!-- <div class="fellowtownsman" v-if="laoxiangshow">
      <div class="w">
        <div class="title">
          <h1><span></span>老乡们都想去</h1>
        </div>
        <div class="main">
          <div
            class="jobinfobox"
            v-for="(item, index) in fellowList"
            :key="index"
          >
            <router-link :to="'/detail/' + item.id">
              <a href="javascript:;" @click="resetpage">
                <div class="imgbox">
                   <img v-if="item.logo" :src="item.logo" alt="" />
              <img v-else src="../../../assets/nopicture.png" alt="" />
                  <span>服务费<i>1.3</i>元/小时</span>
                </div>
                <div class="jobname">{{ item.aliasName }}</div>
              </a>
            </router-link>
            <div class="jobinfo">
              <span>{{ item.district }}</span>
              <span>{{ item.gender }}</span>
              <span>{{ item.age }}</span>
            </div>
            <div class="jobtag">
              <span>返费</span>
              <span
                v-for="(item1, index) in item.jobSpecialLabelNames"
                :key="index"
                >{{ item1 }}</span
              >
            </div>
            <div class="jobprice">
              <template v-if="item.hourlyPay"
                ><span>{{ item.hourlyPayTemp / 100 }}</span
                >元/小时</template
              >
              <template v-else-if="item.dayPay"
                ><span>{{ item.hourlyPayTemp / 100 }}</span
                >元/日</template
              >
            </div>
          </div>
        </div>
      </div>
    </div>-->
		<!-- banner广告栏 -->
		<!-- <div class="banner" v-if="isbannershow">
      <div class="w">
        <i class="iconfont icon-yigezhuanmenfuwudailidepingtai"></i>
      </div>
    </div>-->
		<!-- footer部分 -->
		<footer v-if="isfootershow" :class="loginPage ? 'footer_abs' : ''"
					  :style="{
							'background-color': pagrTitle == 'detail' || pagrTitle == 'mybill' || pagrTitle == 'boundtel' ? '#f0f0f0' : '#ffffff',
							'padding-top': '20px',
							'margin-top': 0
						}"
		>
			<div class="w">
				<!-- <ul>
          <li @click="totop"><router-link to="/list">一手职位</router-link></li>
          <li></li>
          <li @click="totop">
            <router-link to="/serviceoutlets">服务网点</router-link>
          </li>
          <li></li>
          <li @click="totop">
            <router-link to="/aboutus">关于我们</router-link>
          </li>
        </ul>-->
				<div>
					<span>
						Powered by
						<svg class="svg_icon ml4" style="font-size: 46px; margin-top: -2px" aria-hidden="true">
							<use xlink:href="#icon-bocai2" />
						</svg>
						｜Copyright © 2015-2023 Bocai. All Rights Reserved.｜
					</span>
					<a target="_blank" href="https://beian.miit.gov.cn/#/Integrated/index">豫ICP备2023001993号-25A</a>
				</div>
			</div>
		</footer>
	</div>
</template>

<script>
// import joblist from "../components/firstjob/joblist.vue";
import Cookies from "js-cookie";
import {
	JobListApi,
	JobListApiYicai,
	// getCityApi,
} from "../api/job";

import { logoutApi, checkTokenApi } from "../api/login";
import { getTeamListApi, changeTeamApi } from "../api/userinfo";

export default {
	inject: ["reload"],
	provide() {
		return {
			// getJobList: this.getJobList,
			// getJobListYicai: this.getJobListYicai,
			logout: this.logout,
		};
	},
	// 组件名称
	name: "",
	// 局部注册的组件
	components: {
		// joblist,
	},
	// 组件参数 接收来自父组件的数据
	props: {},
	// 组件状态值
	data() {
		return {
			pagrTitle:'list',
			fellowList: [],
			// isspinning: false,
			isspecialboxshow: false,
			isfootershow: true,
			laoxiangshow: false,
			isbannershow: true,
			isLogin: false,
			loginValue: {},
			formvalue: {
				// 筛选的上传参数
				district: [], // 城镇数据
				monthlyPayStr: [], // 每月工资
				ageStr: "", // 年龄数据
				jobSpecialLabelIds: [], // 特色标签索引
				aliasName: "",
				sex: [],
				pageNum: 1,
				pageSize: 8,
				total: null, //分页配置
			},
			userbaseInfo: JSON.parse(localStorage.getItem("LOGIN_DATA")),
			loginPage: false,
			routertitleindex: 0,
			teamList: [],
		};
	},
	// 计算属性
	computed: {
		// routertitleindex: {
		//   set() {},
		//   get() {
		//     const path = this.$route.fullPath
		//     if (path.indexOf('serviceoutlets') > -1) {
		//       return 2
		//     } else if (path.indexOf('list') > -1 || path.indexOf('detail') > -1) {
		//       return 1
		//     } else if (path.indexOf('aboutus') > -1) {
		//       return 3
		//     } else if (path.indexOf('main') > -1) {
		//       return 0
		//     } else if (path.indexOf('mytownsman') > -1) {
		//       return 4
		//     } else if (path.indexOf('mybill') > -1) {
		//       return 5
		//     } else if (path.indexOf('dataStatistics') > -1) {
		//       return 6
		//     } else {
		//       return 7
		//     }
		//   },
		// },
		// isLogin() {
		//   return localStorage.getItem("LOGIN_DATA") !== null ? true : false;
		// },
		// loginValue() {
		//   return localStorage.getItem("LOGIN_DATA") !== null
		//     ? JSON.parse(localStorage.getItem("LOGIN_DATA"))
		//     : { tel: "" };
		// return JSON.parse(data)
		// },
	},
	// 侦听器
	watch: {
		routertitleindex() {
			// const path = this.$route.fullPath
			// if (path.indexOf('serviceoutlets') > -1) {
			//   this.laoxiangshow = true
			// } else if (path.indexOf('list') > -1 || path.indexOf('detail') > -1) {
			//   this.laoxiangshow = true
			// } else if (path.indexOf('aboutus') > -1) {
			//   this.laoxiangshow = false
			// } else {
			//   this.laoxiangshow = true
			// }
			this.showfooter();
		},
		$route: {
			handler(to) {
				this.init()
				console.log();
				// console.log("ischange");
				// console.log(to);
				// console.log(from);
				// console.dir(this.navigationBarLocation);
				window.addEventListener("scroll", this.navigationBarLocation);
				window.addEventListener("scroll", this.windowScroll); //监听页面滚动
				if (to.fullPath.indexOf("serviceoutlets") > -1) {
					this.routertitleindex = 2;
				} else if (to.fullPath.indexOf("mybill") > -1 || to.fullPath.indexOf("vocationalBill") > -1) {
					this.routertitleindex = 5;
				} else if (to.fullPath.indexOf("vocational") > -1) {
					this.routertitleindex = 8;
				} else if (to.fullPath.indexOf("list") > -1 || to.fullPath.indexOf("detail") > -1) {
					this.routertitleindex = 1;
				} else if (to.fullPath.indexOf("aboutus") > -1) {
					this.routertitleindex = 3;
				} else if (to.fullPath.indexOf("main") > -1) {
					this.routertitleindex = 0;
				} else if (to.fullPath.indexOf("mytownsman") > -1) {
					this.routertitleindex = 4;
				} else if (to.fullPath.indexOf("dataStatistics") > -1) {
					this.routertitleindex = 6;
				} else {
					this.routertitleindex = 7;
				}
				if (to.fullPath == "/login" || !localStorage.getItem("LOGIN_DATA")) {
					this.loginPage = true;
					this.isLogin = false;
				} else {
					this.loginPage = false;
				}
				if (to.fullPath == "/list") {
					window.removeEventListener("scroll", this.navigationBarLocation);
					return;
				} else if (to.fullPath == "/main") {
					window.removeEventListener("scroll", this.windowScroll);
					return;
				}
				window.removeEventListener("scroll", this.navigationBarLocation);
				window.removeEventListener("scroll", this.windowScroll);
			},
			deep: true,
			immediate: true,
		},
	},
	// 生命周期钩子   注：没用到的钩子请自行删除
	/**
	 * 组件实例创建完成，属性已绑定，但DOM还未生成，$ el属性还不存在
	 */
	created() {
		console.log(this.$route);
		if (this.$route.fullPath != "/login") {
			this.loginPage = false;
		}
		if (localStorage.getItem("LOGIN_DATA")) {
			this.isLogin = true;
		}
		// this.getJobList();
		// this.getJobListYicai();
		this.isLaoxiangshow();
		this.showfooter();
		this.getTeamList();
		this.init()
	},
	/**
	 * el 被新创建的 vm.el 替换，并挂载到实例上去之后调用该钩子。
	 * 如果 root 实例挂载了一个文档内元素，当 mounted 被调用时 vm.el 也在文档内。
	 */
	mounted() {
		this.loginValue = localStorage.getItem("LOGIN_DATA") !== null ? JSON.parse(localStorage.getItem("LOGIN_DATA")) : { tel: "" };
		console.log(this.loginValue);
		// console.log(document.querySelector(".ant-pagination-options-quick-jumper"));
		this.init()
	},
	// 组件方法
	methods: {
		init(){
			// pagrTitle
			console.log('-----------------------',this.$route,)
			let that = this;
			if(that.$route.name == 'JobList'){ 
				that.pagrTitle = 'list'
			}else if(that.$route.name == 'Detail'){
				that.pagrTitle = 'detail'
			}else if(that.$route.name == 'mybill'){
				that.pagrTitle = 'mybill'
			}else if(that.$route.name == 'boundtel'){
				that.pagrTitle = 'boundtel'
			}else if(that.$route.name == 'loginpsw'){
				that.pagrTitle = 'boundtel'
			}else if(that.$route.name == 'boundwx'){
				that.pagrTitle = 'boundtel'
			}else{
				that.pagrTitle = ''
			}
		},
		/**
		 * 处理后台返回的职位列表
		 */
		// windowScroll() {
		// 	// console.log(e);
		// 	let scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop;
		// 	// console.log(scrollTop); // 获取到页面滚动的值,
		// 	let navigation = document.getElementById("navigation");
		// 	let content = document.getElementById("maincontent");
		// 	// let filterbox = document.querySelector(".w");
		// 	// console.log(filterbox);
		// 	// console.log(content);
		// 	// let left = ("100vw" - "1200px") / 2;
		// 	// console.log(navigator.userAgent);
		// 	if (this.$route.fullPath == "/list") {
		// 		if (scrollTop >= 81) {
		// 			navigation.style.position = "fixed";
		// 			navigation.style.top = "0px";
		// 			navigation.style.boxShadow = "2px 2px 4px 0px rgba(0,0,0,0.05)";
		// 			content.style.marginTop = "64px";
		// 			if (navigator.userAgent.indexOf("Mac OS X") == -1) {
		// 				navigation.style.paddingLeft = "35px";
		// 			}
		// 		} else {
		// 			navigation.style.position = "relative";
		// 			navigation.style.right = "0";
		// 			content.style.marginTop = "16px";
		// 			navigation.style.boxShadow = "none";
		// 			if (navigator.userAgent.indexOf("Mac OS X") == -1) {
		// 				navigation.style.paddingLeft = "0px";
		// 			}
		// 		}
		// 	}
		// },
		navigationBarLocation() {
			let navigationBar = document.getElementById("navigationBar");
			let aboutBill = document.getElementById("aboutBill");
			// console.log(navigationBar.getBoundingClientRect().top);
			// console.log(aboutBill);
			// console.log(aboutBill.getBoundingClientRect().top);
			if (this.$route.fullPath == "/main") {
				if (navigationBar.getBoundingClientRect().top <= 0 && aboutBill.getBoundingClientRect().top < 84) {
					navigationBar.style.position = "fixed";
					navigationBar.style.top = "0px";
					navigationBar.style.boxShadow = "0 0 10px 0 #eee";
					navigationBar.style.width = "1920px";
				} else if (navigationBar.getBoundingClientRect().top == 0 && aboutBill.getBoundingClientRect().top >= 84) {
					// console.log('isbig');
					navigationBar.style.position = "absolute";
					navigationBar.style.top = "unset";
					navigationBar.style.bottom = "0px";
					navigationBar.style.boxShadow = "none";
					navigationBar.style.width = "1200px";
				}
			}
		},

		totop() {
			// console.log(window);
			document.body.scrollTop = 0;
			document.documentElement.scrollTop = 0;
			// window.body.scrollY = 0;
		},
		isLaoxiangshow() {
			const path = this.$route.fullPath;
			if (path.indexOf("serviceoutlets") > -1) {
				this.laoxiangshow = true;
			} else if (path.indexOf("list") > -1 || path.indexOf("detail") > -1) {
				this.laoxiangshow = true;
			} else if (path.indexOf("aboutus") > -1) {
				this.laoxiangshow = false;
			} else {
				this.laoxiangshow = true;
			}
		},
		/**
		 * 获取团队列表
		 */
		getTeamList() {
			let that = this;
			getTeamListApi().then((res) => {
				console.log(res);

				that.teamList = res.data.data;
				console.log("that.teamList", that.teamList);

				that.teamList.forEach((item, index) => {
					if (item.id == that.loginValue.user.agencyId) {
						item.checked = true;
					}
				});
			});
		},
		changeTeam(_item) {
			let that = this;
			if (_item.id == that.loginValue.user.agencyId) {
				return false;
			}
			console.log(_item);
			changeTeamApi(_item.id).then((res1) => {
				console.log("res1", res1);
				if (res1.data.status == 2001) {
					// localStorage.setItem("DAOTIAN_userinfo_agencyid", _item.id);
					that.$message.error(res1.data.msg);
					that.getTeamList();
				} else {
					localStorage.setItem("DAOTIAN_agencyid", _item.id);
					checkTokenApi().then((res) => {
						console.log(res.data);
						localStorage.setItem("LOGIN_DATA", JSON.stringify(res.data.data));
						let routeUrl = that.$router.resolve({
							path: "/list",
						});
						window.open(routeUrl.href, "_blank");
						setTimeout(() => {
							window.close();
						}, 10);
						// return
						// localStorage.setItem("DAOTIAN_token", res.data.token);
						// that.reload();

						// location.reload();
						// router.push("/merchantManagement/homePage");
					});
				}
			});
		},
		async logout() {
			// logoutApi().then((result) => {
			//   console.log(result);
			// });
			try {
				const data = await logoutApi();
				console.log(data);
				if (data.status === 200) {
					localStorage.removeItem("LOGIN_DATA");
					localStorage.removeItem("DAOTIAN_token");
					localStorage.removeItem("LOGIN_DATA_token");
					localStorage.removeItem("daotian_to_admin_token");
					localStorage.removeItem("hasTab");
					this.reload();
					this.$router.push("/main");
				} else {
					console.log(1);
				}

				// this.fellowList = disposeJobListData(data.data.recordList);
				// this.isspinning = false;
				// console.log(this.fellowList);
				// this.$emit("update:relationList", this.relationList);
			} catch (error) {
				console.log(error);
				this.$message.warning(error.message);
			}
			// console.log(data);
			// if (data.status === 200) {
			//   localStorage.removeItem("LOGIN_DATA");
			// }
		},
		resetpage() {
			console.log(1);
			setTimeout(() => {
				this.reload();
				document.body.scrollTop = 0;
				document.documentElement.scrollTop = 0;
			}, 1000);
		},
		showfooter() {
			const path = this.$route.fullPath;

			if (path.indexOf("main") > -1 || this.pagrTitle == 'list') {
				this.isbannershow = false;
				this.isfootershow = false;
			} else {
				this.isbannershow = true;

				this.isfootershow = true;
			}
			if (path.indexOf("login") > -1 && path.indexOf("loginpsw") == -1) {
				this.isbannershow = false;
			}
		},
		toList() {
			console.log(this.$router);
			// this.$router.go(0);
			// window.location.reload();
			this.reload();
		},

		goAdmin() {
			let obj = JSON.parse(localStorage.getItem("LOGIN_DATA"));
			let token = localStorage.getItem("LOGIN_DATA_token");
			console.log(obj);
			console.log(token);
			if (window.location.hostname == "localhost") {
				// 测试环境，通过URL获取token
				window.open("http://localhost:3000/#/login?token=" + token + "&username=" + (obj.user.userName ? obj.user.userName : obj.user.nickName) + "&avatar=" + obj.imgSrc + "&roleid=" + obj.user.agencyRoleId + "&agencyid=" + obj.user.agencyId + "&userInfo=" + JSON.stringify(obj));
			} else {
				// 正式环境，通过缓存获取
				localStorage.setItem("daotian_to_admin", JSON.stringify(obj));
				localStorage.setItem("daotian_to_admin_token", token);
				localStorage.setItem("daotian_to_admin_avatar", obj.imgSrc);
				localStorage.setItem("daotian_to_admin_username", obj.user.userName ? obj.user.userName : obj.user.nickName);
				localStorage.setItem("daotian_to_admin_roleid", obj.user.agencyRoleId);
				localStorage.setItem("daotian_to_admin_agencyid", obj.user.agencyId);
				if (window.location.origin.indexOf("www") > -1) {
					window.open("http://www.ibocai.cn/#/login?token=" + token + "&username=" + (obj.user.userName ? obj.user.userName : obj.user.nickName) + "&avatar=" + obj.imgSrc + "&roleid=" + obj.user.agencyRoleId + "&agencyid=" + obj.user.agencyId + "&userInfo=" + JSON.stringify(obj));
				} else {
					window.open("http://ibocai.cn/#/login?token=" + token + "&username=" + (obj.user.userName ? obj.user.userName : obj.user.nickName) + "&avatar=" + obj.imgSrc + "&roleid=" + obj.user.agencyRoleId + "&agencyid=" + obj.user.agencyId + "&userInfo=" + JSON.stringify(obj));
				}
			}
		},
		goJiaofu() {
			let obj = JSON.parse(localStorage.getItem("LOGIN_DATA"));
			let token = JSON.parse(localStorage.getItem("LOGIN_DATA_token"));
			if (window.location.hostname == "localhost") {
				// 测试环境，通过URL获取token
				window.open("http://localhost:3000/#/other/delivery?token=" + token + "&username=" + (obj.user.userName ? obj.user.userName : obj.user.nickName) + "&avatar=" + obj.imgSrc + "&roleid=" + obj.user.agencyRoleId + "&agencyid=" + obj.user.agencyId + "&userInfo=" + JSON.stringify(obj));
			} else {
				// 正式环境，通过缓存获取
				localStorage.setItem("daotian_to_admin_token", token);
				localStorage.setItem("daotian_to_admin", JSON.stringify(obj));
				localStorage.setItem("daotian_to_admin_avatar", obj.imgSrc);
				localStorage.setItem("daotian_to_admin_username", obj.user.userName ? obj.user.userName : obj.user.nickName);
				localStorage.setItem("daotian_to_admin_roleid", obj.user.agencyRoleId);
				localStorage.setItem("daotian_to_admin_agencyid", obj.user.agencyId);
				if (window.location.origin.indexOf("www") > -1) {
					window.open("http://www.ibocai.cn/#/other/delivery");
				} else {
					window.open("http://ibocai.cn/#/other/delivery");
				}
			}
		},
	},
};
</script>

<style scoped lang="less">
.index-container {
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	& > div:nth-child(2) {
		flex: 1;
	}
	.titleSlogan {
		position: absolute;
		left: 50%;
		top: 30px;
		// padding-top: 32px;
		transform: translateX(-50%);
		z-index: 9;
		svg {
			font-size: 120px;
		}
		.loginBtn {
			// width: 68px;
			height: 32px;
			padding: 0 16px;
			font-size: 14px;
			line-height: 30px;
			text-align: center;
			border-radius: 999px;
			cursor: pointer;
			color: #fff;
			border: 1px solid #fff;
			text-shadow: 3px 3px 10px rgba(0, 0, 0, 0.4);
			background-color: rgba(255, 255, 255, 0);
			transition: all 0.3s;
			&:hover {
				// background-color: rgba(255, 255, 255, 0.3);
				background-color: #1890ff;
				border-color: transparent;
			}
		}
	}
	/deep/ .pagetitle {
		background-color: #ffffff;
		padding: 0;
		height: 56px;
		display: flex;
		align-items: center;
		// height: 32px;
		// width: 100vw;
		// font-size: 16px;
		.titleactive {
			// font-size: 18px;
			font-weight: bold;
			// font-weight: normal;
			color: #1890ff;
		}
		.w {
			overflow: hidden;
			// display: flex;
			// justify-content: space-between;
			// line-height: 36px;

			.titleTag {
				font-size: 14px;
				display: flex;
				margin-left: 150px;
				li {
					font-weight: normal;
					color: #666;
					margin-right: 32px;
					line-height: 64px;
					// text-shadow: 2px 2px 4px 0px rgba(0, 0, 0, 0.05);

					a {
						transition: none;
						&:hover {
							color: #1890ff;
						}
					}
				}
			}
			.navigationright {
				float: right;
				margin-right: 24px;
				font-size: 16px;
				ul {
					display: flex;
					text-align: center;
					line-height: 52px;

					li {
						cursor: pointer;
						a.titleactiveafter {
							font-size: 16px;
							font-weight: bold;
							color: #1890ff;
						}
						a:hover {
							color: #1890ff;
						}
						&:first-child {
							margin-right: 24px;
						}
					}
				}
			}

			.login {
				float: right;
				// width: 36px;
				line-height: 24px;
				.loginbtn {
					width: 70px;
				}
				.loginbtn {
					margin-top: 02px;
					button {
						width: 70px;
						height: 24px;
						font-size: 12px;
						margin-top: 5px;
						background-color: #fff;
						border: 1px solid #1890ff;
						line-height: 22px;
						border-radius: 999px;
						color: #1890ff;
						text-shadow: 2px 2px 4px 0px rgba(0, 0, 0, 0.05);
						&:hover {
							border-color: #1890ff;
							color: #1890ff;
						}
					}
				}
				.logined {
					// border-radius: 999px;
					overflow: hidden;
					border: 1px solid #fff;
					line-height: 38px;
					/*margin-top: 4px;*/
					font-size: 14px;
					cursor: default;
					&:hover {
						color: #1890ff;
					}
					// width: 24px;
					// height: 24px;
					img {
						width: 24px;
						height: 24px;
					}
					// span {
					// 	width: 36px;
					// 	height: 36px;
					// 	margin-top: 4px;
					// 	// margin-left: 33px;
					// 	border-radius: 999px;
					// 	// background-color: #1890ff;
					// 	margin-right: -3px;
					// 	text-align: center;
					// }

					// i {
					// 	font-size: 32px;
					// 	line-height: 30px;
					// 	color: #1890ff;
					// 	cursor: pointer;
					// 	&:hover {
					// 		color: #1890ff;
					// 	}
					// }
				}
			}
		}
	}
 
  .page-title-list-active{
		position: fixed;
		left: 0;
		top: 0;
		width: 100vw;
		z-index: 999999;
	}
 
	.fellowtownsman {
		// height: 641px;
		background: #ffffff;
		.w {
			padding: 30px 0;
			.title {
				font-size: 24px;
				text-align: left;
				color: #4d575e;
				line-height: 56px;
				h1 {
					span {
						display: inline-block;
						vertical-align: middle;
						margin-top: -4px;
						width: 4px;
						height: 25px;
						margin-right: 8px;
						background: #1890ff;
					}
				}
			}
			.main {
				display: flex;
				justify-content: start;
				margin-top: 30px;
				.jobinfobox {
					width: 288px;
					// height: 385px;
					margin-bottom: 16px;
					margin-right: 20px;
					background: #ffffff;
					border: 1px solid rgba(77, 87, 94, 0.1);
					border-radius: 4px;
					padding: 20px;
					.imgbox {
						position: relative;
						width: 248px;
						height: 186px;
						img {
							width: 100%;
							height: 100%;
						}
						span {
							position: absolute;
							padding: 0 10px;
							// width: 149px;
							height: 28px;
							left: 0;
							bottom: 0;
							background: #1890ff;
							border-radius: 16px 16px 16px 0px;
							font-size: 16px;
							text-align: center;
							color: #ffffff;
							line-height: 28px;
						}
					}
					.jobname {
						height: 52px;
						// margin: 12px 0;
						font-size: 20px;
						font-weight: normal;
						text-align: left;
						color: #4d575e;
						line-height: 52px;
						border-bottom: 1px solid #f2f0ec;
					}
					.jobinfo {
						margin-top: 11px;
						opacity: 0.5;
						font-size: 18px;
						text-align: left;
						color: #4d575e;
						line-height: 22px;
					}
					.jobtag {
						margin-top: 12px;
						text-align: left;
						span:first-child {
							color: #1890ff;
							background: rgba(254, 97, 0, 0.1);
						}
						span {
							margin-right: 8px;
							font-size: 16px;
							padding: 3px 8px;
							background: rgba(51, 51, 51, 0.06);
							border-radius: 4px;
						}
					}
					.jobprice {
						margin-top: 12px;
						font-size: 18px;
						font-weight: normal;
						text-align: left;
						color: #1890ff;
						line-height: 25px;
						span {
							font-size: 22px;
						}
					}
				}
			}
		}
	}
	.banner {
		height: 72px;
		margin-top: 20px;
		background-color: #1890ff;
		margin-bottom: -20px;
		.w {
			display: flex;
			height: 100%;
			justify-content: center;
			align-items: center;
			i {
				font-size: 32px;
				color: #fff;
			}
			img:last-child {
				width: 173px;
				height: 42px;
				margin-right: 110px;
			}
		}
		// background-color: black;
	}
	.footer_abs {
		position: absolute;
		left: 50%;
		bottom: 0;
		transform: translateX(-50%);
	}
	footer {
		padding: 40px 30px;
		margin-top: 20px;
		.w {
			ul {
				display: flex;
				justify-content: center;
				li {
					font-size: 16px;
					text-align: center;
					color: #4d575e;
					line-height: 25px;
				}
				li:nth-of-type(2n) {
					width: 1px;
					height: 20px;
					margin: 5px 54px;
					background-color: #4d575e;
				}
			}
			div {
				text-align: center;
				// margin-top: 16px;
				color: #4d575e;
				font-size: 12px;
				i {
					display: inline-block;
					vertical-align: middle;
					width: 1px;
					height: 16px;
					margin: 0 10px;
					background-color: #4d575e;
				}
			}
		}
	}
}
.loginbox {
	line-height: 36px;
	> div:first-child {
		display: flex;
		align-items: center;
		padding: 16px 0;
		img {
			width: 24px;
			height: 24px;
			margin-right: 8px;
		}
	}
	.username {
		max-width: 120px;
		display: block;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}
	.avatar {
		display: block;
		line-height: 24px;
		font-size: 24px !important;
		color: #1890ff;
		margin-right: 8px;
	}

	a {
		div {
			padding: 10px 0;
			align-items: center;
		}
	}
	button {
		line-height: 28px;
		&:hover {
			border-color: #1890ff;
		}
	}
}
.shadow:hover {
	cursor: default;
	// text-shadow: 4px 4px 4px #000;
	transform: scale(1.05);
	img {
		// box-shadow: 3px 3px 3px 3px #00000033;
	}
}
.f40 {
	/deep/ .ant-table {
		.ant-table-thead > tr > th .ant-table-column-sorter .ant-table-column-sorter-inner .ant-table-column-sorter-up.on,
		.ant-table-thead > tr > th .ant-table-column-sorter .ant-table-column-sorter-inner .ant-table-column-sorter-down.on {
			color: #1890ff;
		}
		.ant-table-thead > tr.ant-table-row-hover:not(.ant-table-expanded-row):not(.ant-table-row-selected) > td,
		.ant-table-tbody > tr.ant-table-row-hover:not(.ant-table-expanded-row):not(.ant-table-row-selected) > td,
		.ant-table-thead > tr:hover:not(.ant-table-expanded-row):not(.ant-table-row-selected) > td,
		.ant-table-tbody > tr:hover:not(.ant-table-expanded-row):not(.ant-table-row-selected) > td {
			background: #f4faff;
		}
		.ant-radio-checked .ant-radio-inner {
			border-color: #1890ff !important;
			box-shadow: none !important;
		}
		.ant-radio-checked .ant-radio-inner::after {
			background-color: #1890ff !important;
		}
		.ant-radio:hover .ant-radio-inner {
			border-color: #1890ff !important;
			box-shadow: none;
		}
		.ant-radio-checked .ant-radio-inner::after {
			background-color: #1890ff !important;
		}
		.ant-radio-checked:hover .ant-radio-inner {
			border-color: #1890ff !important;
		}
		.ant-radio {
			border-color: #ddd !important;
			box-shadow: none !important;
		}
		.ant-btn-primary:hover {
			border-color: #1890ff;
			background-color: #ff5416;
			color: #fff;
		}
		.ant-input:hover {
			border-color: #1890ff;
		}
	}
}

.user-box {
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background-color: transparent;
	text-align: center;
	line-height: 44px;
	margin-right: 12px !important;
	cursor: pointer;
	&:hover {
		background-color: #e5e5e5;
	}
	&:active {
		background-color: #d9d9d9;
	}
}
.fsa-box {
	padding: 1px 12px;
	background: transparent;
	border-radius: 4px;
	cursor: pointer;
	&:hover {
		background-color: #e5e5e5;
	}
	&:active {
		background-color: #d9d9d9;
	}
}
/deep/ .ant-dropdown {
	top: 68px !important;
}
.hover-blue {
	cursor: pointer;
	&:hover {
		background-color: #f5f5f5;
	}
}

.more-team {
	.more-team-button {
		height: 32px;
		margin-right: 16px;
		border-radius: 4px;
		cursor: pointer;
		border: 1px solid #ddd;
		&:hover {
			.hover-f40 {
				color: #1890ff;
			}
		}
	}

	.more-team-drop {
		padding: 6px;
		background: #fff;
		border-radius: 4px;
	}
}
/deep/.setPosition {
	padding: 4px;
	left: -240px !important;
	border-radius: 4px;
	background-color: #fff;
	box-shadow: 0px 2px 4px 0px rgba(229, 229, 229, 0.5), 0px 4px 12px 0px rgba(0, 0, 0, 0.15);
}
.logo {
	width: 16px;
	height: 16px;
	text-align: center;
	line-height: 16px;
	color: #fff;
	font-size: 10px;
	background: #ff6a00;
	border-radius: 2px;
	margin-right: 8px;
}
</style>