From 9a743de23d1692215eb4437190a6686a0f1d5642 Mon Sep 17 00:00:00 2001
From: xuhuajiao <13476289682@163.com>
Date: Wed, 13 May 2026 17:03:52 +0800
Subject: [PATCH] =?UTF-8?q?=E5=BE=AE=E4=BF=A1=E5=B0=8F=E7=A8=8B=E5=BA=8F?=
 =?UTF-8?q?=E9=9C=80=E6=B1=82?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/weixin/index.js                       |  19 ++
 .../{index.vue => baseSetting.vue}            |  12 +
 src/views/weChatMiniProgram/feedback.vue      | 276 ++++++++++++++++++
 3 files changed, 307 insertions(+)
 create mode 100644 src/api/weixin/index.js
 rename src/views/weChatMiniProgram/{index.vue => baseSetting.vue} (94%)
 create mode 100644 src/views/weChatMiniProgram/feedback.vue

diff --git a/src/api/weixin/index.js b/src/api/weixin/index.js
new file mode 100644
index 0000000..858fbab
--- /dev/null
+++ b/src/api/weixin/index.js
@@ -0,0 +1,19 @@
+import request from '@/utils/request'
+// import qs from 'qs'
+
+// 回复读者留言
+// {
+//   "id": 0,
+//   "reply": "回复"
+// }
+export function FetchReplyReaderMessage(parameter) {
+  return request({
+    url: 'api/weixin/replyReaderMessage',
+    method: 'post',
+    data: parameter
+  })
+}
+
+export default {
+  FetchReplyReaderMessage
+}
diff --git a/src/views/weChatMiniProgram/index.vue b/src/views/weChatMiniProgram/baseSetting.vue
similarity index 94%
rename from src/views/weChatMiniProgram/index.vue
rename to src/views/weChatMiniProgram/baseSetting.vue
index a06307a..26e33d5 100644
--- a/src/views/weChatMiniProgram/index.vue
+++ b/src/views/weChatMiniProgram/baseSetting.vue
@@ -212,6 +212,7 @@
           </div>
           <!-- <div class="config-remarks">双击输入框可进行编辑。</div> -->
         </div>
+        <bookRecommend ref="bookRecommendRef" @ready="initScreenBookRecommend" />
       </div>
     </div>
   </div>
@@ -220,10 +221,12 @@
 <script>
 import { FetchInitScreenSetting, FetchEditScreenSetting } from '@/api/digitalScreen/index'
 import { mapGetters } from 'vuex'
