proginn-frontend/components/kaifain/dealSeoIndex.js

export default class DealSeoData {
  constructor({
    $axios,
    req,
    app,
    redirect,
    error
  }) {
    this.$axios = $axios
    this.req = req
    this.app = app
    this.redirect = redirect
    this.error = error
    this.selected = {
      city: 0,
      industry: 0,
      techType: 0,
    }
    this.page = {
      page: 1,
      size: 10,
      total: 0,
      keyword: ''
    }
    this.finished = false
    this.dataList = []
    this.provinces = []
  }

  async dealData() {
    let {
      name,
      query: {
        page = 1,
        keyword = ''
      },
      path,
      params,
      fullPath
    } = this.app.context.route
    this.page.page = page
    this.page.keyword = keyword
    // if (path && path[path.length-1] !== '/') {
    //   let reditUrl = fullPath
    //   reditUrl = reditUrl.replace(path, path+'/')
    //   this.redirect(301, reditUrl)
    // }
    let isSeoList = false
    let typeList = await this.getTypeList()
    switch (name) {
      case "kaifainSeoAll":
        //kaifain/s页面进入
        isSeoList = true
        break
      case "kaifainSeoIndex":
        //kaifain路由匹配进入
        try {
          let match = params.pathMatch || ''
          let list = match.split('/').map(item => item.toLocaleLowerCase())
          list.length = Math.min(list.length, 3) //防止url超出
          list.filter(item => !!item)
          let urlCheck = ""
          let keys = Object.keys(typeList)
          //3 * 3 * n的循环 n < 100
          list.forEach(item => {
            keys.forEach(keys => {
              typeList[keys].list.forEach(typeItem => {
                if (typeItem.slug === item) {
                  urlCheck += item
                  this.selected[keys] = typeItem.id
                  this.selected[keys + 'Name'] = typeItem.name
                  this.selected[keys + 'Slug'] = typeItem.slug
                  if (keys === 'city') {
                    this.selected["provice"] = typeItem.prov_id
                  }
                }
              })
            })
          })
          if (urlCheck !== list.join("")) {
            this.error({
              statusCode: 404,
              message: "您要访问的页面不存在"
            })
            return
          }

          if (this.selected["provice"]) {
            let item = this.provinces.filter(item => item.id === this.selected["provice"])[0]
            this.selected["proviceName"] = item && item.name
          }
        } catch (e) {
          console.log("解决方案列表", e)
        }
        break
      default:
        //其他
        page = 1
    }
    await this.getList()
    return {
      typeList,
      isSeoList, //是否是 /kaifain/s/页面进入
      dataList: this.dataList, //首次获取的数据
      mobile: this.app.$deviceType.isMobile(),
      selected: this.selected,
      page: this.page,
      finished: this.finished,
      head: this.dealThisMeta(isSeoList),
    }
  }

  async getTypeList() {
    let res = await this.$axios.get('/api/kaifawu/get_options')
    let typeList = {
      city: {
        title: '地区',
        list: []
      },
      industry: {
        title: '行业领域',
        list: []
      },
      techType: {
        title: '技术分类',
        list: []
      }
    }
    if (Number(res.data.status) === 1) {
      res.data.data.cities.unshift({
        id: 0,
        name: "全部地区"
      })
      res.data.data.industries.unshift({
        id: 0,
        name: "全部行业"
      })
      res.data.data.tech_types.unshift({
        id: 0,
        name: "全部分类"
      })
      Object.keys(res.data.data).forEach(key => {
        let item = res.data.data[key]
        if (Array.isArray(item)) {
          item.forEach(ii => {
            ii.text = ii.name
            ii.value = ii.id
          })
        }
      })
      typeList.city.list = [...res.data.data.cities]
      typeList.industry.list = [...res.data.data.industries]
      typeList.techType.list = [...res.data.data.tech_types]
      this.provinces = [] = [...res.data.data.provinces]
    }
    return typeList
  }

  async getList() {
    const {
      page,
      selected
    } = this
    let p = {
      city: selected.city,
      tech_type: selected.techType,
      industry: selected.industry,
      ...page
    }
    // console.log("*****", p)
    let res = await this.$axios.post('/api/kaifawu/index', p)
    if (Number(res.data.status) === 1) {
      let data = res.data.data
      this.page.total = data.total
      let dataList = data.providers || []
      dataList.forEach(item => {
        item['successCase'] = ''
        if (Array.isArray(item.successful_case)) {
          let tem = item.successful_case.map(item => item.title)
          item['successCase'] = tem.join('、')
        }
      })
      if (this.page.page === 1) {
        this.dataList = [...data.providers]
      } else {
        this.dataList = [...this.dataList, ...data.providers]
      }
      this.page.page += 1
      if (this.page.total <= this.dataList.length) {
        this.finished = true
      }
    }
  }

