Procházet zdrojové kódy

留言功能完成

sys před 3 roky
rodič
revize
63d04685da
3 změnil soubory, kde provedl 77 přidání a 15 odebrání
  1. 2 0
      api/news.js
  2. 10 2
      pages/login/register.vue
  3. 65 13
      pages/msg/index.vue

+ 2 - 0
api/news.js

@@ -4,4 +4,6 @@ const commonUrl = '/api/news/'
 // 获取sts
 export const banner = (data) => request(commonUrl + 'banner', 'post', { ...data })
 export const notices = (data) => request(commonUrl + 'notices', 'post', { ...data })
+export const addMsg = (data) => request(commonUrl + 'add-msg', 'post', { ...data })
+export const getMsgList = (data) => request(commonUrl + 'list-msg', 'post', { ...data })
 

+ 10 - 2
pages/login/register.vue

@@ -1,6 +1,9 @@
 <template>
   <view class="register-box">
-      <view class="register-logo"></view>
+    <view class="register-logo"></view>
+    <header class="header">
+      <image class="hd-logo" src="/static/img/icon/logow.png?=1" mode="aspectFill" />
+    </header>
       <view class="register-from">
           <view class="from-input"><input v-model="inviteCode" placeholder="请输入推荐码"></view>
           <view class="from-but"><button @click="register">确定</button></view>
@@ -74,8 +77,13 @@ export default {
   background-size: cover;
   //padding-top: 400rpx;
   .register-logo{
-    height: 300rpx;
+    height: 100rpx;
+  }
+  .header{
+    position: fixed; left: 0; top: 0; width: 100%; height: 54px;  background: #131E30; z-index: 10; overflow: hidden;
+    .hd-logo{ display: block; max-width: 52%; height: 34px; margin: 10px auto;}
   }
+
   .register-from{
     border-radius: 20rpx;
     width:calc(100vw - 214rpx);

+ 65 - 13
pages/msg/index.vue

@@ -8,48 +8,100 @@
       <view class="msg-text" contenteditable="true" placeholder="在此输入留言内容,限200字。"></view>
       <view class="msg-btn" @click="sendMsg">提交</view>
       <view class="msg-list">
-        <view class="msg-item" v-for="(msg_iteam,index) in 5">
+        <view class="msg-item" v-for="(msgItem,index) in list">
           <view class="msg-list-con">
             <view class="msg-list-tit">
               <view class="msg-list-name">
-               阿萨德撒多解散
+               {{msgItem.username}}
               </view>
-              <view class="msg-list-time">2022-10-18 15:02</view>
+              <view class="msg-list-time">{{msgItem.created_at}}</view>
             </view>
-            <view class="msg-list-intro">阿山东黄金看加哈是否叠加记得收款飞</view>
+            <view class="msg-list-intro">{{msgItem.content}}</view>
           </view>
-          <view class="msg-list-con" >
+          <view class="msg-list-con" v-if="msgItem.reply!==''">
             <view class="msg-list-tit">
               <view class="msg-list-name">
                 回复
               </view>
-              <view class="msg-list-time">2022-10-18 15:02</view>
+              <view class="msg-list-time">{{msgItem.updated_at}}</view>
             </view>
-            <view class="msg-list-intro">是大家好较好的</view>
+            <view class="msg-list-intro">{{msgItem.reply}}</view>
           </view>
         </view>
       </view>
+      <en-blank v-if="list.length<=0"></en-blank>
     </view>
   </view>
 </template>
 
 <script>
 import $ from 'jquery/src/jquery'
+import {addMsg, getMsgList} from "@/api/news";
+import tools from "@/common/js/tools";
+import EnBlank from "@/components/en-utils/en-blank/en-blank";
 export default {
   name: "index",
-  components: {},
+  components: {EnBlank},
   props: {},
   data() {
-    return {}
+    return {
+      isAjax:false,
+      page:1,
+      list:[],
+      total:null
+    }
   },
   watch: {},
   mounted() {
-    this.msg = $('.msg-text').text();
+    this.startList()
+  },
+  onReachBottom() {
+    this.getMsgList()
   },
   methods: {
+    startList(){
+      this.page=1;
+      this.list=[];
+      this.total=null;
+      this.getMsgList()
+    },
+    getMsgList(){
+      if(this.isAjax){
+        return;
+      }
+      if(this.total!==null && this.total>=this.list.length){
+        return;
+      }
+      getMsgList({'page':this.page}).then((res)=>{
+        if(res.code===1){
+          this.total=res.data.total
+          this.list.push(...res.data.items)
+          ++this.page
+        }
+      })
+    },
     sendMsg(){
-      this.msg = $('.msg-text').text();
-      console.log(this.msg)
+      let msg = $('.msg-text').text();
+      if(msg===''){
+        tools.error('请输入留言内容')
+        return;
+      }
+      if(this.isAjax){
+        return;
+      }
+      this.isAjax=true
+      addMsg({'content':msg}).then((res)=>{
+        this.isAjax=false
+        if(res.code===1){
+            this.list.unshift(res.data)
+          $('.msg-text').text('');
+            tools.success(res.msg)
+        }else {
+          tools.error(res.msg)
+        }
+      }).catch((e)=>{
+        this.isAjax=false
+      })
     }
   }
 }
@@ -129,7 +181,7 @@ export default {
               color: #D9E4F6;
             }
             .msg-list-time {
-              max-width: 110px;
+              max-width: 130px;
               height: 30px;
               font-size: 12px;
               color: #495B73;