|
@@ -0,0 +1,510 @@
|
|
|
+<template>
|
|
|
+ <div id="stationLetter">
|
|
|
+ <div style="margin-bottom: 10px">
|
|
|
+ <p>
|
|
|
+ 共{{ total }}封,其中<span style="color: red">{{ dontRead }}</span>
|
|
|
+ 个消息未读
|
|
|
+ </p>
|
|
|
+ <div>
|
|
|
+ <el-button size="mini" type="primary" plain @click="haveRead"
|
|
|
+ >标记为已读</el-button
|
|
|
+ ><el-button
|
|
|
+ v-if="false"
|
|
|
+ size="mini"
|
|
|
+ type="primary"
|
|
|
+ plain
|
|
|
+ @click="notHaveRead"
|
|
|
+ >标记为未读</el-button
|
|
|
+ ><span style="font-size: 14px; margin-left: 10px">状态:</span
|
|
|
+ ><el-select
|
|
|
+ size="mini"
|
|
|
+ v-model="formData.receiptStatus"
|
|
|
+ placeholder="请选择状态"
|
|
|
+ @change="changeStatus"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in options"
|
|
|
+ :key="item.value"
|
|
|
+ :label="item.label"
|
|
|
+ :value="item.value"
|
|
|
+ >
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <el-table
|
|
|
+ :data="tableData"
|
|
|
+ style="width: 100%"
|
|
|
+ border
|
|
|
+ row-key="id"
|
|
|
+ ref="tableData"
|
|
|
+ >
|
|
|
+ <el-table-column
|
|
|
+ type="selection"
|
|
|
+ width="55"
|
|
|
+ align="center"
|
|
|
+ reserve-selection
|
|
|
+ :selectable="canSelect"
|
|
|
+ >
|
|
|
+ </el-table-column>
|
|
|
+
|
|
|
+ <template v-for="(item, index) in tableSet">
|
|
|
+ <el-table-column
|
|
|
+ :width="item.width"
|
|
|
+ :key="index"
|
|
|
+ :label="item.label"
|
|
|
+ align="center"
|
|
|
+ :sortable="item.prop === 'sort'"
|
|
|
+ :show-overflow-tooltip="true"
|
|
|
+ header-align="center"
|
|
|
+ :prop="item.prop"
|
|
|
+ sort-by="sort"
|
|
|
+ >
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <i
|
|
|
+ v-if="item.scope === 'icon'"
|
|
|
+ :style="
|
|
|
+ scope.row[item.prop] === 0
|
|
|
+ ? 'color:#409EFF;'
|
|
|
+ : scope.row[item.prop] === 1
|
|
|
+ ? 'color:#eee;'
|
|
|
+ : ''
|
|
|
+ "
|
|
|
+ style="font-size: 18px"
|
|
|
+ class="el-icon-s-comment"
|
|
|
+ ></i>
|
|
|
+ <span v-else-if="item.scope === 'theme'">
|
|
|
+ <strong style="margin-left: 10px">{{
|
|
|
+ scope.row[item.prop1]
|
|
|
+ }}</strong
|
|
|
+ ><span>{{ scope.row[item.prop2] }}</span>
|
|
|
+ </span>
|
|
|
+ <span v-else-if="item.scope === 'aTimeList'">{{
|
|
|
+ $methodsTools.onlyForma(scope.row[item.prop])
|
|
|
+ }}</span>
|
|
|
+ <span v-else>{{ scope.row[item.prop] }}</span></template
|
|
|
+ ></el-table-column
|
|
|
+ ></template
|
|
|
+ ><el-table-column label="操作" align="center" fixed="right" width="180px">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-button size="mini" @click="newSee(scope.row)" type="text"
|
|
|
+ >立即查看</el-button
|
|
|
+ ><el-button
|
|
|
+ size="mini"
|
|
|
+ :disabled="scope.row.receiptStatus === 1"
|
|
|
+ @click="haveReadID(scope.row.id)"
|
|
|
+ type="text"
|
|
|
+ >标记为已读</el-button
|
|
|
+ >
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ <pagination
|
|
|
+ :total="total"
|
|
|
+ :pageSize="formData.pageSize"
|
|
|
+ :currentPage="formData.pageNum"
|
|
|
+ @handleSizeChange="handleSizeChange"
|
|
|
+ @handleCurrentChange="handleCurrentChange"
|
|
|
+ />
|
|
|
+ <el-dialog
|
|
|
+ :visible.sync="dialogCG"
|
|
|
+ width="760px"
|
|
|
+ :show-close="false"
|
|
|
+ :close-on-click-modal="false"
|
|
|
+ >
|
|
|
+ <div slot="title" class="hearders">
|
|
|
+ <div class="leftTitle">查看消息</div>
|
|
|
+ <div class="rightBoxs">
|
|
|
+ <img
|
|
|
+ src="@/assets/images/Close@2x.png"
|
|
|
+ alt=""
|
|
|
+ @click="dialogCG = false"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <h3 style="color: #333; font-weight: bold">{{ newData.remind }}</h3>
|
|
|
+ <p>{{ newData.text }}</p>
|
|
|
+ <span slot="footer" class="dialog-footer">
|
|
|
+ <el-button @click="dialogCG = false">关闭</el-button>
|
|
|
+ <el-button
|
|
|
+ v-if="false"
|
|
|
+ type="primary"
|
|
|
+ @click="
|
|
|
+ submitChecks(
|
|
|
+ newData.type === 2 || newData.type === 3
|
|
|
+ ? 2
|
|
|
+ : newData.type === 4
|
|
|
+ ? 3
|
|
|
+ : 1
|
|
|
+ )
|
|
|
+ "
|
|
|
+ >{{
|
|
|
+ newData.type === 2 || newData.type === 3
|
|
|
+ ? "查看订单"
|
|
|
+ : newData.type === 4
|
|
|
+ ? "查看活动"
|
|
|
+ : "查看学员"
|
|
|
+ }}</el-button
|
|
|
+ >
|
|
|
+ </span>
|
|
|
+ </el-dialog>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import pagination from "@/components/pagination";
|
|
|
+export default {
|
|
|
+ name: "StationLetter",
|
|
|
+ components: { pagination },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ newData: { remind: "" }, //当前数据
|
|
|
+ options: [
|
|
|
+ {
|
|
|
+ label: "全部",
|
|
|
+ value: "",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: "已读",
|
|
|
+ value: 1,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: "未读",
|
|
|
+ value: 0,
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ total: 0,
|
|
|
+ dontRead: 0, //未读
|
|
|
+ formData: {
|
|
|
+ pageSize: 10,
|
|
|
+ pageNum: 1,
|
|
|
+ receiptStatus: "",
|
|
|
+ systemStatus: 1,
|
|
|
+ },
|
|
|
+ tableSet: [
|
|
|
+ {
|
|
|
+ label: "状态",
|
|
|
+ prop: "receiptStatus",
|
|
|
+ scope: "icon",
|
|
|
+ width: "80px",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: "主题",
|
|
|
+ prop1: "remind",
|
|
|
+ prop2: "text",
|
|
|
+ scope: "theme",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: "发送时间",
|
|
|
+ prop: "sendTime",
|
|
|
+ scope: "aTimeList",
|
|
|
+ width: "220px",
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ tableData: [],
|
|
|
+ loading: false,
|
|
|
+ dialogCG: false,
|
|
|
+ };
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ this.search();
|
|
|
+ if (this.$route.params.id) {
|
|
|
+ this.$api.informsys_user(this.$route.params.id).then((res) => {
|
|
|
+ if (res.data) {
|
|
|
+ this.newSee(res.data);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ /**
|
|
|
+ * 查看消息
|
|
|
+ */
|
|
|
+ newSee(data) {
|
|
|
+ this.newData = JSON.parse(JSON.stringify(data));
|
|
|
+ this.dialogCG = true;
|
|
|
+ if (data.receiptStatus !== 1) {
|
|
|
+ this.haveReadID(data.id, false);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 单个标记已读
|
|
|
+ */
|
|
|
+ haveReadID(id, status = true) {
|
|
|
+ this.$api
|
|
|
+ .editupdateReadStatusBatch({ ids: [id], receiptStatus: 1 })
|
|
|
+ .then((res) => {
|
|
|
+ if (status) {
|
|
|
+ this.$message.success("已读成功");
|
|
|
+ this.$refs.tableData.clearSelection();
|
|
|
+ }
|
|
|
+ this.search();
|
|
|
+ });
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 切换消息状态
|
|
|
+ */
|
|
|
+ changeStatus(val) {
|
|
|
+ this.formData.pageSize = 10;
|
|
|
+ this.formData.pageNum = 1;
|
|
|
+ this.search();
|
|
|
+ },
|
|
|
+ search() {
|
|
|
+ this.loading = true;
|
|
|
+ this.$api
|
|
|
+ .inquireinformsys_userlist(this.formData)
|
|
|
+ .then((res) => {
|
|
|
+ this.total = res.total;
|
|
|
+ this.tableData = res.rows;
|
|
|
+ })
|
|
|
+ .finally(() => {
|
|
|
+ this.loading = false;
|
|
|
+ });
|
|
|
+ this.$api
|
|
|
+ .inquireinformsys_userinformUnReadSum({ systemStatus: 1 })
|
|
|
+ .then((res) => {
|
|
|
+ this.dontRead = res.data;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 查看学员
|
|
|
+ */
|
|
|
+ submitChecks(int) {
|
|
|
+ this.dialogCG = false;
|
|
|
+ if (int === 3) {
|
|
|
+ const jump = () => {
|
|
|
+ //分销活动列表
|
|
|
+ this.$router.push({
|
|
|
+ name: "ActivityList",
|
|
|
+ });
|
|
|
+ };
|
|
|
+ const statusPage = this.$store.state.tagsView.visitedViews.some(
|
|
|
+ (item) => {
|
|
|
+ return item.name == "ActivityList";
|
|
|
+ }
|
|
|
+ );
|
|
|
+ if (statusPage) {
|
|
|
+ this.$store
|
|
|
+ .dispatch("tagsView/delCachedView", {
|
|
|
+ name: "ActivityList",
|
|
|
+ })
|
|
|
+ .then((res) => {
|
|
|
+ jump();
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ jump();
|
|
|
+ }
|
|
|
+ }
|
|
|
+ if (int === 2) {
|
|
|
+ const jump = () => {
|
|
|
+ //退款订单列表
|
|
|
+ this.$router.push({
|
|
|
+ name: "PendingRefundOrder",
|
|
|
+ params: {
|
|
|
+ orderSn: this.newData.orderSn,
|
|
|
+ type:
|
|
|
+ this.newData.type === 3
|
|
|
+ ? "1,2"
|
|
|
+ : this.newData.type === 2
|
|
|
+ ? "0"
|
|
|
+ : "",
|
|
|
+ },
|
|
|
+ });
|
|
|
+ };
|
|
|
+ const statusPage = this.$store.state.tagsView.visitedViews.some(
|
|
|
+ (item) => {
|
|
|
+ return item.name == "PendingRefundOrder";
|
|
|
+ }
|
|
|
+ );
|
|
|
+ if (statusPage) {
|
|
|
+ this.$store
|
|
|
+ .dispatch("tagsView/delCachedView", {
|
|
|
+ name: "PendingRefundOrder",
|
|
|
+ })
|
|
|
+ .then((res) => {
|
|
|
+ jump();
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ jump();
|
|
|
+ }
|
|
|
+ }
|
|
|
+ if (int === 1) {
|
|
|
+ const jump = () => {
|
|
|
+ //学员详情
|
|
|
+ this.$router.push({
|
|
|
+ name: "StudentXQ",
|
|
|
+ query: {
|
|
|
+ id: this.newData.studentUserId,
|
|
|
+ },
|
|
|
+ });
|
|
|
+ };
|
|
|
+ const statusPage = this.$store.state.tagsView.visitedViews.some(
|
|
|
+ (item) => {
|
|
|
+ return item.name == "StudentXQ";
|
|
|
+ }
|
|
|
+ );
|
|
|
+ if (statusPage) {
|
|
|
+ this.$store
|
|
|
+ .dispatch("tagsView/delCachedView", {
|
|
|
+ name: "StudentXQ",
|
|
|
+ })
|
|
|
+ .then((res) => {
|
|
|
+ jump();
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ jump();
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 已读
|
|
|
+ */
|
|
|
+ haveRead() {
|
|
|
+ const idList = this.$refs.tableData.selection.map((item) => {
|
|
|
+ return item.id;
|
|
|
+ });
|
|
|
+ if (idList.length == 0) {
|
|
|
+ this.$message.warning("请选择需要标记已读的数据");
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ this.$api
|
|
|
+ .editupdateReadStatusBatch({ ids: idList, receiptStatus: 1 })
|
|
|
+ .then((res) => {
|
|
|
+ this.$message.success("已读成功");
|
|
|
+ this.$refs.tableData.clearSelection();
|
|
|
+ this.search();
|
|
|
+ });
|
|
|
+ console.log(idList);
|
|
|
+ },
|
|
|
+ notHaveRead() {
|
|
|
+ const idList = this.$refs.tableData.selection.map((item) => {
|
|
|
+ return item.id;
|
|
|
+ });
|
|
|
+ if (idList.length == 0) {
|
|
|
+ this.$message.warning("请选择需要标记已读的数据");
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ this.$api
|
|
|
+ .editupdateReadStatusBatch({ ids: idList, receiptStatus: 0 })
|
|
|
+ .then((res) => {
|
|
|
+ this.$message.success("未读成功");
|
|
|
+ this.$refs.tableData.clearSelection();
|
|
|
+ this.search();
|
|
|
+ });
|
|
|
+ console.log(idList);
|
|
|
+ },
|
|
|
+ handleSizeChange(v) {
|
|
|
+ this.formData.pageSize = v;
|
|
|
+ this.formData.pageNum = 1;
|
|
|
+ this.search();
|
|
|
+ },
|
|
|
+ handleCurrentChange(v) {
|
|
|
+ this.formData.pageNum = v;
|
|
|
+ this.search();
|
|
|
+ },
|
|
|
+ canSelect(row, index) {
|
|
|
+ if (row.receiptStatus === 0) {
|
|
|
+ return true;
|
|
|
+ } else {
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ },
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="less" scoped>
|
|
|
+/deep/.el-button {
|
|
|
+ border-radius: 8px;
|
|
|
+}
|
|
|
+/deep/.el-dialog {
|
|
|
+ border-radius: 8px;
|
|
|
+ .el-dialog__header {
|
|
|
+ padding: 0;
|
|
|
+ .hearders {
|
|
|
+ height: 40px;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+ padding: 0px 18px 0px 20px;
|
|
|
+ border-bottom: 1px solid #e2e2e2;
|
|
|
+ .leftTitle {
|
|
|
+ font-size: 14px;
|
|
|
+ font-weight: bold;
|
|
|
+ color: #2f4378;
|
|
|
+ }
|
|
|
+ .rightBoxs {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ img {
|
|
|
+ width: 14px;
|
|
|
+ height: 14px;
|
|
|
+ margin-left: 13px;
|
|
|
+ cursor: pointer;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .el-dialog__body {
|
|
|
+ max-height: 500px;
|
|
|
+ overflow: auto;
|
|
|
+ }
|
|
|
+ .el-dialog__footer {
|
|
|
+ padding: 0;
|
|
|
+ .dialog-footer {
|
|
|
+ padding: 0px 40px;
|
|
|
+ height: 70px;
|
|
|
+ border-top: 1px solid #e2e2e2;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: flex-end;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+.imgBox {
|
|
|
+ width: 100%;
|
|
|
+ // height: 210px;
|
|
|
+ border: 1px solid #e2e2e2;
|
|
|
+ border-radius: 8px;
|
|
|
+ padding: 8px 8px 3px;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ align-items: center;
|
|
|
+ .imgLabel {
|
|
|
+ flex: 1;
|
|
|
+ width: 100%;
|
|
|
+ border: 1px dotted #e2e2e2;
|
|
|
+ color: #999;
|
|
|
+ font-size: 14px;
|
|
|
+ cursor: pointer;
|
|
|
+ border-radius: 8px;
|
|
|
+ .msPhoto {
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ max-width: 100%;
|
|
|
+ max-height: 270px;
|
|
|
+ img {
|
|
|
+ max-width: 100%;
|
|
|
+ max-height: 270px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .imgbbx {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ i {
|
|
|
+ font-weight: bold;
|
|
|
+ margin: 14px 0;
|
|
|
+ font-size: 24px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ p {
|
|
|
+ margin: 5px 0px;
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|