增加企业机构h5浏览页面

config/prod.env.js

@@ -3,6 +3,6 @@ module.exports = {
  NODE_ENV: '"production"',
  ENV_CONFIG:'"prod"',
  BASE_API: '""',
  KX_API: '"http://www.ekexiu.com"'
  // KX_API: '"http://192.168.3.233:81"'
  // KX_API: '"http://www.ekexiu.com"'
  KX_API: '"http://192.168.3.233:81"'
}

src/pages/h5/router/index.js

@@ -1,13 +1,25 @@
const constantRouterMap = [
  { 
        path: '/content',
        alwaysShow: true,
        component: (resolve) => require(['../views/content/content.vue'], resolve),
        name: 'content',
        meta: { title: '修改资料' }
     
    }   
  {
    path: '/content',
    alwaysShow: true,
    component: (resolve) => require(['../views/content/content.vue'], resolve),
    name: 'content',
    meta: { title: '内容' }
  },
  {
    path: '/company',
    alwaysShow: true,
    component: (resolve) => require(['../views/company/company.vue'], resolve),
    name: 'company',
    meta: { title: '企业' }
  },
  {
    path: '/org',
    alwaysShow: true,
    component: (resolve) => require(['../views/org/org.vue'], resolve),
    name: 'org',
    meta: { title: '机构' }
  }
];
// 实例化vue的时候只挂载constantRouter

src/pages/h5/style/index.scss

@@ -2,7 +2,6 @@
  width: 90px;
  height: 60px;
}
.list-item {
  .list-head {
    @include center-block;
@@ -49,4 +48,82 @@
    right: -15px;
    left: -15px;
  }
}
.content .moretype {
  text-align: center;
  margin-top: 10px;
}
.header-box {
  background: url('../../image/company-bg.png') center 0 no-repeat;
  background-size: 100% 130px;
  overflow: hidden;
  .header_content {
    position: relative;
    text-align: center;
    min-height: 140px;
    margin: 15px 15px 6px;
    padding: 40px 40px 20px;
    background: rgba(256, 256, 256, .6);
    background: linear-gradient(rgba(256, 256, 256, .6), rgba(256, 256, 256, .9));
    border-radius: 6px;
    box-shadow: 0px 2px 4px 1px rgba(0, 0, 0, .1);
    .header_content_top {
      border-radius: 4px;
      width: 120px;
      margin-left: -60px;
      background: none;
      position: absolute;
      margin-top: -15px;
      left: 50%;
      height: 80px;
      overflow: hidden;
      .cmy_logo_box {
        width: 120px;
        height: 80px;
        display: table-cell;
        vertical-align: middle;
        text-align: center;
        overflow: hidden;
        img {
          max-width: 100%;
          max-height: 100%;
          vertical-align: middle;
          height: auto !important;
          overflow-y: auto;
          color: transparent;
          font-size: 0;
        }
      }
    }
    .header_content-footer {
      margin-top: 82px;
      p {
        margin-bottom: 5px;
        .cmpName {
          font-size: 16px;
        }
      }
      .industry {
        font-size: 14px;
        color: #666;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
      }
      .addressbox {
        font-size: 13px;
        line-height: 16px;
        color: #666;
      }
    }
  }
}

src/pages/h5/views/company/company.vue

