学习问答

src/project/fd/AppAnswer/answerAdd.vue

@@ -1,17 +1,17 @@
 <template>
   <div class="answerAdd">
     <div class="input_box">
-      <u-input v-model="value" type="textarea" height="580" maxlength="10000"
+      <u-input v-model="form.content" type="textarea" height="580" maxlength="10000"
       :clearable="false" placeholder="请输入回答内容" :auto-height="true" placeholder-style="color: '#AAAAAA';font-size: 16px" />
     </div>
 
     <div class="upload">
       <h4>图片上传<span>(最多9张)</span></h4>
-      <AiUploader :def.sync="form.url" multiple placeholder="上传图片" :limit="9" action="/admin/file/add2"></AiUploader>
+      <AiUploader :def.sync="form.files" multiple placeholder="上传图片" :limit="9" action="/admin/file/add2"></AiUploader>
     </div>
 
     <div class="submitBtn">
-      <div class="btn">提交</div>
+      <div class="btn" @click="submit">提交</div>
     </div>
   </div>
 </template>
@@ -22,16 +22,43 @@ export default {
   appName: "进行回答",
   data() {
     return {
-      value: '',
       form: {
-        url: []
+        qid: '',
-      }
+        content: '',
+        files: []
+      },
+      flag: false,
+      
     }
   },
   methods: {
+    submit() {
+      if(this.flag) return
         
+      if(!this.form.content) {
+        return this.$u.toast('请输入回答内容')
+      }
+      this.flag = true
+      this.$http.post(`/app/applearningquestion/addOrUpdateAnswer`, {
+        ...this.form
+      }).then(res=> {
+        if(res?.code==0) {
+          this.$u.toast('提交成功！')
+          setTimeout(()=> {
+            uni.navigateBack()
+          }, 500)
+        }
+      })
+    }
+  },
+  onLoad(o) {
+    if(o.qid) {
+      this.form.qid = o?.qid
+    }
+    if(o.data) {
+      this.form = JSON.parse(o?.data)
+    }
   },
-  onShow() {},
 }
 </script>
 

src/project/fd/AppAnswer/answerDetail.vue

@@ -2,28 +2,24 @@
   <div class="answerDetail">
     <div class="head">
       <div class="left">
-        <img src="./img/avatar.png" alt="">
+        <img :src="info.createUserAvatar" alt="">
         <div class="head_avtar">
-          <h4>我</h4>
+          <h4>{{ info.createUserName }}</h4>
-          <div class="col-999">产品部</div>
+          <div class="col-999">{{ info.createUserDeptName }}</div>
         </div>
       </div>
-      <div class="right col-999">12-30 12:23:54</div>
+      <div class="right col-999">{{ info.createTime }}</div>
     </div>
     <div class="content">
-      极目新闻消息，据韩国《中央日报》报道，当地时间1月3日，韩国在对来自中国的入境者实施高强度防疫措施两天后，
+      {{ info.content }}
-      该国疾病预防控制中心运营的新冠信息管理系统出现错误，无法将中国入境者的信息传递给各地政府。
+    </div>
-      韩国仁川国际机场对中国游客进行检测（来源：韩联社）
+    <div class="picture">
-据韩国疾病控制与预防中心和首尔市政府称，从3日上午开始，新冠信息管理系统出现错误，因此，本应传达给全国市、县、区公共卫生部门的中国入境者信息无法送达。
+      <img :src="item.url" v-for="(item,index) in info.files" :key="index" alt=""
-有卫生部门人士表示：“疾病预防控制中心表示，下午2点左右系统将修复并恢复运行，但截止下午2时30分，还是没有恢复。”
+      @click="preview(info.files, item.url)">
     </div>
-
-    <!-- <img :src="item.url" v-for="(item,index) in data.files" :key="index" alt=""
-     @click="preview(data.files, item.url)"> -->
-
     <div class="btn_box">
-      <div class="del" @click="deleteBtn()">删除</div>
+      <div class="del" @click="deleteBtn(info.id)">删除</div>
-      <div class="edit" @click="linkTo(`./answerAdd`)">修改</div>
+      <div class="edit" @click="editBtn()">修改</div>
     </div>
   </div>
 </template>