  dealThisMeta(isSeoList) {
    let {
      city,
      industry,
      techType,
      cityName = "",
      industryName = "",
      techTypeName = "",
      proviceName
    } = this.selected


    let head = {
      title: "",
      keyword: "",
      description: "",
      h1: "",
      canonical: "",
      metaLocation: ""
    }
    if (this.req) {
      const {
        headers: {
          host
        },
        url
      } = this.req

      //拼接canonical
      if (host.indexOf('local') !== -1) {
        head.canonical = 'http://' + host + url
      } else {
        head.canonical = 'https://' + host + url
      }
    }
    if (techTypeName) {
      techTypeName = techTypeName.replace("定制化", "")
    }

    if (city && !industry && !techType) {
      //只有城市的
      head.title = `${cityName}软件、网站、APP、小程序开发及SaaS、PaaS、IaaS、API服务平台-开发屋`
      head.keyword = `${cityName}软件开发,${cityName}APP开发,${cityName}小程序开发,${cityName}SaaS服务商`
      head.description = `开发屋为${cityName}中小型企业企业提供各行业软件、APP、小程序开发服务，并整合开发项目所需的各种SaaS、PaaS,LaaS以及API服务商供选择，全程解决开发需求！`
      head.h1 = `${cityName}软件开发`
      head.metaLocation = `province=${proviceName};city=${cityName}`
    } else if (!city && industry && !techType) {
      //只有行业的
      head.title = `${industryName}软件、网站、APP、小程序开发及SaaS、PaaS、IaaS、API服务平台-开发屋`
      head.keyword = `${industryName}软件开发,${industryName}APP开发,${industryName}小程序开发,${industryName}SaaS服务商`
      head.description = `开发屋为${industryName}中小型企业企业提供各行业软件、APP、小程序开发服务，并整合开发项目所需的各种SaaS、PaaS,LaaS以及API服务商供选择，全程解决开发需求！`
      head.h1 = `${industryName}软件开发`
    } else if (!city && !industry && techType) {
      //只有技术分类
      head.title = `定制化${techTypeName}系统服务商、${techTypeName} 解决方案平台-开发屋`
      head.keyword = `${techTypeName},${techTypeName}服务商,${techTypeName}解决方案`
      head.description = `开发屋提供${techTypeName}定制化服务，方便有${techTypeName}需求的开发商挑选较为合适的${techTypeName}解决方案完成项目开发和应用！`
      head.h1 = `${techTypeName}解决方案服务商`
    } else if (city && industry && !techType) {
      //${cityName}${industryName}
      head.title = `${cityName}${industryName}软件、网站、APP、小程序开发及SaaS、PaaS、IaaS、API服务平台-开发屋`
      head.keyword = `${cityName}${industryName}软件开发,${cityName}${industryName}APP开发,${cityName}${industryName}小程序开发,${cityName}${industryName}SaaS服务商`
      head.description = `开发屋为${cityName}${industryName}中小型企业企业提供各行业软件、APP、小程序开发服务，并整合开发项目所需的各种SaaS、PaaS,、IaaS以及API服务商供选择，全程解决开发需求！`
      head.h1 = `${cityName}${industryName}软件开发`
      head.metaLocation = `province=${proviceName};city=${cityName}`
    } else if (city && !industry && techType) {
      //${cityName}${techTypeName}
      head.title = `${cityName}定制化${techTypeName.replace("", "")}系统开发、${cityName}${techTypeName}解决方案-开发屋`
      head.keyword = `${cityName}${techTypeName},${cityName}${techTypeName}服务商,${cityName}${techTypeName}解决方案`
      head.description = `开发屋提供${cityName}${techTypeName}定制化服务，方便有${cityName}${techTypeName}需求的开发商挑选较为合适的${cityName}${techTypeName}解决方案完成项目开发和应用！`
      head.h1 = `${cityName}${techTypeName}解决方案服务商`
      head.metaLocation = `province=${proviceName};city=${cityName}`
    } else if (!city && industry && techType) {
      //${industryName}${techTypeName}
      head.title = `${industryName}定制化${techTypeName}系统服务商、${industryName}${techTypeName}解决方案-开发屋`
      head.keyword = `${industryName}${techTypeName},${industryName}${techTypeName}服务商,${industryName}${techTypeName}解决方案`
      head.description = `开发屋提供${industryName}${techTypeName}定制化服务，方便有${industryName}${techTypeName}需求的开发商挑选较为合适的${industryName}${techTypeName}解决方案完成项目开发和应用！`
      head.h1 = `${industryName}${techTypeName}解决方案服务商`
    } else if (city && industry && techType) {
      // 开发屋城市&行业领域&技术分类页
      head.title = `${cityName}${industryName}定制化${techTypeName}系统服务商、${cityName}${industryName}${techTypeName}解决方案平台-开发屋`
      head.keyword = `${cityName}${industryName}${techTypeName},${cityName}${industryName}${techTypeName}服务商,${cityName}${industryName}${techTypeName}解决方案`
      head.description = `开发屋提供${cityName}${industryName}${techTypeName}定制化服务，方便有${cityName}${industryName}${techTypeName}需求的开发商挑选较为合适的${cityName}${industryName}${techTypeName}解决方案完成项目开发和应用！`
      head.h1 = `${cityName}${industryName}${techTypeName}解决方案服务商`
      head.metaLocation = `province=${proviceName};city=${cityName}`
    } else {
      //非特定的url
      if (isSeoList) {
        head.title = "解决方案大全"
      } else {
        head.title = "开发屋-提供网站建设、APP软件、小程序开发及SaaS、PasS、IaaS服务"
        head.keyword = "网站开发,软件APP开发,SaaS,PaaS"
        head.description = "开发屋为企业提供行业内领先的技术解决方案，包括行业定制化SaaS、PasS、API数据接口服务以及技术组织，保障企业在降低人力开发成本的同时，得到优质的项目开发实力。"
      }
    }
    return head
  }
}