@@ -0,0 +1,222 @@
<template>
  <div class="browse-main">
    <div class="header-box">
      <div class="header_content">
        <div class="header_content_top">
          <div class="cmy_logo_box">
            <img :src="orgInfo.logo" alt="">
          </div>
        </div>
        <div class="header_content-footer">
          <p>
            <span class="cmpName">{{orgInfo.name}}</span>
            <span v-if="orgInfo.type === '2'">{{compType[orgInfo.type]}} </span>
          </p>
          <p class="industry">{{keywordObj[1] ? keywordObj[1].join(" | ") : ''}}</p>
          <p class="addressbox">
            <em class="address"></em> {{citys[orgInfo.addr]}}</p>
        </div>
      </div>
    </div>
    <div class="block-wrapper">
      <div class="left-main">
        <div class="content-wrapper" v-if="platProducts && platProducts.length">
          <div class="inner-wrapper">
            <div class="content-title">
              <span>我们的产品</span>
            </div>
            <div class="content content-nf" v-if="platProducts.length">
              <baseProduct v-for="item in platProducts" :key="item.index" :itemSingle="item"></baseProduct>
              <p class="moretype"@click="moreProduct" v-show="loadingModalShow">查看更多产品</span></p>
            </div>
          </div>
        </div>
        <div class="content-wrapper" v-if="orgInfo.descp">
          <div class="inner-wrapper">
            <div class="content-title">
              <span>企业简介</span>
            </div>
            <div class="content">{{orgInfo.descp}}</div>
          </div>
          <div class="inner-wrapper" v-if="keywordObj && keywordObj[2].length">
            <div class="content-title">
              <span>专注领域</span>
            </div>
            <div class="content">
              <el-row class="tag-item">
                <el-tag v-for="sub in keywordObj[2]" :key="sub.index">{{sub}}</el-tag>
              </el-row>
            </div>
          </div>
        </div>
        <div class="content-wrapper" v-if="compContents && compContents.length">
          <div class="content-title">
            <span>相关文章</span>
          </div>
          <div class="content content-nf" v-if="compContents.length">
              <baseContent v-for="item in compContents" :key="item.index" :itemSingle="item"></baseContent>
            </div>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
  import { urlParse, defaultSet, commenTime } from '@/libs/util';
  import queryDict from '@/libs/queryDict';
  import baseContent from '@/components/subTemplate/BaseContent';
  import shareOut from '@/components/ShareOut';
  import baseProduct from '@/components/subTemplate/BaseProduct';
  export default {
    data() {
      return {
        orgInfo: {},
        pageSize: 2,
        pageNo: 1,
        keywordObj: [],
        numRanger: [],
        compType: [],
        citys: [],
        platProducts: [],
        loadingModalShow: false,
        isLoading: false,
        compContents: []
      };
    },
    created() {
      this.companyId = urlParse('id');
      this.getDictoryData();
      this.getorgInfo();
      this.getCompanyKeyword();
      this.getProductlist();
      this.getCompContent();
    },
    components: {
      shareOut,
      baseProduct,
      baseContent
    },
    methods: {
      moreProduct() {
        this.pageNo++
        this.getProductlist();
      },
      getDictoryData() {
        const that = this
        queryDict.applyDict('QYGM', function (dictData) {
          dictData.map(item => {
            that.numRanger[item.code] = item.caption
          })
        }) // 企业规模
        queryDict.applyDict('QYLX', function (dictData) {
          dictData.map(item => {
            that.compType[item.code] = item.caption
          })
        }) // 企业类型
        queryDict.applyDict('XZQH', function (dictData) {
          dictData.map(item => {
            that.citys[item.code] = item.caption
          })
        })
      },
      getorgInfo() {
        this.$axios.get('/ajax/company/qo', {
          id: this.companyId
        }, (res) => {
          if (res.success) {
            const obj = res.data
            if (!obj.logo) {
              obj.logo = defaultSet.img.org
            }
            document.title = obj.name + '-' + PLAT.info.title
            this.orgInfo = obj
          };
        });
      },
      getCompanyKeyword() {
        var that = this
        that.$axios.get('/ajax/company/qo/keyword', {
          id: that.companyId
        }, function (res) {
          if (res.success && res.data) {
            const str = res.data
            var objKey = {}
            if (str.length > 0) {
              str.map(item => {
                if (!objKey[item.type]) {
                  objKey[item.type] = []
                  objKey[item.type].push(item.value)
                } else {
                  objKey[item.type].push(item.value)
                }
              })
            }
            that.keywordObj = objKey
          }
        })
      },
      getProductlist() {
        var that = this
        this.$axios.get('/ajax/product/pq', {
          companyId: that.companyId,
          pageSize: that.pageSize,
          pageNo: that.pageNo
        }, function (res) {
          if (res.success) {
            const obj = res.data.data
            if (obj.length > 0) {
              if (res.data.pageNo !== that.pageNo) {
                that.loadingModalShow = false;
                return;
              }
              that.platProducts = that.platProducts.concat(obj);
              if (obj.length < that.pageSize) {
                that.loadingModalShow = false;
              } else {
                that.loadingModalShow = true;
              }
            } else {
              that.loadingModalShow = false;
            }
          }
        })
      },
      searchLower() {
        if (this.loadingModalShow && !this.isLoading) {
          this.pageNo++;
          this.getProductlist();
        }
      },
      getCompContent() {
        var that = this
        this.$axios.get('/ajax/article/lq/with/company', {
          cid: this.companyId
        }, (res) => {
          if (res.success) {
            let $info = res.data;
            if ($info.length > 0) {
              for (let i = 0; i < $info.length; ++i) {
                (function (str) {
                  that.$axios.get('/ajax/article/qo', {
                    id: str.id
                  }, (data) => {
                    if (data.success) {
                      str.title = data.data.title
                      str.modifyTime = commenTime(data.data.modifyTime, true)
                      that.$forceUpdate()
                    };
                  });
                })($info[i])
              }
              that.compContents = $info;
            }
          };
        });
      }
    }
  };
