Browse Source

添加侧边工具栏

kindring 2 năm trước cách đây
mục cha
commit
5ecd99c194

+ 1 - 0
assets/icons/svg/top.svg

@@ -0,0 +1 @@
+<svg t="1682094085766" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3469" width="200" height="200"><path d="M764.326842 459.350896c-7.992021 7.992021-20.947078 7.992021-28.949332 0l-187.776687-187.78692 0 603.904153c0 11.2973-9.15859 20.466124-20.466124 20.466124s-20.466124-9.168824-20.466124-20.466124l0-603.904153-187.78692 187.797154c-3.990894 3.990894-9.230222 5.986341-14.46955 5.986341s-10.468422-1.995447-14.46955-5.986341c-7.992021-8.002254-7.992021-20.957311 0-28.949332l222.722594-222.722594c3.837398-3.837398 9.046027-5.996574 14.46955-5.996574 5.433756 0 10.642384 2.159176 14.479783 5.996574l222.712361 222.712361C772.318864 438.393585 772.318864 451.348642 764.326842 459.350896z" p-id="3470"></path><path d="M842.875826 150.384056c0 11.2973-9.15859 20.466124-20.466124 20.466124l-590.550007 0c-11.307533 0-20.466124-9.168824-20.466124-20.466124 0-11.307533 9.15859-20.466124 20.466124-20.466124l590.550007 0C833.717236 129.917932 842.875826 139.076522 842.875826 150.384056z" p-id="3471"></path></svg>

Những thai đổi đã bị hủy bỏ vì nó quá lớn
+ 0 - 0
assets/icons/svg/wechat.svg


+ 85 - 0
components/siteBar.vue

@@ -0,0 +1,85 @@
+<template>
+  <div class="site-bar">
+    <div class="btn wechat">
+      <svg-icon icon-class="wechat"  />
+      <img class="show-img" :src="wechatSrc" alt="">
+    </div>
+    <div class="btn top" @click="toTop" >
+      <svg-icon icon-class="top" />
+    </div>
+  </div>
+</template>
+
+<script>
+// 网页侧边栏小工具
+export default {
+  name: "siteBar",
+  props:{
+    lang: {
+      type: String,
+      default: 'cn'
+    },
+    wechatSrc: {
+      type: String,
+      default: ''
+    }
+  },
+  methods: {
+    toTop() {
+      // 缓慢移动到顶部
+      window.scrollTo({
+        top: 0,
+        behavior: "smooth"
+      });
+    }
+  }
+}
+</script>
+
+<style scoped>
+.site-bar{
+  width: 50px;
+  height: auto;
+  position: fixed;
+  right: 180px;
+  top: 70%;
+  transform: translateY(-50%);
+}
+.site-bar .btn{
+  width: 50px;
+  height: 50px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  font-size: 2rem;
+  cursor: pointer;
+  background-color: #f5f5f5;
+  border-radius: 50%;
+  box-shadow: 0 0 5px #dedede;
+  color: #999999;
+  margin-bottom: 10px;
+}
+.site-bar .btn:hover{
+  background-color: #dedede;
+  color: #af4141;
+}
+.wechat{
+  position: relative;
+}
+.wechat .show-img{
+  position: absolute;
+  bottom: 50px;
+  right: 50px;
+  display: block;
+  width: 180px;
+  height: 180px;
+  max-width: none;
+  border-radius: 5px;
+  box-shadow: 1px 1px 7px 5px #dedede;
+  opacity: 0;
+  transition: all 0.5s;
+}
+.wechat:hover .show-img{
+  opacity: 1;
+}
+</style>

+ 21 - 0
map/newMap.js

@@ -54,3 +54,24 @@ export function getNewsTypeStr(val){
     return "NotFound"
   }
 }
+
+export function getTypeText (key){
+  let item = sTypes.find(val=>val.key === key);
+  if(item&&item.text){
+    return item.text;
+  }else{
+    return "loading...";
+  }
+
+}
+
+
+export function getTypeSubText (key){
+  let item = sTypes.find(val=>val.key === key);
+  if(item&&item.subText){
+    return item.subText;
+  }else{
+    return "loading...";
+  }
+
+}

+ 1 - 0
map/solutionMap.js

@@ -22,6 +22,7 @@ export const sTypes = [
     text: '电力案例',
     subText: '电网方面专业解决方案'
   },
