活动评价

杨泽宇
1 parent 81d95a24
Showing 6 changed files with 282 additions and 2 deletions
docs/develop/dict.md
docs/index.html
src/api/event/index.ts
src/router/modules/event.ts
src/views/event/config.ts
src/views/event/feedback/index.vue
@@ -153,4 +153,12 @@
     | 进行中 |  | 2 |
     | 已结束 |  | 3 |
     | 活动结束 | 草稿 | 4 |
-    | 活动结束 | 发布 | 5 |
 \ No newline at end of file
+    | 活动结束 | 发布 | 5 |
+
+  * 活动状态和总结状态  `onlineStatus: Array`  [查看代码](http://bj.gitlab.cnlive.com/cnlive_project/cnlive-community-web-vue/blob/dev/src/views/event/config.ts)
+    | 活动状态 | 总结状态 | value |
+    | :-----: | :------: | :---: |
+    | 初始状态 |  | 0 |
+    | 机审通过 |  | 1 |
+    | 上线 |  | 2 |
+    | 机审失败 |  | -1 |
 \ No newline at end of file
@@ -19,7 +19,7 @@
     <!-- 顶部导航 -->
     <nav>
       <a href="http://bj.gitlab.cnlive.com/cnlive_project/cnlive-community-web-vue">代码仓库</a>
-      <a href="http://test.community.web.cnlive.com/doc.html">接口API</a>
+      <a href="http://test.community.cnlive.com/doc.html">接口API</a>
       <a href="http://testweb.community.cnlive.com">中国网+智慧社区平台</a>
     </nav>
     <div id="app"></div>
@@ -78,4 +78,30 @@ export const eventCategory = async ( params: any ) =&gt; {
     data: data
   })
   return res
+}
+
+/**
+ * @description 活动评价列表
+ * @function feedbackList
+ */
+ export const feedbackList = async ( params: any ) => {
+  let res: any = await request({
+    method: 'get',
+    url: '/feedback/list',
+    params: deleteEmptyParam(params)
+  })
+  return res
+}
+
+/**
+ * @description 活动评价上下线
+ * @function feedbackStatus
+ */
+ export const feedbackStatus = async ( params: any ) => {
+  let res: any = await request({
+    method: 'post',
+    url: '/feedback/status',
+    params: params
+  })
+  return res
 }
 \ No newline at end of file
@@ -18,6 +18,11 @@ const event = {
     name: 'handworkEdit',
     component: () => import('@/views/event/handwork/edit.vue'),
     meta: { title: '手工活动编辑' }
+  }, {
+    path: '/event/feedback',
+    name: 'feedback',
+    component: () => import('@/views/event/feedback/index.vue'),
+    meta: { title: '活动评价' }
   }]
 }
  
+import type { EnumArrayItem } from "@/@type/module/basic"
+
 interface Item {
   status: string,
   publish: string,
@@ -36,4 +38,21 @@ export const statusData: Item[] = [
     publish: '发布',
     value: 5
   }
+]
+
+// 活动评价展示到前台状态
+export const onlineStatus: EnumArrayItem[] = [
+  {
+    label: '初始状态',
+    value: 0
+  }, {
+    label: '机审通过',
+    value: 1
+  }, {
+    label: '机审失败',
+    value: -1
+  }, {
+    label: '上线',
+    value: 2
+  }
 ]
 \ No newline at end of file