</script>
<style lang="scss" rel="stylesheet/scss">
  @import '../../style/index';
</style>

src/pages/h5/views/content/content.vue

@@ -118,6 +118,7 @@
              for (let i = 0; i < $info.length; ++i) {
                if($info[i].id === this.contentId) {
                  $info.splice(i,1)
                  i--
                  continue
                }
                if ($info[i].modifyTime) {

src/pages/h5/views/org/org.vue

@@ -0,0 +1,354 @@
<template>
  <div class="browse-main">
    <div class="header-box">
      <div class="header_content">
        <div class="header_content_top">
          <div class="cmy_logo_box">
            <img :src="orgInfo.logo" alt="">
          </div>
        </div>
        <div class="header_content-footer">
          <p>
            <span class="cmpName">{{orgInfo.forShort ? orgInfo.forShort : orgInfo.name}}</span><em class="authicon" :class="{'icon-com': orgInfo.authStatus==='3'}"></em>
            <span v-if="orgInfo.type === '2'">{{compType[orgInfo.type]}} </span>
          </p>
          <p class="industry">{{orgInfo.industry ? orgInfo.industry.join(" | ") : ''}}</p>
          <p class="addressbox">
            <em class="address"></em> {{orgInfo.city}}</p>
        </div>
      </div>
    </div>
    <div class="content-wrapper split-other" v-if="platServices.length || platResources.length">
      <div class="inner-wrapper" v-if="platServices.length">
        <div class="content-title">
          <span>可提供服务</span>
        </div>
        <div class="content content-nf" v-if="platServices.length">
          <baseService v-for="item in platServices" :key="item.index" :itemSingle="item"></baseService>
          <p class="moretype" @click="moreService" v-show="loadingModalShow">查看更多服务</span></p>
        </div>
      </div>
      <div class="inner-wrapper" v-if="platResources.length">
        <div class="content-title">
          <span>可共享资源</span>
        </div>
        <div class="content content-nf" v-if="platResources.length">
          <baseResource v-for="item in platResources" :key="item.index" :itemSingle="item"></baseResource>
          <p class="moretype"@click="moreProduct" v-show="loadingModalShow2">查看更多资源</span></p>
        </div>
      </div>
    </div>
    <div class="content-wrapper" v-if="orgInfo.descp">
      <div class="inner-wrapper">
        <div class="content-title">
          <span>机构简介</span>
        </div>
        <div class="content">{{orgInfo.descp}}</div>
      </div>
      <div class="inner-wrapper" v-if="orgInfo.subject && orgInfo.subject.length">
        <div class="content-title">
          <span>专注领域</span>
        </div>
        <div class="content">
          <el-row class="tag-item">
            <el-tag v-for="sub in orgInfo.subject" :key="sub.index">{{sub}}</el-tag>
          </el-row>
        </div>
      </div>
    </div>
    <div class="content-wrapper" v-if="orgContents && orgContents.length">
      <div class="content-title">
        <span>相关文章</span>
      </div>
      <div class="content content-nf" v-if="orgContents.length">
        <baseContent v-for="item in orgContents" :key="item.index" :itemSingle="item"></baseContent>
      </div>
    </div>
    <div class="content-wrapper" v-if="likeOrgs && likeOrgs.length">
      <div class="content-title">
        <span>您可能感兴趣的机构</span>
      </div>
      <div class="content">
        <a v-for="item in likeOrgs" :key="item.index" class="list-item" :href="'org.html?id='+item.id" target="_blank">
          <div class="list-head" :style="{backgroundImage: 'url(' + item.logo + ')'}"></div>
          <div class="list-info">
            <div class="list-owner">{{item.name}}</div>
            <div class="list-desc">{{item.compType}}</div>
          </div>
        </a>
      </div>
    </div>
  </div>
  </div>
  </div>
</template>
<script>
  import { urlParse, ImageUrl, defaultSet, strToArr, TimeTr, commenTime } from '@/libs/util';
  import queryDict from '@/libs/queryDict';
  import queryBase from '@/libs/queryBase';
  import shareOut from '@/components/ShareOut';
  import collectCo from '@/components/CollectCo';
  import contactChat from '@/components/ContactChat';
  import baseService from '@/components/subTemplate/BaseService';
  import baseResource from '@/components/subTemplate/BaseResource';
  import baseContent from '@/components/subTemplate/BaseContent';
  export default {
    data() {
      return {
        activeName: 'first',
        numRanger: [],
        compType: [],
        orgInfo: '',
        orgId: '',
        elurl: '',
        platServices: [],
        serCount: 0,
        loadingModalShow: false, // 是否显示按钮
        loadingComplete: false, // 是否全部加载
        isFormSearch: false, // 数据加载
        isLoading: false, // button style...
        ifDefault: false, // 是否缺省
        platResources: [],
        resCount: 0,
        loadingModalShow2: false,
        loadingComplete2: false,
        isFormSearch2: false,
        isLoading2: false,
        ifDefault2: false,
        dataO: {
          serModifyTime: '',
          resPublishTime: '',
          resShareId: ''
        },
        rows: 2,
        orgContents: '',
        likeOrgs: ''
      };
    },
    created() {
      this.orgId = urlParse('id');
      this.elurl = window.location.href;
      this.getDictoryData();
      this.getorgInfo();
      this.getOrgWave();
      this.getOrgResource();
      this.queryPubCount();
      this.getOrgContent();
      this.getLikeOrgs();
    },
    components: {
      shareOut,
      collectCo,
      contactChat,
      baseService,
      baseResource,
      baseContent
    },
    methods: {
      moreService() {
        this.getOrgWave()
      },
      moreProduct() {
        this.getOrgResource()
      },
      getDictoryData() {
        const that = this
        queryDict.applyDict('QYGM', function (dictData) {
          dictData.map(item => {
            that.numRanger[item.code] = item.caption
          })
        }) // 企业规模
        queryDict.applyDict('QYLX', function (dictData) {
          dictData.map(item => {
            that.compType[item.code] = item.caption
          })
        }) // 企业类型
      },
      getorgInfo() {
        this.$axios.getk('/ajax/org/' + this.orgId, {
        }, (res) => {
          if (res.success) {
            var $info = res.data;
            if ($info.hasOrgLogo) {
              $info.logo = ImageUrl(('org/' + $info.id + '.jpg'), true)
            } else {
              $info.logo = defaultSet.img.org
            }
            if ($info.subject) {
              $info.subject = strToArr($info.subject);
            }
            if ($info.industry) {
              $info.industry = strToArr($info.industry);
            }
            if ($info.qualification) {
              $info.qualification = strToArr($info.qualification);
            }
            if ($info.foundTime) {
              $info.foundTime = TimeTr($info.foundTime);
            }
            document.title = ($info.forShort ? $info.forShort : $info.name) + '-' + PLAT.info.title
            this.orgInfo = $info;
          };
        });
      },
      getOrgWave() {
        this.$axios.getk('/ajax/ware/publish', {
          category: '2',
          owner: this.orgId,
          modifyTime: this.dataO.serModifyTime,
          rows: this.rows
        }, (res) => {
          if (res.success && res.data) {
            var $info = res.data;
            if ($info.length > 0) {
              this.dataO.serModifyTime = $info[$info.length - 1].modifyTime;
              this.platServices = this.platServices.concat($info);
              this.isFormSearch = true;
              if ($info.length < this.rows) {
                this.loadingModalShow = false;
                this.isFormSearch = false;
              } else {
                this.loadingModalShow = true;
              }
            } else {
              this.loadingModalShow = false;
              this.isFormSearch = false;
            };
            var liLen = this.platServices.length;
            if ($info.length === 0 && liLen === 0) {
              this.ifDefault = true;
            };
          };
        });
      },
      searchLower() {
        if (this.loadingModalShow && !this.isLoading) {
          this.getOrgWave();
        }
      },
      getOrgResource() {
        this.$axios.getk('/ajax/resource/publish', {
          category: '2',
          owner: this.orgId,
          publishTime: this.dataO.resPublishTime,
          shareId: this.dataO.resShareId,
          rows: this.rows
        }, (res) => {
          if (res.success && res.data) {
            var $info = res.data;
            if ($info.length > 0) {
              this.dataO.resPublishTime = $info[$info.length - 1].publishTime;
              this.dataO.resShareId = $info[$info.length - 1].shareId;
              this.platResources =  this.platResources.concat($info);
              this.isFormSearch2 = true;
              if ($info.length < this.rows) {
                this.loadingModalShow2 = false;
                this.isFormSearch2 = false;
              } else {
                this.loadingModalShow2 = true;
              }
            } else {
              this.loadingModalShow2 = false;
              this.isFormSearch2 = false;
            };
            var liLen = this.platPatents.length;
            if ($info.length === 0 && liLen === 0) {
              this.ifDefault2 = true;
            };
          };
        });
      },
      searchLower2() {
        if (this.loadingModalShow2 && !this.isLoading2) {
          this.getOrgResource();
        }
      },
      queryPubCount() {
        var that = this
        this.$axios.getk('/ajax/ware/count/publish', {
          owner: that.orgId,
          category: '2'
        }, function (data) {
          if (data.data > 0 && data.data < 99) {
            that.serCount = data.data;
          }
          if (data.data > 99) {
            that.serCount = '99+';
          }
        });
        this.$axios.getk('/ajax/resource/count/publish', {
          owner: that.orgId,
          category: '2'
        }, function (data) {
          if (data.data > 0 && data.data < 99) {
            that.resCount = data.data;
          }
          if (data.data > 99) {
            that.resCount = '99+';
          }
        });
      },
      getOrgContent() {
        var that = this
        this.$axios.get('/ajax/article/lq/with/org', {
          oid: this.orgId
        }, (res) => {
          if (res.success) {
            var $info = res.data;
            if ($info.length > 0) {
              for (let i = 0; i < $info.length; ++i) {
                (function (str) {
                  that.$axios.get('/ajax/article/qo', {
                    id: str.id
                  }, (data) => {
                    if (data.success) {
                      str.title = data.data.title
                      str.modifyTime = commenTime(data.data.modifyTime, true)
                      that.$forceUpdate()
                    };
                  });
                })($info[i])
              }
              that.orgContents = $info;
            };
          };
        });
      },
      getLikeOrgs() {
        var that = this
        this.$axios.getk('/ajax/org/ralateOrgs', {
          orgId: this.orgId
        }, (res) => {
          if (res.success) {
            var $info = res.data;
            if ($info.length > 0) {
              for (let i = 0; i < $info.length; ++i) {
                (function (str) {
                  queryBase.getOrganization(str.id, function (sc, value) {
                    if (sc) {
                      str.name = value.name
                      str.orgType = that.compType[value.orgType]
                      if (str.hasOrgLogo) {
                        str.logo = ImageUrl(('org/' + value.id + '.jpg'), true)
                      } else {
                        str.logo = defaultSet.img.org
                      }
                      that.$forceUpdate()
                    }
                  })
                })($info[i])
              }
              that.likeOrgs = $info;
            }
          };
        });
      }
    }
  };
</script>
<style lang="scss" rel="stylesheet/scss">
  @import '../../style/index';
</style>