+
 ]
 
 export function getTypeText (key){

+ 1 - 0
pages/index.vue

@@ -13,6 +13,7 @@
 <!--    页脚 -->
     <default-footer :lang="lang"/>
 
+    <site-bar wechat-src="/image/wechat.jpg"></site-bar>
   </div>
 </template>
 

+ 64 - 0
pages/news/_type.vue

@@ -0,0 +1,64 @@
+<template>
+<!--  <product-index :p-type="type" :p-product="products"/>-->
+<!--  <solution-index :p-type="type" :p-solution="solutions"></solution-index>-->
+  <news-index :p-type="type" :p-news="solutions"></news-index>
+</template>
+
+<script>
+import productIndex from '@/pages/product/index.vue'
+import handle from "~/until/handle";
+import axios from "axios";
+import qs from "qs";
+import SolutionIndex from "@/pages/solution/index";
+const pageLimit = 5;
+export default {
+  name: "typeNewsPage",
+  props:[],
+  async asyncData(ctx){
+    // ctx.searchProduct();
+    const queryData = {};
+    // console.log(ctx)
+    queryData['key']=ctx.key;
+
+    queryData['type']=ctx.params.type?ctx.params.type:'all';
+    queryData['page']=1;
+    queryData['limit']=pageLimit;
+    // 获取数据
+    let url = 'http://szhfy.com.cn/api/searchNews.php';
+    let [err,res] = await handle(axios.post(
+      url,
+      qs.stringify(queryData)
+    ));
+    if(err){
+      console.log(err);
+      return {};
+    }
+    let result = res.data;
+    if(result.rcode === 1){
+      return {solutions:result.data}
+    }else{
+      console.error(result.msg);
+      console.log(result);
+      return {solutions:[]}
+    }
+  },
+  data(){
+    return {
+      type:  'all',
+      solutions: []
+    }
+  },
+  beforeMount() {
+    // console.log('动态页面执行');
+    this.type = this.$route.params.type?this.$route.params.type:'all';
+    // console.log(this.type);
+  },
+  components:{
+    SolutionIndex,
+  }
+}
+</script>
+
+<style scoped>
+
+</style>

+ 2 - 0
pages/news/index.vue

@@ -7,6 +7,8 @@
     <page-select :page="page" :count="nowCount" :total="nowTotal"></page-select>
 
     <default-footer :lang="lang"/>
+
+    <site-bar wechat-src="/image/wechat.jpg"></site-bar>
   </div>
 </template>
 

+ 30 - 0
pages/news/item/_type.vue

@@ -0,0 +1,30 @@
+<template>
+<!--  <item-index :p-type="type" />-->
+  <item-index :p-type="type"></item-index>
+</template>
+
+<script>
+import ItemIndex from "~/pages/news/item/index";
+export default {
+  name: "newsItemType",
+  components: {ItemIndex},
+  data(){
+    return {
+      type:  '',
+      products: []
+    }
+  },
+  beforeMount() {
+    // console.log('动态页面执行');
+    this.type = this.$route.params.type;
+    if(!this.type){
+      return window.location.href = '/news'
+    }
+    // console.log(this.type);
+  },
+}
+</script>
+
+<style scoped>
+
+</style>

+ 138 - 0
pages/news/item/index.vue

@@ -0,0 +1,138 @@
+<template>
+  <div class="content">
+    <lucency-header :lang="lang" page-key="solution" />
+    <item-banner :title="productTypeText" :sub-title="productTypeSubText"></item-banner>
+    <div class="conBox big-title">
+      <span >
+        {{solutionDetail.title}}
+      </span>
+      <div class="hr"></div>
+      <span class="author">
+        {{solutionDetail.author}}
+      </span>
+    </div>
+    <div class="conBox solution-view" v-html="solutionDetail.content">
+    </div>
+    <div class="conBox solution-info">
+      <span class="viewer">
+        {{solutionDetail.hits}}人浏览
+      </span>
+      <span class="time">
+        发布日期: {{solutionDetail.date_time}}
+      </span>
+
+    </div>
+    <default-footer :lang="lang"/>
+    <site-bar wechat-src="/image/wechat.jpg"></site-bar>
+  </div>
+</template>
+
+<script>
+import langMap from "~/map/langMap";
+import defaultFooter from "~/components/footer/defaultFooter";
+import {getTypeSubText, getTypeText} from "~/map/newMap";
+import handle from "~/until/handle";
+import {timestampToTime} from "~/until/time";
+import {unescapeHtml} from "~/until/unescapeHtml";
+
+export default {
+  name: "newsItemIndex",
+  props:['uLang','pType'],
+  components:{defaultFooter},
+  data(){
+    return {
+      langType: langMap.lang,
+      lang: this.uLang?this.uLang:langMap.lang.cn,
+      solutionId: null,
+      solutionDetail: {},
+      productTypeText: getTypeText(this.pType),
+      productTypeSubText: getTypeSubText(this.pType),
+      timer: null,
+    }
+  },
+  beforeMount() {
+    const queryString = window.location.search;
+    const params = new URLSearchParams(queryString);
+    if(params&&params.get('id')){
+      this.solutionId = params.get('id');
+    }else{
+      window.location.href = '/news'
+    }
+    this.loadSolutionDetail();
+    this.timer = setTimeout(()=>{
+      this.addRead();
+    },1000*10)
+  },
+  beforeDestroy() {
+    if (this.timer){
+      clearTimeout(this.timer);
+    }
+  },
+  methods:{
+    getLangText(str) {
+      return langMap.getText(this.lang, str);
+    },
+    getAbbrText(str) {
+      return langMap.getAbbrText(this.lang, str);
+    },
+    async loadSolutionDetail(){
+      let err,res;
+      let url = `/api/getSolution.php?id=${this.solutionId}`;
+      [err,res] = await handle(this.$axios.$get(url));
+      if(err) {
+        console.log(err);
+        return alert(err.message);
+      }
+      console.log(typeof res.rcode)
+      if(res.rcode === 1){
+        this.solutionDetail = res.data;
+        // console.log(this.solutionDetail.detail)
+        this.solutionDetail.content = unescapeHtml(this.solutionDetail.content);
+        // console.log(this.solutionDetail.detail)
+        this.solutionDetail.date_time  = timestampToTime(this.solutionDetail.date_time);
+      }else{
+        console.log('not match result');
+        console.log(res);
+        return alert('加载解决方案失败!!!');
+      }
+    },
+    async addRead(){
+      let err,res;
+      let url = `/api/addNewsRead.php?id=${this.solutionId}`;
+      [err,res] = await handle(this.$axios.$get(url));
+      if(err) {
+        console.log(err);
+        return alert(err.message);
+      }
+      console.log(typeof res.rcode)
+      if(res.rcode === 1){
+        // this.solutionDetail.hits = res.data;
+        console.log('page add hits ok')
+      }else{
+        console.log('not match result');
+        console.log(res);
+      }
+    },
+
+  }
+
+}
+</script>
+
+<style scoped>
+.big-title {
+  margin: 5px auto;
+  justify-content: left;
+}
+.solution-info{
+  /*  两边布局*/
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+  align-items: flex-start;
+  flex-wrap: wrap;
+  font-size: 0.8rem;
+  color: #999999;
+  cursor: default;
+}
+</style>

+ 2 - 0
pages/product/index.vue

@@ -9,6 +9,8 @@
     <product-list :lang="lang" :product-list="products"></product-list>
     <page-select :page="page" :count="nowCount" :total="nowTotal"></page-select>
     <default-footer :lang="lang"/>
+
+    <site-bar wechat-src="/image/wechat.jpg"></site-bar>
   </div>
 </template>
 

+ 3 - 1
pages/product/item/index.vue

@@ -17,7 +17,7 @@
 <!--          联系销售 -->
           <span class="chunk">联系购买</span>
           <div class="imgView">
-            <img src="/public/files/basic/2021-03-22/605842910c2ae.jpg" alt="">
+            <img src="/image/wechat.jpg" alt="">
           </div>
         </div>
       </div>
@@ -36,6 +36,8 @@
 
 <!--    页脚 -->
     <default-footer :lang="lang"/>
+
+    <site-bar wechat-src="/image/wechat.jpg"></site-bar>
   </div>
 </template>
 

+ 2 - 0
pages/solution/index.vue

@@ -7,6 +7,8 @@
     <page-select :page="page" :count="nowCount" :total="nowTotal"></page-select>
 
     <default-footer :lang="lang"/>
+
+    <site-bar wechat-src="/image/wechat.jpg"></site-bar>
   </div>
 </template>
 

+ 2 - 0
pages/solution/item/index.vue

@@ -23,6 +23,8 @@
 
     </div>
     <default-footer :lang="lang"/>
+
+    <site-bar wechat-src="/image/wechat.jpg"></site-bar>
   </div>
 </template>
 

BIN
static/image/wechat.jpg


Một số tệp đã không được hiển thị bởi vì quá nhiều tập tin thay đổi trong này khác