@@ -33,14 +29,24 @@ export default {
   name: "answerDetail",
   appName: "Ta的回答",
   data() {
-
+    return {
+      info: {},
+    }
   },
   methods: {
+    editBtn() {
+      uni.navigateTo({
+        url: './answerAdd?data=' + JSON.stringify(this.info)
+      })
+    },
     deleteBtn(id) {
       this.$confirm('确定要删除该回答吗？').then(()=> {
-        this.$http.post(`/app/applearningquestion/deleteAnswer?id=${id}`,null, {
+        this.$http.post(`/app/applearningquestion/deleteAnswer?id=${id}`).then(res=> {
-          params: {
+          if(res?.code == 0) {
-
+            this.$u.toast('删除成功！')
+            setTimeout(()=> {
+              uni.navigateBack()
+            }, 500)
           }
         })
       })
@@ -52,7 +58,9 @@ export default {
       })
     },
   },
-  onShow() {},
+  onLoad(o) {
+    this.info = JSON.parse(o.data)
+  },
 
 }
 </script>
@@ -91,6 +99,15 @@ export default {
     margin-top: 24px;
   }
 
+  .picture {
+    margin-top: 24px;
+    img {
+      width: 220px;
+      height: 220px;
+      margin-right: 8px;
+    }
+  }
+
   .btn_box {
     position: fixed;
     bottom: 0;
@@ -100,6 +117,8 @@ export default {
     padding: 16px 32px;
     box-sizing: border-box;
     display: flex;
+    background: #f3f5f7;
+    z-index: 9;
     div {
       flex: 1;
       border-radius: 44px;

src/project/fd/AppAnswer/answerList.vue

@@ -1,70 +1,94 @@
 <template>
   <div class="answerList">
     <div class="answer_title">
-      基层工作如何展开相关工作合适基层工作如何展开相关工作合适
+      {{ info.content }}
     </div>
-    <p class="answer_tips">已有<span>15</span>条回答</p>
+    <p class="answer_tips">已有<span>{{ answersArr.length }}</span>条回答</p>
 
-    <div class="answer_card">
+    <div class="answer_card" v-for="item in answersArr" :key="item.id">
       <div class="card_head">
         <div class="left">
-          <img src="./img/avatar.png" alt="">
+          <img :src="item.createUserAvatar" alt="">
           <div class="card_head_avtar">
-            <h4>我</h4>
+            <h4>{{ item.createUserName }}</h4>
-            <div>产品部</div>
+            <div>{{ item.createUserDeptName }}</div>
           </div>
         </div>
-        <div class="right">12-30 12:23:54</div>
+        <div class="right">{{ item.createTime }}</div>
       </div>
-      <div class="card_body" @click="toDetail">
+      <div class="card_body" :class="item.createUserId != user.id? 'card_radius':''" @click="toDetail(item)">
         <div class="card_content">
-          据韩国《中央日报》报道,当地时间1月3日,韩国在对
+          {{ item.content }}
-          中国的入境者实施高强度防疫措施两天后,该国疾病预防控制中心运营的新冠信息管理系统出现错误,无法将传.
-          据韩国《中央日报》报道,当地时间1月3日,韩国在对中国的入境者实施高强度防疫措施中国的入境者实施高
-          强度防疫措施两天后韩国在对中国的入境者实施高强度防疫措施中国的入境者实施高强度防疫措施两天后
         </div>
       </div>
-      <div class="card_btn">
+      <div class="card_btn" v-if="item.createUserId == user.id">
-        <div @click="toEdit">修改</div>
+        <div @click="toEdit(item)">修改</div>
-        <div @click="deleteBtn">删除</div>
+        <div @click="deleteBtn(item.id)">删除</div>
       </div>
     </div>
 
-    <div class="btn" @click="toAdd">去回答</div>
+    <AiEmpty v-if="!answersArr.length" description="暂无数据"></AiEmpty>
+
+    <div class="btn" @click="toAdd(info.id)">去回答</div>
   </div>
 </template>
 
 <script>
+import { mapState } from 'vuex'
 export default {
   name: 'answerList',
   appName: '学习问答',
   data() {
     return {
       id: '',
-      answersArr: []
+      info: {},
+      answersArr: [],
     }
   },
+  computed: {
+    ...mapState(['user'])
+  },
   methods: {
     getDetail() {
       this.$http.post(`/app/applearningquestion/queryDetailById?id=${this.id}`).then(res=> {
         if(res?.data) {
-          console.log(res);
+          this.info = res.data
           this.answersArr = res.data.answers
         }
       })
     },
-    toDetail() {
+    toDetail(data) {
-      uni.navigateTo({url: `./answerDetail`})
+      uni.navigateTo({
+        url: './answerDetail?data=' + JSON.stringify(data)
+      })
     },
-    deleteBtn() {},
+    deleteBtn(id) {
-    toAdd() {
+      this.$confirm('确定要删除该回答吗？').then(()=> {
-      uni.navigateTo({url: `./answerAdd`})
+        this.$http.post(`/app/applearningquestion/deleteAnswer?id=${id}`).then(res=> {
+          if(res?.code == 0) {
+            this.$u.toast('删除成功！')
+            setTimeout(()=> {
+              this.getDetail()
+            }, 500)
+          }
+        })
+      })  
+    },
+    toEdit(data) {
+      uni.navigateTo({
+        url: './answerAdd?data=' + JSON.stringify(data)
+      })
+    },
+    toAdd(id) {
+      uni.navigateTo({url: `./answerAdd?qid=${id}`})
     },
   },
   onLoad(o) {
     this.id = o.id
-    this.getDetail()
   },
+  onShow() {
+    this.getDetail()
+  }
 }
 </script>
 
@@ -122,7 +146,7 @@ export default {
       background: #FFF;
       padding: 0 24px 24px 24px;
       box-sizing: border-box;
-      border-bottom: 2px solid #E4E5E6;
+      
       
       .card_content {
         height: 100%;
@@ -135,6 +159,10 @@ export default {
       }
     }
 
+    .card_radius {
+      border-radius: 0 0 16px 16px;
+    }
+    
     .card_btn {
       background: #FFF;
       height: 88px;
@@ -142,6 +170,7 @@ export default {
       display: flex;
       align-items: center;
       border-radius: 0 0 16px 16px;
+      border-top: 2px solid #E4E5E6;
       div {
         flex: 1;
         text-align: center;

src/project/fd/AppAnswer/component/List.vue

@@ -21,7 +21,7 @@
           </div>
           <div class="right">
             <span @click.stop="linkTo('./Add?id=' + item.id)" v-if="item.createUserId === user.id && item.answerCount === 0">修改问题</span>
-            <span @click.stop="linkTo('./answerAdd')">去回答</span>
+            <span @click.stop="linkTo(`./answerAdd?qid=${item.id}`)">去回答</span>
           </div>
         </div>
       </div>