|
@@ -0,0 +1,702 @@
|
|
|
|
+<template>
|
|
|
|
+ <div id="background">
|
|
|
|
+ <div id="topBox">
|
|
|
|
+ <img src="./img/定位.png" />
|
|
|
|
+ <el-cascader v-model="selectedOptions" :options="options" @change="addressChoose" placeholder="请选择地区" />
|
|
|
|
+ <div id="searchInp">
|
|
|
|
+ <input @keyup.enter.native="search" type="search" v-model="parmas.introduction" />
|
|
|
|
+ <span @click="search" id="searchButton" placeholder="请输入关键字">搜索</span>
|
|
|
|
+ </div>
|
|
|
|
+ <div class="categoryBox">
|
|
|
|
+ <span>家政分类</span>
|
|
|
|
+
|
|
|
|
+ <div class="catagoryList">
|
|
|
|
+ <div class="categoryItem" v-for="(item, i) in category">
|
|
|
|
+ <span tabindex="i" @click="selectCategory($event)">{{ item.name }}</span>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ <el-button @click.native="resetPage" native-type="reset" id="resetButton" class="cancelBtn"
|
|
|
|
+ round="true">重置</el-button>
|
|
|
|
+ <br />
|
|
|
|
+ <span id="salaryRank">薪酬(次/元)</span>
|
|
|
|
+ <div class="catagoryList">
|
|
|
|
+ <div class="categoryItem" v-for="(item, i) in salaryList">
|
|
|
|
+ <span @click="selectSalary($event)">{{ item }}</span>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ <label>薪酬排序</label>
|
|
|
|
+ <label ref="up" @click="upSalary">升序</label>
|
|
|
|
+ <label ref="down" @click="downSalary">降序</label>
|
|
|
|
+ </div>
|
|
|
|
+ <div id="bottom">
|
|
|
|
+ <span>聘请类别</span>
|
|
|
|
+ <label>长期工</label>
|
|
|
|
+ <input @click="convertServerType('1')" v-model="isLong" type="radio" name="serverType" value="1">
|
|
|
|
+ <label>短期工</label>
|
|
|
|
+ <input @click="convertServerType('2')" v-model="isLong" type="radio" name="serverType" value="2" />
|
|
|
|
+ <span>是否住家</span>
|
|
|
|
+ <label>住家</label>
|
|
|
|
+ <input @click="isStay('1')" v-model="isHome" value="1" type="radio" name="stay" />
|
|
|
|
+ <label>不住家</label>
|
|
|
|
+ <input @click="isStay('2')" v-model="isHome" value="2" type="radio" name="stay" />
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+</template>
|
|
|
|
+<script>
|
|
|
|
+import { categoryListApi, searchByIntroduction, searchServerWithNoCondition } from "@/api";
|
|
|
|
+import {
|
|
|
|
+ regionDataPlus,
|
|
|
|
+ CodeToText,
|
|
|
|
+} from "element-china-area-data";
|
|
|
|
+import { searchServer } from "@/api";
|
|
|
|
+import { mapGetters, mapMutations, mapState } from "vuex";
|
|
|
|
+export default {
|
|
|
|
+ name: "searchBox",
|
|
|
|
+ data() {
|
|
|
|
+ return {
|
|
|
|
+ category: [],
|
|
|
|
+ searchFlag: 0,
|
|
|
|
+ serverType: "0",
|
|
|
|
+ stay: '0',
|
|
|
|
+ isHome: null,
|
|
|
|
+ isLong: null,
|
|
|
|
+ homeClick: null,
|
|
|
|
+ content: [],
|
|
|
|
+ options: regionDataPlus,
|
|
|
|
+ selectedOptions: [],
|
|
|
|
+ serveArea: "",
|
|
|
|
+ salaryList: ["不限", "100以下", "100-300", "300-500", "500以上"],
|
|
|
|
+ parmas: {
|
|
|
|
+ pageNum: 1,
|
|
|
|
+ pageSize: 3,
|
|
|
|
+ nickName: "",
|
|
|
|
+ salaryOrder: 0,
|
|
|
|
+ categoryName: "不限",
|
|
|
|
+ salary: '0',
|
|
|
|
+ stay: '0',
|
|
|
|
+ // 表示家政人员
|
|
|
|
+ userType: 1,
|
|
|
|
+ workArea: "",
|
|
|
|
+ // 长期工or短期工
|
|
|
|
+ serverType: '',
|
|
|
|
+ introduction: ''
|
|
|
|
+ },
|
|
|
|
+ };
|
|
|
|
+ },
|
|
|
|
+ computed: {
|
|
|
|
+ ...mapState("SearchStore", ["searchList", "isByCondition"]),
|
|
|
|
+ ...mapGetters("SearchStore", ["getPageNum", "getTotal", "getPageSize"]),
|
|
|
|
+ },
|
|
|
|
+ created() {
|
|
|
|
+ // 家政分类
|
|
|
|
+ categoryListApi().then((response) => {
|
|
|
|
+ if (response.data.code === 200) {
|
|
|
|
+ this.category = response.data.data;
|
|
|
|
+ }
|
|
|
|
+ });
|
|
|
|
+ },
|
|
|
|
+ // 监控页码变化
|
|
|
|
+ watch: {
|
|
|
|
+ getPageNum(newVal, oldVal) {
|
|
|
|
+ if (!localStorage.getItem("token") || localStorage.getItem("token") === '') {
|
|
|
|
+ alert("请先登录")
|
|
|
|
+ return
|
|
|
|
+ }
|
|
|
|
+ if (this.isByCondition === false && this.searchFlag === 0) {
|
|
|
|
+ let params = {
|
|
|
|
+ pageNum: newVal,
|
|
|
|
+ pageSize: this.getPageSize
|
|
|
|
+ }
|
|
|
|
+ searchServerWithNoCondition(params).then((response) => {
|
|
|
|
+ if (response.data.code === 200) {
|
|
|
|
+ this.content = response.data.data.rows;
|
|
|
|
+ this.count = response.data.data.total;
|
|
|
|
+ this.content.forEach(e => {
|
|
|
|
+ // 渲染serverArea
|
|
|
|
+ if (e.serverArea.substring(0, 2) === '全部') {
|
|
|
|
+ e.serverArea = e.serverArea = '全国范围内'
|
|
|
|
+ } else {
|
|
|
|
+ e.serverArea = e.serverArea.replace('全部', '内')
|
|
|
|
+ e.serverArea = e.serverArea.replace('undefined', '')
|
|
|
|
+ }
|
|
|
|
+ })
|
|
|
|
+ this.setTotal(this.count);
|
|
|
|
+ this.setList(this.content);
|
|
|
|
+ }
|
|
|
|
+ });
|
|
|
|
+ } else if (this.isByCondition === true && this.searchFlag === 0) {
|
|
|
|
+ this.parmas.pageNum = newVal
|
|
|
|
+ this.setParmas(this.parmas);
|
|
|
|
+ searchServer(this.parmas).then((response) => {
|
|
|
|
+ if (response.data.code === 200) {
|
|
|
|
+ this.content = response.data.data.rows;
|
|
|
|
+ this.content.forEach(e => {
|
|
|
|
+ e.serverArea = e.workArea
|
|
|
|
+ })
|
|
|
|
+ this.content.forEach(e => {
|
|
|
|
+ // 渲染serverArea
|
|
|
|
+ if (e.serverArea.substring(0, 2) === '全部') {
|
|
|
|
+ e.serverArea = e.serverArea = '全国范围内'
|
|
|
|
+ } else {
|
|
|
|
+ e.serverArea = e.serverArea.replace('全部', '内')
|
|
|
|
+ e.serverArea = e.serverArea.replace('undefined', '')
|
|
|
|
+ }
|
|
|
|
+ })
|
|
|
|
+ this.setTotal(response.data.data.total);
|
|
|
|
+ this.setList(this.content);
|
|
|
|
+ }
|
|
|
|
+ });
|
|
|
|
+ } else if (this.searchFlag === 1 && this.isByCondition === true) {
|
|
|
|
+ let param = {
|
|
|
|
+ introduction: this.parmas.introduction,
|
|
|
|
+ pageSize: this.parmas.pageSize,
|
|
|
|
+ pageNum: this.parmas.pageNum
|
|
|
|
+ }
|
|
|
|
+ searchByIntroduction(param).then((response) => {
|
|
|
|
+ if (response.data.code == 200) {
|
|
|
|
+ this.content = response.data.data.rows;
|
|
|
|
+ this.setTotal(response.data.data.total);
|
|
|
|
+ this.setList(this.content);
|
|
|
|
+ }
|
|
|
|
+ });
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ getPageSize(newVal, oldVal) {
|
|
|
|
+ if (!localStorage.getItem("token") || localStorage.getItem("token") === '') {
|
|
|
|
+ alert("请先登录")
|
|
|
|
+ return
|
|
|
|
+ }
|
|
|
|
+ let params = {
|
|
|
|
+ pageNum: this.getPageNum,
|
|
|
|
+ pageSize: newVal
|
|
|
|
+ }
|
|
|
|
+ searchServerWithNoCondition(params).then((response) => {
|
|
|
|
+ if (response.data.code === 200) {
|
|
|
|
+ this.content = response.data.data.rows;
|
|
|
|
+ this.content.forEach(e => {
|
|
|
|
+ // 渲染serverArea
|
|
|
|
+ if (e.serverArea.substring(0, 2) === '全部') {
|
|
|
|
+ e.serverArea = e.serverArea = '全国范围内'
|
|
|
|
+ } else {
|
|
|
|
+ e.serverArea = e.serverArea.replace('全部', '内')
|
|
|
|
+ e.serverArea = e.serverArea.replace('undefined', '')
|
|
|
|
+ }
|
|
|
|
+ })
|
|
|
|
+ this.count = response.data.data.total;
|
|
|
|
+ this.setTotal(this.count);
|
|
|
|
+ this.setList(this.content);
|
|
|
|
+ }
|
|
|
|
+ });
|
|
|
|
+ this.parmas.pageNum = newVal
|
|
|
|
+ this.setParmas(this.parmas);
|
|
|
|
+ searchServer(this.parmas).then((response) => {
|
|
|
|
+ if (response.data.code === 200) {
|
|
|
|
+ this.content = response.data.data.rows;
|
|
|
|
+ this.content.forEach(e => {
|
|
|
|
+ e.serverArea = e.workArea
|
|
|
|
+ })
|
|
|
|
+ this.content.forEach(e => {
|
|
|
|
+ // 渲染serverArea
|
|
|
|
+ if (e.serverArea.substring(0, 2) === '全部') {
|
|
|
|
+ e.serverArea = e.serverArea = '全国范围内'
|
|
|
|
+ } else {
|
|
|
|
+ e.serverArea = e.serverArea.replace('全部', '内')
|
|
|
|
+ e.serverArea = e.serverArea.replace('undefined', '')
|
|
|
|
+ }
|
|
|
|
+ })
|
|
|
|
+ this.setTotal(response.data.data.total);
|
|
|
|
+ this.setList(this.content);
|
|
|
|
+ }
|
|
|
|
+ });
|
|
|
|
+ },
|
|
|
|
+ },
|
|
|
|
+ methods: {
|
|
|
|
+ ...mapMutations("SearchStore", ["setParmas", "setList", "setTotal"]),
|
|
|
|
+ ...mapMutations("SearchStore", ["convertParmas", "changePageNum", "changePageSize", "changeIsByCondition"]),
|
|
|
|
+ ...mapGetters("SearchStore", ["getParmas"]),
|
|
|
|
+ // 选择分类
|
|
|
|
+ selectCategory(e) {
|
|
|
|
+ for (
|
|
|
|
+ var i = 0;
|
|
|
|
+ i < e.currentTarget.parentNode.parentNode.children.length;
|
|
|
|
+ i++
|
|
|
|
+ ) {
|
|
|
|
+ e.currentTarget.parentNode.parentNode.children[i].children[0].className = null;
|
|
|
|
+ }
|
|
|
|
+ e.currentTarget.className = "activeSpan";
|
|
|
|
+ if (!localStorage.getItem("token") || localStorage.getItem("token") === '') {
|
|
|
|
+ alert("请先登录")
|
|
|
|
+ return
|
|
|
|
+ }
|
|
|
|
+ var value = e.currentTarget.textContent;
|
|
|
|
+ this.parmas.categoryName = value;
|
|
|
|
+ this.setParmas(this.parmas);
|
|
|
|
+ this.changeIsByCondition(true)
|
|
|
|
+ searchServer(this.parmas).then((response) => {
|
|
|
|
+ if (response.data.code === 200) {
|
|
|
|
+ this.content = response.data.data.rows;
|
|
|
|
+ this.content.forEach(e => {
|
|
|
|
+ e.serverArea = e.workArea
|
|
|
|
+ })
|
|
|
|
+ this.content.forEach(e => {
|
|
|
|
+ // 渲染serverArea
|
|
|
|
+ if (e.serverArea.substring(0, 2) === '全部') {
|
|
|
|
+ e.serverArea = e.serverArea = '全国范围内'
|
|
|
|
+ } else {
|
|
|
|
+ e.serverArea = e.serverArea.replace('全部', '内')
|
|
|
|
+ e.serverArea = e.serverArea.replace('undefined', '')
|
|
|
|
+ }
|
|
|
|
+ })
|
|
|
|
+ this.setTotal(response.data.data.total);
|
|
|
|
+ this.setList(this.content);
|
|
|
|
+ }
|
|
|
|
+ });
|
|
|
|
+ },
|
|
|
|
+ selectSalary(e) {
|
|
|
|
+ for (
|
|
|
|
+ var i = 0;
|
|
|
|
+ i < e.currentTarget.parentNode.parentNode.children.length;
|
|
|
|
+ i++
|
|
|
|
+ ) {
|
|
|
|
+ e.currentTarget.parentNode.parentNode.children[
|
|
|
|
+ i
|
|
|
|
+ ].children[0].className = null;
|
|
|
|
+ }
|
|
|
|
+ e.currentTarget.className = "activeSpan";
|
|
|
|
+ var value = e.currentTarget.textContent;
|
|
|
|
+ if (!localStorage.getItem("token") || localStorage.getItem("token") === '') {
|
|
|
|
+ alert("请先登录")
|
|
|
|
+ return
|
|
|
|
+ }
|
|
|
|
+ if (value == "100以下") value = '1';
|
|
|
|
+ else if (value == "100-300") value = '2';
|
|
|
|
+ else if (value == "300-500") value = '3';
|
|
|
|
+ else if (value == "500以上") value = '4';
|
|
|
|
+ else if (value == "不限") value = '0';
|
|
|
|
+ this.parmas.salary = value;
|
|
|
|
+ this.setParmas(this.parmas);
|
|
|
|
+ this.changeIsByCondition(true)
|
|
|
|
+ searchServer(this.parmas).then((response) => {
|
|
|
|
+ if (response.data.code == 200) {
|
|
|
|
+ this.setTotal(response.data.data.total);
|
|
|
|
+ this.content = response.data.data.rows;
|
|
|
|
+ this.content.forEach(e => {
|
|
|
|
+ e.serverArea = e.workArea
|
|
|
|
+ })
|
|
|
|
+ this.content.forEach(e => {
|
|
|
|
+ // 渲染serverArea
|
|
|
|
+ if (e.serverArea.substring(0, 2) === '全部') {
|
|
|
|
+ e.serverArea = e.serverArea = '全国范围内'
|
|
|
|
+ } else {
|
|
|
|
+ e.serverArea = e.serverArea.replace('全部', '内')
|
|
|
|
+ e.serverArea = e.serverArea.replace('undefined', '')
|
|
|
|
+ }
|
|
|
|
+ })
|
|
|
|
+ this.setList(this.content);
|
|
|
|
+ }
|
|
|
|
+ });
|
|
|
|
+ },
|
|
|
|
+ upSalary() {
|
|
|
|
+ this.$refs.down.style.color = "black";
|
|
|
|
+ this.$refs.up.style.color = "#446AB0";
|
|
|
|
+ if (!localStorage.getItem("token") || localStorage.getItem("token") === '') {
|
|
|
|
+ alert("请先登录")
|
|
|
|
+ return
|
|
|
|
+ }
|
|
|
|
+ this.parmas.salaryOrder = 1;
|
|
|
|
+ this.setParmas(this.parmas);
|
|
|
|
+ this.changeIsByCondition(true)
|
|
|
|
+ searchServer(this.parmas).then((response) => {
|
|
|
|
+ if (response.data.code == 200) {
|
|
|
|
+ this.content = response.data.data.rows;
|
|
|
|
+ this.content.forEach(e => {
|
|
|
|
+ e.serverArea = e.workArea
|
|
|
|
+ })
|
|
|
|
+ this.content.forEach(e => {
|
|
|
|
+ // 渲染serverArea
|
|
|
|
+ if (e.serverArea.substring(0, 2) === '全部') {
|
|
|
|
+ e.serverArea = e.serverArea = '全国范围内'
|
|
|
|
+ } else {
|
|
|
|
+ e.serverArea = e.serverArea.replace('全部', '内')
|
|
|
|
+ e.serverArea = e.serverArea.replace('undefined', '')
|
|
|
|
+ }
|
|
|
|
+ })
|
|
|
|
+ this.setList(this.content);
|
|
|
|
+ this.setTotal(response.data.data.total);
|
|
|
|
+ }
|
|
|
|
+ });
|
|
|
|
+ },
|
|
|
|
+ downSalary() {
|
|
|
|
+ this.$refs.up.style.color = "black";
|
|
|
|
+ this.$refs.down.style.color = "#446AB0";
|
|
|
|
+ if (!localStorage.getItem("token") || localStorage.getItem("token") === '') {
|
|
|
|
+ alert("请先登录")
|
|
|
|
+ return
|
|
|
|
+ }
|
|
|
|
+ this.parmas.salaryOrder = 2;
|
|
|
|
+ this.setParmas(this.parmas);
|
|
|
|
+ this.changeIsByCondition(true)
|
|
|
|
+ searchServer(this.parmas).then((response) => {
|
|
|
|
+ if (response.data.code == 200) {
|
|
|
|
+ this.content = response.data.data.rows;
|
|
|
|
+ this.content.forEach(e => {
|
|
|
|
+ e.serverArea = e.workArea
|
|
|
|
+ })
|
|
|
|
+ this.content.forEach(e => {
|
|
|
|
+ // 渲染serverArea
|
|
|
|
+ if (e.serverArea.substring(0, 2) === '全部') {
|
|
|
|
+ e.serverArea = e.serverArea = '全国范围内'
|
|
|
|
+ } else {
|
|
|
|
+ e.serverArea = e.serverArea.replace('全部', '内')
|
|
|
|
+ e.serverArea = e.serverArea.replace('undefined', '')
|
|
|
|
+ }
|
|
|
|
+ })
|
|
|
|
+ this.setTotal(response.data.data.total);
|
|
|
|
+ this.setList(this.content);
|
|
|
|
+ }
|
|
|
|
+ });
|
|
|
|
+ },
|
|
|
|
+ //长期工 短期工
|
|
|
|
+ convertServerType(i) {
|
|
|
|
+ if (!localStorage.getItem("token") || localStorage.getItem("token") === '') {
|
|
|
|
+ alert("请先登录")
|
|
|
|
+ return
|
|
|
|
+ }
|
|
|
|
+ this.parmas.serverType = i
|
|
|
|
+ this.setParmas(this.parmas);
|
|
|
|
+ this.changeIsByCondition(true)
|
|
|
|
+ searchServer(this.parmas).then((response) => {
|
|
|
|
+ if (response.data.code === 200) {
|
|
|
|
+ this.content = response.data.data.rows;
|
|
|
|
+ this.content.forEach(e => {
|
|
|
|
+ e.serverArea = e.workArea
|
|
|
|
+ })
|
|
|
|
+ this.content.forEach(e => {
|
|
|
|
+ // 渲染serverArea
|
|
|
|
+ if (e.serverArea.substring(0, 2) === '全部') {
|
|
|
|
+ e.serverArea = e.serverArea = '全国范围内'
|
|
|
|
+ } else {
|
|
|
|
+ e.serverArea = e.serverArea.replace('全部', '内')
|
|
|
|
+ e.serverArea = e.serverArea.replace('undefined', '')
|
|
|
|
+ }
|
|
|
|
+ })
|
|
|
|
+ this.setTotal(response.data.data.total);
|
|
|
|
+ this.setList(this.content);
|
|
|
|
+ }
|
|
|
|
+ });
|
|
|
|
+ },
|
|
|
|
+ isStay(i) {
|
|
|
|
+ this.parmas.stay = i;
|
|
|
|
+
|
|
|
|
+ if (!localStorage.getItem("token") || localStorage.getItem("token") === '') {
|
|
|
|
+ alert("请先登录")
|
|
|
|
+ return
|
|
|
|
+ }
|
|
|
|
+ this.setParmas(this.parmas);
|
|
|
|
+ this.changeIsByCondition(true)
|
|
|
|
+ searchServer(this.parmas).then((response) => {
|
|
|
|
+ if (response.data.code == 200) {
|
|
|
|
+ this.content = response.data.data.rows;
|
|
|
|
+ this.content.forEach(e => {
|
|
|
|
+ e.serverArea = e.workArea
|
|
|
|
+ })
|
|
|
|
+ this.content.forEach(e => {
|
|
|
|
+ // 渲染serverArea
|
|
|
|
+ if (e.serverArea.substring(0, 2) === '全部') {
|
|
|
|
+ e.serverArea = e.serverArea = '全国范围内'
|
|
|
|
+ } else {
|
|
|
|
+ e.serverArea = e.serverArea.replace('全部', '内')
|
|
|
|
+ e.serverArea = e.serverArea.replace('undefined', '')
|
|
|
|
+ }
|
|
|
|
+ })
|
|
|
|
+ this.setTotal(response.data.data.total);
|
|
|
|
+ this.setList(this.content);
|
|
|
|
+ }
|
|
|
|
+ });
|
|
|
|
+ },
|
|
|
|
+ addressChoose(value) {
|
|
|
|
+ if (!localStorage.getItem("token") === undefined || localStorage.getItem("token") === '') {
|
|
|
|
+ alert("请先登录")
|
|
|
|
+ return
|
|
|
|
+ }
|
|
|
|
+ this.serveArea =
|
|
|
|
+ CodeToText[value[0]] + CodeToText[value[1]] + CodeToText[value[2]];
|
|
|
|
+ var a =
|
|
|
|
+ CodeToText[value[0]] + CodeToText[value[1]] + CodeToText[value[2]];
|
|
|
|
+ if (a == "全部undefinedundefined") a = "";
|
|
|
|
+ this.parmas.workArea = a;
|
|
|
|
+ this.setParmas(this.parmas);
|
|
|
|
+ this.changeIsByCondition(true)
|
|
|
|
+ searchServer(this.parmas).then((response) => {
|
|
|
|
+ if (response.data.code == 200) {
|
|
|
|
+ this.content = response.data.data.rows;
|
|
|
|
+ this.content.forEach(e => {
|
|
|
|
+ e.serverArea = e.workArea
|
|
|
|
+ })
|
|
|
|
+ this.content.forEach(e => {
|
|
|
|
+ // 渲染serverArea
|
|
|
|
+ if (e.serverArea.substring(0, 2) === '全部') {
|
|
|
|
+ e.serverArea = e.serverArea = '全国范围内'
|
|
|
|
+ } else {
|
|
|
|
+ e.serverArea = e.serverArea.replace('全部', '内')
|
|
|
|
+ e.serverArea = e.serverArea.replace('undefined', '')
|
|
|
|
+ }
|
|
|
|
+ })
|
|
|
|
+ this.setTotal(response.data.data.total);
|
|
|
|
+ this.setList(this.content);
|
|
|
|
+ }
|
|
|
|
+ });
|
|
|
|
+ },
|
|
|
|
+ //搜索家政人员
|
|
|
|
+ search() {
|
|
|
|
+ if (!localStorage.getItem("token") === undefined || localStorage.getItem("token") === '') {
|
|
|
|
+ alert("请先登录")
|
|
|
|
+ return
|
|
|
|
+ }
|
|
|
|
+ this.searchFlag = 1
|
|
|
|
+ this.setParmas(this.parmas);
|
|
|
|
+ let param = {
|
|
|
|
+ introduction: this.parmas.introduction,
|
|
|
|
+ pageSize: this.parmas.pageSize,
|
|
|
|
+ pageNum: this.parmas.pageNum
|
|
|
|
+ }
|
|
|
|
+ this.changeIsByCondition(true)
|
|
|
|
+ searchByIntroduction(param).then((response) => {
|
|
|
|
+ if (response.data.code == 200) {
|
|
|
|
+ this.content = response.data.data.rows;
|
|
|
|
+ this.setTotal(response.data.data.total);
|
|
|
|
+ this.setList(this.content);
|
|
|
|
+ }
|
|
|
|
+ });
|
|
|
|
+ },
|
|
|
|
+ // 重置选择
|
|
|
|
+ resetPage() {
|
|
|
|
+ this.parmas = {
|
|
|
|
+ pageNum: 1,
|
|
|
|
+ pageSize: 3,
|
|
|
|
+ nickName: "",
|
|
|
|
+ salaryOrder: 0,
|
|
|
|
+ categoryName: "不限",
|
|
|
|
+ salary: '0',
|
|
|
|
+ stay: '0',
|
|
|
|
+ userType: 1,
|
|
|
|
+ workArea: "",
|
|
|
|
+ serverType: "",
|
|
|
|
+ introduction: ''
|
|
|
|
+ }
|
|
|
|
+ this.selectedOptions = []
|
|
|
|
+ this.$refs.down.style.color = "black";
|
|
|
|
+ this.$refs.up.style.color = "black";
|
|
|
|
+ this.isLong = null
|
|
|
|
+ this.isHome = null
|
|
|
|
+ this.searchFlag = 0
|
|
|
|
+ const activeElements = document.querySelectorAll('.activeSpan');
|
|
|
|
+ for (const element of activeElements) {
|
|
|
|
+ element.classList.remove('activeSpan');
|
|
|
|
+ }
|
|
|
|
+ this.setParmas(this.parmas)
|
|
|
|
+ this.changeIsByCondition(false)
|
|
|
|
+ this.changePageNum(this.parmas.pageNum)
|
|
|
|
+ this.changePageSize(this.parmas.pageSize)
|
|
|
|
+ let params = {
|
|
|
|
+ pageNum: this.getPageNum,
|
|
|
|
+ pageSize: this.getPageSize
|
|
|
|
+ }
|
|
|
|
+ searchServerWithNoCondition(params).then((response) => {
|
|
|
|
+ if (response.data.code === 200) {
|
|
|
|
+ this.content = response.data.data.rows;
|
|
|
|
+ this.count = response.data.data.total;
|
|
|
|
+ this.content.forEach(e => {
|
|
|
|
+ // 渲染serverArea
|
|
|
|
+ if (e.serverArea.substring(0, 2) === '全部') {
|
|
|
|
+ e.serverArea = e.serverArea = '全国范围内'
|
|
|
|
+ } else {
|
|
|
|
+ e.serverArea = e.serverArea.replace('全部', '内')
|
|
|
|
+ e.serverArea = e.serverArea.replace('undefined', '')
|
|
|
|
+ }
|
|
|
|
+ })
|
|
|
|
+ this.setTotal(this.count);
|
|
|
|
+ this.setList(this.content);
|
|
|
|
+ }
|
|
|
|
+ });
|
|
|
|
+ },
|
|
|
|
+ },
|
|
|
|
+};
|
|
|
|
+</script>
|
|
|
|
+
|
|
|
|
+<style scoped>
|
|
|
|
+.cancelBtn {
|
|
|
|
+ color: black;
|
|
|
|
+ background-color: #f5f5f5;
|
|
|
|
+ margin-left: 20px;
|
|
|
|
+ border: 2px;
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+#topBox {
|
|
|
|
+ text-align: left;
|
|
|
|
+ margin: 0 auto;
|
|
|
|
+ margin-left: 4rem;
|
|
|
|
+ background-color: rgb(255, 255, 255);
|
|
|
|
+ width: 93%;
|
|
|
|
+ position: relative;
|
|
|
|
+ top: 5rem;
|
|
|
|
+ padding-bottom: 1rem;
|
|
|
|
+ border-radius: 1rem;
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+#background {
|
|
|
|
+ width: 100%;
|
|
|
|
+ margin-top: -1rem;
|
|
|
|
+ margin: 0 auto;
|
|
|
|
+ /* background-color: rgb(237, 244, 237); */
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+/* 地标图片 */
|
|
|
|
+#topBox img {
|
|
|
|
+ display: inline-block;
|
|
|
|
+ height: 1.8rem;
|
|
|
|
+ width: auto;
|
|
|
|
+ margin-top: 1.6rem;
|
|
|
|
+ margin-left: 7.8rem;
|
|
|
|
+ margin-right: 0.5rem;
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+/* 地区选择器 */
|
|
|
|
+::v-deep .el-cascader {
|
|
|
|
+ --el-cascader-menu-text-color: var(--el-text-color-regular);
|
|
|
|
+ --el-cascader-menu-selected-text-color: var(--el-color-primary);
|
|
|
|
+ --el-cascader-menu-fill: var(--el-bg-color-overlay);
|
|
|
|
+ --el-cascader-menu-font-size: var(--el-font-size-base);
|
|
|
|
+ --el-cascader-menu-radius: var(--el-border-radius-base);
|
|
|
|
+ --el-cascader-menu-border: solid 1px var(--el-border-color-light);
|
|
|
|
+ --el-cascader-menu-shadow: var(--el-box-shadow-light);
|
|
|
|
+ --el-cascader-node-background-hover: var(--el-fill-color-light);
|
|
|
|
+ --el-cascader-node-color-disabled: var(--el-text-color-placeholder);
|
|
|
|
+ --el-cascader-color-empty: var(--el-text-color-placeholder);
|
|
|
|
+ --el-cascader-tag-background: var(--el-fill-color);
|
|
|
|
+ display: inline-block;
|
|
|
|
+ vertical-align: middle;
|
|
|
|
+ position: absolute;
|
|
|
|
+ top: 1.25rem;
|
|
|
|
+ left: 9.8rem;
|
|
|
|
+ font-size: var(--el-font-size-base);
|
|
|
|
+ line-height: 32px;
|
|
|
|
+ outline: 0;
|
|
|
|
+ width: 175px;
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+/* 搜素框 */
|
|
|
|
+#searchInp {
|
|
|
|
+ text-align: center;
|
|
|
|
+ display: inline-block;
|
|
|
|
+ width: 62%;
|
|
|
|
+ height: 3rem;
|
|
|
|
+ background-color: #5fb49e;
|
|
|
|
+ position: absolute;
|
|
|
|
+ left: 24rem;
|
|
|
|
+ top: 1rem;
|
|
|
|
+ border-radius: 0.7rem;
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+#searchButton {
|
|
|
|
+ cursor: pointer;
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+#searchInp input {
|
|
|
|
+ height: 2.5rem;
|
|
|
|
+ margin-top: 0.2rem;
|
|
|
|
+ width: 92%;
|
|
|
|
+ border-radius: 1rem;
|
|
|
|
+ margin-left: 0rem;
|
|
|
|
+ margin-right: 1rem;
|
|
|
|
+ border: 0;
|
|
|
|
+ padding-left: 1rem;
|
|
|
|
+ outline: none;
|
|
|
|
+ font-size: small;
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+#searchInp span {
|
|
|
|
+ color: white;
|
|
|
|
+
|
|
|
|
+ font-weight: 600;
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+/* 家政分类 */
|
|
|
|
+.catagoryList {
|
|
|
|
+ margin-top: 1.5rem;
|
|
|
|
+ display: inline-block;
|
|
|
|
+ background-color: #f5f5f5;
|
|
|
|
+ box-sizing: border-box;
|
|
|
|
+ border-radius: 1rem;
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+.categoryItem {
|
|
|
|
+ display: inline-block;
|
|
|
|
+ box-sizing: border-box;
|
|
|
|
+ margin-top: 1rem;
|
|
|
|
+ margin-bottom: 1rem;
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+.categoryBox span {
|
|
|
|
+ font-weight: bold;
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+.categoryBox>span {
|
|
|
|
+ margin-top: 1rem;
|
|
|
|
+ margin-left: 8rem;
|
|
|
|
+ margin-right: 4rem;
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+.categoryItem span {
|
|
|
|
+ display: inline-block;
|
|
|
|
+ box-sizing: border-box;
|
|
|
|
+ cursor: pointer;
|
|
|
|
+ margin-right: 2.7rem;
|
|
|
|
+ margin-left: 2.7rem;
|
|
|
|
+ border-radius: 0.5rem;
|
|
|
|
+ padding: 0.5rem;
|
|
|
|
+ padding-top: 0.1rem;
|
|
|
|
+ padding-bottom: 0.1rem;
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+.activeSpan {
|
|
|
|
+ background-color: #55b084;
|
|
|
|
+ color: white;
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+.categoryBox label {
|
|
|
|
+ font-weight: bold;
|
|
|
|
+ margin-left: 2.5rem;
|
|
|
|
+
|
|
|
|
+ cursor: pointer;
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+#salaryRank {
|
|
|
|
+ margin-right: 3rem;
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+/* 长期工等的选择 */
|
|
|
|
+#bottom {
|
|
|
|
+ margin-top: 1rem;
|
|
|
|
+ margin-bottom: 1rem;
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+#bottom span {
|
|
|
|
+ vertical-align: middle;
|
|
|
|
+
|
|
|
|
+ margin-left: 19rem;
|
|
|
|
+ margin-right: 2rem;
|
|
|
|
+ font-weight: bold;
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+#bottom label {
|
|
|
|
+ font-weight: 600;
|
|
|
|
+ vertical-align: middle;
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+#bottom input {
|
|
|
|
+ margin-right: 1rem;
|
|
|
|
+ vertical-align: middle;
|
|
|
|
+}
|
|
|
|
+</style>
|