proginn-frontend/components/kaifain/dealSeoIndex.js

export default class DealSeoData {
  constructor({ $axios, req, app, redirect }) {
    this.$axios = $axios
    this.req = req
    this.app = app
    this.redirect = redirect
    this.selected = {
      city: 0,
      industry: 0,
      techType: 0,
    }
    this.page = {
      page: 1,
      size: 10,
      total: 0
    }
    this.finished = false
    this.dataList = []
    this.provinces = []
  }
  
  async dealData() {
    let { name, query: { page = 1 }, path, params, fullPath } = this.app.context.route
    console.log("***", this.app.context.route, this.req)
    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('/')
          list.length = Math.min(list.length, 3) //防止url超出
          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) {
                  this.selected[keys] = typeItem.id
                  this.selected[keys+'Name'] = typeItem.name
                  if (keys === 'city') {
                    this.selected["provice"] = typeItem.prov_id
                  }
                }
              })
            })
          })
          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
    }
    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
      }
    }
    console.log(this.dataList)
  }
  
  dealThisMeta(isSeoList) {
    const { city, industry, techType, cityName="", industryName="", techTypeName="", proviceName} = this.selected
    const {headers: {host}, url} = this.req
  
    let head = {
      title:"", keyword: "", descrption: "", h1: "", canonical: "", metaLocation: ""
    }
    //拼接canonical
    if (host.indexOf('local') !== -1) {
      head.canonical = 'http://' + host + url
    } else {
      head.canonical = 'https://' + host + url
    }
    
    console.log('dealThisMeta',  this.selected)
    //非特定的url
    if (!city && !industry && !techType) {
      if (isSeoList) {
        head.title = "解决方案大全"
      } else {
        head.title = "开发屋-提供各大行业定制化SaaS、PasS、API、技术组织等互联网领先的技术开发解决方案"
        head.keyword = "定制化Saas、PasS、API、行业技术解决方案"
        head.descrption = "开发屋为企业提供行业内领先的技术解决方案，包括行业定制化SaaS、PasS、API数据接口服务以及技术组织，保障企业在降低人力开发成本的同时，得到优质的项目开发实力。"
      }
    } else if (city && !industry && !techType) {
      //只有城市的
      head.title = `${cityName}技术解决方案商家，${cityName}行业领域互联网技术开发解决方案-开发屋`
      head.keyword = `${cityName}技术解决方案, ${cityName}技术解决方案案例`
      head.descrption = `开发屋为${cityName}企业提供行业内领先的技术解决方案，包括行业定制化SaaS、PasS、API数据接口服务以及技术组织，保障${cityName}企业在降低人力开发成本的同时，得到优质的项目开发实力。`
      head.h1 = `${cityName}技术解决方案`
      head.metaLocation = `province=${proviceName};city=${cityName}`
    } else if (!city && industry && !techType) {
      //只有行业的
      head.title = `${industryName}技术解决方案，${industryName}互联网技术开发解决方案提供-开发屋`
      head.keyword = `${industryName}技术解决方案`
      head.descrption = `开发屋为企业提供${industryName}领先的技术解决方案，包括行业定制化SaaS、PasS、API数据接口服务以及技术组织，保障${industryName}的企业在降低人力开发成本同时，得到优质的项目开发实力。`
      head.h1 = `${industryName}技术解决方案`
    } else if (!city && !industry && techType) {
      //只有技术分类
      head.title = `${techTypeName}技术解决方案案例展示，${techTypeName}及时开发解决方案提供-开发屋`
      head.keyword = `${techTypeName}技术解决方案`
      head.descrption = `开发屋为企业提供行业${techTypeName}领先的技术解决方案，包括行业定制化SaaS、PasS、API数据接口服务以及技术组织，保障行业${techTypeName}的企业在降低人力开发成本同时，得到优质的项目开发实力。`
      head.h1 = `${techTypeName}技术解决方案`
    } else if (city && industry && !techType) {
      //${cityName}${industryName}
      head.title = `${cityName}${industryName}技术解决方案，${cityName}${industryName}互联网技术开发解决方案提供-开发屋`
      head.keyword = `${cityName}${industryName}技术解决方案`
      head.descrption = `开发屋为企业提供${cityName}${industryName}领先的技术解决方案，包括行业定制化SaaS、PasS、API数据接口服务以及技术组织，保障${cityName}${industryName}的企业在降低人力开发成本同时，得到优质的项目开发实力。`
      head.h1 = `${cityName}${industryName}技术解决方案`
      head.metaLocation = `province=${proviceName};city=${cityName}`
    } else if (city && !industry && techType) {
      //${cityName}${techTypeName}
      head.title = `${cityName}${techTypeName}技术解决方案案例展示，${cityName}${techTypeName}及时开发解决方案提供-开发屋`
      head.keyword = `${cityName}${techTypeName}技术解决方案案例展示`
      head.descrption = `开发屋为企业提供${cityName}行业${techTypeName}领先的技术解决方案，包括行业定制化SaaS、PasS、API数据接口服务以及技术组织，保障${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}技术解决方案`
      head.descrption = `开发屋为企业提供${industryName}${techTypeName}领先的技术解决方案，包括行业定制化SaaS、PasS、API数据接口服务以及技术组织，保障${industryName}${techTypeName}的企业在降低人力开发成本同时，得到优质的项目开发实力。`
      head.h1 = `${industryName}${techTypeName}技术解决方案`
    }
    return head
  }
}