+import bookRecommend from '../digitalScreen/module/bookRecommend'
 
 export default {
   name: 'WeChatMiniProgram',
   components: {
+    bookRecommend
   },
   data() {
     return {
@@ -278,6 +281,12 @@ export default {
     })
   },
   methods: {
+    initScreenBookRecommend() {
+      this.$refs.bookRecommendRef.initScreenBookRecommend()
+      if (this.$refs.bookRecommendRef) {
+        this.$refs.bookRecommendRef.updateBookSwiper()
+      }
+    },
     // 初始化智慧大屏基本数据
     initScreenSetting() {
       FetchInitScreenSetting({ 'libcode': this.user.fonds.fondsNo }).then(res => {
@@ -425,5 +434,8 @@ export default {
   border-radius: 4px;
   width: 100%;
 }
+.config-item{
+  padding: 10px 0 !important;
+}
 
 </style>
diff --git a/src/views/weChatMiniProgram/feedback.vue b/src/views/weChatMiniProgram/feedback.vue
new file mode 100644
index 0000000..3e60d0d
--- /dev/null
+++ b/src/views/weChatMiniProgram/feedback.vue
@@ -0,0 +1,276 @@
+<template>
+  <div class="app-container row-container">
+    <!--工具栏-->
+    <div class="head-container">
+      <div class="head-search" style="align-items: center;">
+        <el-input
+          v-model="keyWord"
+          size="small"
+          clearable
+          placeholder="请输入关键词"
+          style="width: 280px;"
+          class="input-prepend filter-item"
+          @clear="crud.toQuery"
+          @keyup.enter.native="crud.toQuery"
+        >
+          <el-select slot="prepend" v-model="optionVal" style="width: 100px" @change="searchChange">
+            <el-option
+              v-for="item in options"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value"
+            />
+          </el-select>
+        </el-input>
+        <el-select v-model="query.isReply" clearable size="small" placeholder="状态" class="filter-item" style="width: 100px" @change="crud.toQuery">
+          <i slot="prefix" class="iconfont icon-zhuangtai" />
+          <el-option v-for="item in enabledTypeOptions" :key="item.key" :label="item.display_name" :value="item.key" />
+        </el-select>
+        <rrOperation>
+          <template v-slot:right>
+            <el-button class="filter-item  filter-refresh" size="mini" type="warning" icon="el-icon-refresh-left" @click="resetQuery()">重置</el-button>
+          </template>
+        </rrOperation>
+      </div>
+      <crudOperation :permission="permission" />
+    </div>
+    <div class="container-wrap">
+      <span class="right-top-line" />
+      <span class="left-bottom-line" />
+
+      <el-dialog
+        title="读者留言"
+        :visible.sync="replyVisible"
+        width="800px"
+        append-to-body
+        :close-on-click-modal="false"
+        :before-close="clearReplyFormValidate"
+      >
+        <ul class="message-info-box" style="margin-bottom: 20px; padding: 15px; background: #f7f8fa; border-radius: 4px; line-height: 30px;">
+          <li>
+            <span style="color: #0c0e1e; width: 80px; display: inline-block;">读者证号：</span>
+            <span>{{ replyForm.readCardNo }}</span>
+          </li>
+          <li>
+            <span style="color: #0c0e1e; width: 80px; display: inline-block;">读者昵称：</span>
+            <span>{{ replyForm.readName }}</span>
+          </li>
+          <li>
+            <span style="color: #0c0e1e; width: 80px; display: inline-block;">联系方式：</span>
+            <span>{{ replyForm.phone }}</span>
+          </li>
+          <li>
+            <span style="color: #0c0e1e; width: 80px; display: inline-block;">留言主题：</span>
+            <span>{{ replyForm.title }}</span>
+          </li>
+          <li>
+            <span style="color: #0c0e1e; width: 80px; display: inline-block;">留言时间：</span>
+            <span>{{ replyForm.suggestionTime | parseTime }}</span>
+          </li>
+          <li style="border-top: 1px dashed #e4e7ed;">
+            <span style="color: #0c0e1e; width: 80px; display: inline-block; vertical-align: top;">留言内容：</span>
+            <span style="width: calc(100% - 85px); display: inline-block;">
+              {{ replyForm.suggestion }}
+            </span>
+          </li>
+          <li v-if="replyForm.reply" style="border-top: 1px dashed #e4e7ed; margin-top: 15px; padding-top: 10px;">
+            <span style="color: #0c0e1e; width: 80px; display: inline-block; vertical-align: top;">回复内容：</span>
+            <span style="width: calc(100% - 85px); display: inline-block;">
+              {{ replyForm.reply }}
+            </span>
+          </li>
+        </ul>
+
+        <el-form v-if="!replyForm.reply" ref="replyForm" :model="replyForm" :rules="replyRules" size="small">
+          <el-form-item label="回复内容" prop="reply">
+            <el-input
+              v-model="replyForm.reply"
+              type="textarea"
+              rows="5"
+              placeholder="请输入回复内容"
+              style="width: 762px;"
+              :readonly="!!replyForm.reply"
+              :style="{ backgroundColor: replyForm.reply ? '#f5f7fa' : '#fff' }"
+            />
+          </el-form-item>
+        </el-form>
+
+        <div slot="footer" class="dialog-footer">
+          <el-button @click="clearReplyFormValidate">关 闭</el-button>
+          <el-button
+            v-if="!replyForm.reply"
+            type="primary"
+            :loading="replyLoading"
+            @click="submitReply"
+          >
+            提 交
+          </el-button>
+        </div>
+      </el-dialog>
+
+      <!-- 表格 -->
+      <el-table ref="table" v-loading="crud.loading" highlight-current-row style="width: 100%;" height="calc(100vh - 330px)" :data="crud.data" @row-dblclick="onRowDblclick" @selection-change="crud.selectionChangeHandler">
+        <el-table-column prop="readCardNo" label="读者证号" />
+        <el-table-column prop="readName" label="读者昵称" />
+        <el-table-column prop="phone" label="联系方式" />
+        <el-table-column prop="title" label="留言主题" />
+        <el-table-column :show-overflow-tooltip="true" prop="suggestionTime" label="留言日期">
+          <template slot-scope="scope">
+            <div>{{ scope.row.suggestionTime | parseTime }}</div>
+          </template>
+        </el-table-column>
+        <el-table-column label="操作" width="100" align="center">
+          <template slot-scope="scope">
+            <el-button
+              v-if="!scope.row.reply"
+              type="text"
+              @click="handleReply(scope.row)"
+            >
+              回复
+            </el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+      <pagination v-if="crud.data.length !== 0" />
+    </div>
+  </div>
+</template>
+
+<script>
+import crudWeixin, { FetchReplyReaderMessage } from '@/api/weixin/index'
+import CRUD, { presenter, header, form, crud } from '@crud/crud'
+import rrOperation from '@crud/RR.operation'
+import crudOperation from '@crud/CRUD.operation'
+import pagination from '@crud/Pagination'
+import { mapGetters } from 'vuex'
+
+export default {
+  name: 'Column',
+  components: { pagination, crudOperation, rrOperation },
+  cruds() {
+    return CRUD({
+      title: '留言',
+      url: 'api/weixin/initReaderMessage',
+      crudMethod: { ...crudWeixin },
+      optShow: {
+        add: false,
+        edit: false,
+        del: false,
+        reset: false,
+        download: false,
+        group: false
+      }
+    })
+  },
+  mixins: [presenter(), header(), form(function() {
+    return Object.assign({ libcode: this.user.fonds.fondsNo })
+  }), crud()],
+  data() {
+    return {
+      keyWord: '',
+      optionVal: 'readCardNo',
+      options: [
+        { value: 'readCardNo', label: '读者证号' },
+        { value: 'readName', label: '读者昵称' },
+        { value: 'title', label: '留言主题' }
+      ],
+      replyVisible: false,
+      replyLoading: false,
+      replyForm: {
+        id: null,
+        reply: ''
+      },
+      replyRules: {
+        reply: [{ required: true, message: '请输入回复内容', trigger: 'blur' }]
+      },
+      permission: {
+        add: [],
+        edit: [],
+        del: []
+      },
+      enabledTypeOptions: [
+        { key: '1', display_name: '已回复' },
+        { key: '0', display_name: '未回复' }
+      ]
+    }
+  },
+  computed: {
+    ...mapGetters([
+      'baseApi',
+      'user'
+    ])
+  },
+  methods: {
+    [CRUD.HOOK.beforeRefresh]() {
+      this.crud.query.libcode = this.user.fonds.fondsNo
+      if (this.keyWord && this.optionVal) {
+        this.crud.query[this.optionVal] = this.keyWord
+      } else {
+        delete this.crud.query[this.optionVal]
+      }
+    },
+    resetQuery() {
+      this.keyWord = ''
+      this.crud.query[this.optionVal] = this.keyWord
+      this.crud.query.isReply = null
+      this.crud.toQuery()
+    },
+    searchChange(val) {
+      if (val) {
+        this.keyWord = ''
+        this.options.forEach(option => {
+          if (option.value !== val) {
+            this.crud.query[option.value] = null
+          }
+        })
+      }
+    },
+    handleReply(row) {
+      this.replyForm = { ...row }
+      this.replyVisible = true
+    },
+    onRowDblclick(row) {
+      this.replyForm = { ...row }
+      this.replyVisible = true
+    },
+    async submitReply() {
+      if (this.replyForm.reply) return
+      await this.$refs.replyForm.validate()
+      this.replyLoading = true
+      try {
+        const params = {
+          id: this.replyForm.id,
+          reply: this.replyForm.reply
+        }
+        await FetchReplyReaderMessage(params)
+        this.$message.success('回复成功')
+        this.replyVisible = false
+        this.crud.refresh()
+      } catch (error) {
+        this.$message.error('回复失败')
+        console.error(error)
+      } finally {
+        this.replyLoading = false
+      }
+    },
+    // 清空回复表单验证
+    clearReplyFormValidate() {
+      this.$nextTick(() => {
+        if (this.$refs.replyForm) {
+          this.$refs.replyForm.clearValidate()
+        }
+        this.replyVisible = false
+      })
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+::v-deep .input-prepend .el-input__inner{
+  padding-left: 110px;
+}
+::v-deep .el-dialog__footer{
+  padding: 0 0 20px 0 !important;
+}
+</style>