+<script setup lang="ts">
+import { reactive, ref, onMounted, getCurrentInstance } from "vue";
+import { feedbackStatus, feedbackList } from "@/api/event";
+import { parseTime, globalFilters } from "@/utils/tool";
+import { onlineStatus } from "./../config";
+import Pagination from "@/components/Pagination/index.vue";
+import { ElMessageBox, ElMessage } from "element-plus";
+import type { ElTable } from "element-plus";
+interface Form {
+  page: number;
+  pageSize: number;
+  handworkName: string;
+  startTime: string;
+  endTime: string;
+}
+interface Params {
+  total: number;
+  query: Form;
+}
+interface Data {
+  loading: boolean;
+  list: any[] | null;
+  onlineStatus: any[] | null;
+  params: Params;
+}
+let data = reactive({
+  list: [],
+  onlineStatus: onlineStatus,
+  loading: false,
+  params: {
+    total: 0,
+    query: {
+      page: 1,
+      pageSize: 10,
+      handworkName: "",
+      startTime: "",
+      endTime: "",
+    },
+  },
+});
+const value1 = ref([]);
+let multipleSelection = ref<any[]>([]);
+const multipleTableRef = ref<InstanceType<typeof ElTable>>();
+/**
+ * 表格选中响应
+ * @param {array} data 选中的一条数据
+ */
+const handleSelectionChange = (data: array) => {
+  multipleSelection.value = data;
+};
+/**
+ * 时间组件回调
+ * @param {array} value [开始时间, 结束时间]
+ */
+const handleTimeChange = (value: array) => {
+  data.params.query.beginTime = value ? value[0] : "";
+  data.params.query.endTime = value ? value[1] : "";
+  getList();
+};
+/**
+ * 上下线状态切换
+ * @param {object} obj 要操作的数据对象
+ */
+const handleLine = (obj: any) => {
+  ElMessageBox.confirm("确认切换显示状态吗?", "警告", {
+    confirmButtonText: "确认",
+    cancelButtonText: "取消",
+    type: "warning",
+  })
+    .then(async () => {
+      try {
+        let res = await feedbackStatus({
+          ids: obj.id,
+          status: obj.status
+        });
+        if (res?.data) {
+          ElMessage({
+            type: "success",
+            message: "操作成功",
+          });
+          getList();
+        } else {
+          ElMessage({
+            type: "error",
+            message: "操作失败",
+          });
+        }
+      } catch (e) {
+        console.log(e);
+      }
+    })
+    .catch(() => {
+      console.log("取消");
+    });
+};
+/**
+ * 列表
+ */
+const getList = async () => {
+  data.loading = true;
+  try {
+    const res = await feedbackList(data.params.query);
+    data.list = res?.data?.data?.list;
+    data.params.total = res?.data?.data?.total;
+  } catch (e) {
+    console.log(e);
+  } finally {
+    data.loading = false;
+  }
+};
+onMounted(() => {
+  getList();
+});
+</script>
+
+<template>
+  <div class="page-container">
+    <h1>活动评价</h1>
+    <el-row style="padding-bottom: 20px">
+      <el-form :inline="true" label-width="70px">
+        <el-form-item label="时间">
+          <el-date-picker
+            v-model="value1"
+            type="datetimerange"
+            range-separator="至"
+            format="YYYY-MM-DD HH:mm:ss"
+            value-format="YYYY-MM-DD HH:mm:ss"
+            start-placeholder="开始时间"
+            end-placeholder="结束时间"
+            @change="handleTimeChange"
+          >
+          </el-date-picker>
+        </el-form-item>
+        <el-form-item label="名称">
+          <el-input
+            v-model.trim="data.params.query.handworkName"
+            placeholder="请填写名称"
+            maxlength="15"
+            @change="getList"
+          />
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" @click="getList">查询</el-button>
+          <el-button
+            type="success"
+            @click="
+              handleLine({ id: multipleSelection.map((i) => i.id).join(','), status: 2 })
+            "
+            :disabled="!multipleSelection.length"
+            >批量上线</el-button
+          >
+          <el-button
+            type="info"
+            @click="
+              handleLine({ id: multipleSelection.map((i) => i.id).join(','), status: 1 })
+            "
+            :disabled="!multipleSelection.length"
+            >批量下线</el-button
+          >
+        </el-form-item>
+      </el-form>
+    </el-row>
+    <el-table
+      :data="data.list"
+      style="width: 100%"
+      border
+      v-loading="data.loading"
+      align="center"
+      element-loading-text="拼命加载中"
+      ref="multipleTableRef"
+      @selection-change="handleSelectionChange"
+    >
+      <el-table-column
+        type="selection"
+        align="center"
+      />
+      <el-table-column prop="id" label="ID" align="center"></el-table-column>
+      <el-table-column
+        prop="userName"
+        label="用户"
+        align="center"
+      ></el-table-column>
+      <el-table-column
+        prop="handworkName"
+        label="活动名称"
+        align="center"
+      ></el-table-column>
+      <el-table-column
+        prop="comment"
+        label="评价"
+        align="center"
+      ></el-table-column>
+      <el-table-column prop="isAnonymity" label="匿名状态" align="center">
+        <template #default="scope">
+          {{ scope.row.isAnonymity ? "匿名" : "实名" }}
+        </template>
+      </el-table-column>
+      <el-table-column prop="status" label="显示到前台" align="center">
+        <template #default="scope">
+          {{ globalFilters(scope.row.status, data.onlineStatus) }}
+        </template>
+      </el-table-column>
+      <el-table-column prop="createTime" label="评价时间" align="center">
+        <template #default="scope">
+          {{ parseTime(new Date(scope.row.createTime).getTime()) }}
+        </template>
+      </el-table-column>
+      <el-table-column label="操作" align="center">
+        <template #default="scope">
+          <el-button type="text" v-if="~~scope.row.status === 1" @click="handleLine({id: scope.row.id, status: 2})">上线</el-button>
+          <el-button type="text" v-if="~~scope.row.status === 2" @click="handleLine({id: scope.row.id, status: 1})">下线</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+    <Pagination
+      :total="data.params.total"
+      v-model:currentPage="data.params.query.page"
+      v-model:pageSize="data.params.query.pageSize"
+      @pageChange="getList"
+    ></Pagination>
+  </div>
+</template>