dev/dcp-web-gate/src_old/views/helpCenter/developmentCooperation.vue

<template>
	<div class="autoBox box">
		<div class="crumbs">
			<el-breadcrumb separator="/">
				<el-breadcrumb-item :to="{ path: 'home' }">{{
						$t("common.Home")
					}}
				</el-breadcrumb-item>
				<el-breadcrumb-item>{{ $t("common.Guestbook") }}</el-breadcrumb-item>
			</el-breadcrumb>
		</div>
		<!-- 留言字典 -->
		<div style="margin-top: 20px">
			<div
					style="
          margin-left: 20px;
          width: 1160px;
          background-color: rgb(247, 247, 247);
        "
			>
				<div
						style="
            width: 100%;
            line-height: 50px;
            border-bottom: 1px solid #f4f4f4;
            word-break: break-all;
          "
						v-if="classifiedMessage"
				>
          <span
		          style="
              font-size: 14px;
              font-weight: 700;
              color: #000;
              margin-left: 20px;
            "
          >{{ $t(classifiedMessage.value) }}</span
          >
					<span
							style="
              margin-left: 15px;
              font-size: 14px;
              font-weight: 400;
              word-break: break-all;
            "
							:class="
              dictParam.classifiedMessage == item.id ? 'lable1' : 'lable2'
            "
							v-for="(item, e) in classifiedMessage.item"
							@click="changeDictParam('classifiedMessage', item.id)"
							class="cursor"
					>{{
							item.name == "common.All" ? $t("common.All") : item.name
						}}</span
					>
				</div>
				<div
						style="
            width: 100%;
            line-height: 50px;
            border-bottom: 1px solid #f4f4f4;
            word-break: break-all;
          "
						v-if="questionType"
				>
          <span
		          style="
              font-size: 14px;
              font-weight: 700;
              color: #000;
              margin-left: 20px;
            "
          >{{ $t(questionType.value) }}</span
          >
					<span
							style="margin-left: 15px; font-size: 14px; font-weight: 400"
							:class="dictParam.questionType == item.id ? 'lable1' : 'lable2'"
							v-for="(item, e) in questionType.item"
							@click="changeDictParam('questionType', item.id)"
							class="cursor"
					>{{
							item.name == "common.All" ? $t("common.All") : item.name
						}}</span
					>
				</div>
			</div>
		</div>
		<!-- 查询 -->
		<!-- <div style="margin: 30px 0;">
						<el-input :placeholder="$t('common.Keywords')"  class="input-with-select" style="width: 500px;margin-left: 25px;border: 1px solid rgb(48, 84, 140);"></el-input>
						<el-button class="cursor" slot="append" type="primary" style="background-color: #30548c;color: #ffffff;border-radius:0;border: 1px solid rgb(48, 84, 140);height: 42px;"
							 >{{$t('common.Search')}}</el-button>
				</div> -->
		<!-- 热门留言按钮 -->
		<div style="margin: 20px 0 0 20px">
			<ul>
				<li
						id="1"
						@click="changeActive($event)"
						:class="active == 1 ? 'active' : ''"
				>
					{{ $t("common.All") }}
				</li>
				<li
						id="2"
						@click="changeActive($event)"
						:class="active == 2 ? 'active' : ''"
				>
					{{ $t("common.Hotcomments") }}
				</li>
				<li
						id="3"
						@click="changeActive($event)"
						:class="active == 3 ? 'active' : ''"
				>
					{{ $t("common.Mymessage") }}
				</li>
				<li
						id="4"
						@click="changeActive($event)"
						:class="active == 4 ? 'active' : ''"
				>
					{{ $t("common.myCollections") }}
				</li>
				<!-- 我要留言按钮 -->
				<span
						style="float: right; margin-right: 50px"
						class="active addClass"
						@click="getList"
				>+ {{ $t("common.giveComments") }}</span
				>
			</ul>
		</div>

		<!-- 留言内容 -->
		<div style="margin: 20px auto; width: 92%; border-top: 1px solid #aaaaaa">
			<div class="messageBox" v-for="(item, index) in initData">
				<!-- <div class="messageBox" style="cursor: pointer;" @click="toView('developmentDetails',item)">    @click="toView('developmentDetails',item)"-->
				<!-- 问 -->
				<div style="height: 70px; padding: 0 30px">
					<div
							style="
              float: left;
              width: 40px;
              height: 40px;
              border-radius: 50%;
              background: #e3bb03;
              margin-top: 15px;
              text-align: center;
            "
					>
						<img
								v-if="$i18n.locale == 'zh'"
								src="@/assets/img/helpCenter/ask.png"
								alt=""
								style="width: 100%; border-radius: 50%"
						/>
						<img
								v-if="$i18n.locale == 'en'"
								src="@/assets/img/helpCenter/q.png"
								alt=""
								style="width: 100%; border-radius: 50%"
						/>

						<!-- <span style="color:#fff;font-size: 20px;font-weight: 700;line-height: 36px;">{{$t('common.Q')}}</span> -->
					</div>
					<span
							style="
              float: left;
              width: 90%;
              font-size: 24px;
              margin-left: 20px;
              line-height: 70px;
              overflow: hidden;
              text-overflow: ellipsis;
              white-space: nowrap;
            "
					>
            {{ item.title }}
            <span v-if="active == 3 && item.status == 1 && $i18n.locale == 'zh'"
            >(已回复)</span
            >
            <span v-if="active == 3 && item.status == 1 && $i18n.locale == 'en'"
            >(Replied)</span
            >
            <span v-if="active == 3 && item.status != 1 && $i18n.locale == 'zh'"
            >(未回复)</span
            >
            <span v-if="active == 3 && item.status != 1 && $i18n.locale == 'en'"
            >(No Reply)</span
            >
          </span>
				</div>
				<div>
					<div style="width: 92%; float: right">
						<div style="display: block">
              <span
		              style="
                  float: left;
                  color: #00d6e8;
                  width: 70%;
                  overflow: hidden;
                  text-overflow: ellipsis;
                  white-space: nowrap;
                  font-size: 14px;
                "
              >
                <img
		                v-if="item.imagesPath"
		                :src="imageAddPath(item.imagesPath)"
		                alt=""
		                style="width: 20px; height: 20px; border-radius: 50%"
                />
                {{ item.userName }}
              </span>
							<span style="float: right; color: #c1c1c1; font-size: 14px"
							>{{ $t("common.MessageTime") }}：<span>
                  {{ item.createDate }}
                </span></span
							>
						</div>
						<div style="margin: 50px 0">
							<p v-html="item.content" style="font-size: 16px"></p>
						</div>
						<div style="margin: 50px 0">
							<div
									style="
                  background-color: #fcecd5;
                  color: #ecac90;
                  font-size: 12px;
                  line-height: 18px;
                  text-align: center;
                  height: 20px;
                  border-radius: 15px;
                  float: left;
                  margin-right: 20px;
                  padding: 0 10px;
                "
							>
								{{ item.columnNameParent }}
							</div>
							<div
									style="
                  background-color: #fcecd5;
                  color: #ecac90;
                  font-size: 12px;
                  line-height: 18px;
                  text-align: center;
                  height: 20px;
                  border-radius: 15px;
                  float: left;
                  margin-right: 20px;
                  padding: 0 10px;
                "
							>
								{{ item.columnName }}
							</div>

							<!-- <span style="float:right;margin-left:34px;color:#c1c1c1"><span style="color:#000">{{item.replyStatus}} </span>{{$t('common.Reply')}}</span> -->
							<!-- <span style="float:right;margin-left:34px;color:#c1c1c1"><span style="color:#000">{{item.collectNum}} </span>{{$t('common.Collect')}}</span> -->
							<span
									style="
                  float: right;
                  margin-left: 34px;
                  color: #c1c1c1;
                  font-size: 14px;
                "
							>
                <span style="color: #000">{{ item.likeNum }} </span>
                {{ $t("common.Praise") }}
              </span>
							<span
									class="share cursor"
									:style="item.ifcommon ? 'color: #66b1ff;' : 'color:#c1c1c1'"
									style="margin-right: 20px; float: right; font-size: 14px"
									ref="likeclick"
									@click="shareChange(item.id, item)"
							>
                <i
		                class="el-icon-star-off"
		                :style="item.ifcommon ? 'color: #66b1ff;' : '#c1c1c1'"
                ></i>
                {{ item.ifcommon ? $t("common.Liked") : $t("common.Tolike") }}
              </span>
							<span
									class="share cursor"
									:style="
                  item.ifcommonCollect ? 'color: #66b1ff;' : 'color:#c1c1c1'
                "
									style="margin-right: 20px; float: right; font-size: 14px"
									ref="likeclick"
									@click="collect(item, item.ifcommonCollect)"
							>
                <i
		                class="el-icon-star-off"
		                :style="item.ifcommonCollect ? 'color: #66b1ff;' : '#c1c1c1'"
                ></i>
                {{
									$i18n.locale == "zh"
											? item.ifcommonCollect
													? "已收藏"
													: "收藏"
											: item.ifcommonCollect
													? "Already collected"
													: " Collection"
								}}
              </span>
						</div>
						<!-- <el-button type="primary" @click="deleteMess(index)" style="position: relative;right: 0;">删除</el-button> -->
					</div>
					<div style="clear: both"></div>
				</div>

				<!-- 平台回复 -->
				<div class="Platform" v-if="item.replyStatus == 1">
					<div
							style="
              height: 70px;
              background: #f1f4f9;
              border-bottom: 1px solid #e1e2e6;
              padding: 0 30px;
            "
					>
						<!-- 答 -->
						<div
								style="
                float: left;
                width: 40px;
                height: 40px;
                border-radius: 50%;
                background: #279eb2;
                margin-top: 15px;
                text-align: center;
              "
						>
							<img
									v-if="$i18n.locale == 'zh'"
									src="@/assets/img/helpCenter/answer.png"
									alt=""
									style="width: 100%; border-radius: 50%"
							/>
							<img
									v-if="$i18n.locale == 'en'"
									src="@/assets/img/helpCenter/A.png"
									alt=""
									style="width: 100%; border-radius: 50%"
							/>

							<!-- <span style="color:#fff;font-size: 20px;font-weight: 700;line-height: 36px;">{{$t('common.A')}}</span> -->
						</div>
						<span
								style="
                float: left;
                font-size: 20px;
                color: #3c5375;
                font-weight: 700;
                margin-left: 20px;
                line-height: 70px;
              "
						>GEIDCP {{ $t("common.PlatformReply") }}</span
						>
					</div>
					<div
							style="
              border-bottom: 1px dotted #aaaaaa;
              width: 92%;
              margin: auto;
              float: right;
            "
							v-for="(
              i, index
            ) in item.baseDevelopmentCooperationReplyMessageList"
					>
						<div style="margin: 30px 0">
							<div>
                <span
		                style="
                    float: right;
                    color: #c1c1c1;
                    width: 18%;
                    margin-top: 10px;
                  "
                >{{ $t("common.ReplyTime") }}：<span>{{
		                formatDate(i.updateDate)
	                }}</span></span
                >
								<p
										style="float: left; width: 70%; font-size: 16px"
										v-html="i.content"
								></p>
								<div style="clear: both"></div>
							</div>
							<!--                            <div>-->
							<!-- <span style="float:right;margin-left:34px;color:#c1c1c1"><span style="color:#000">{{i.collectNum}} </span>{{$t('common.Collect')}}</span> -->
							<!--                                <span style="float:right;margin-left:34px;color:#c1c1c1;font-size: 14px;"><span style="color:#000">{{i.likeNum}} </span>{{$t('common.Praise')}}</span>-->
							<!--                            </div>-->
						</div>
					</div>
					<div style="clear: both"></div>
				</div>
			</div>
		</div>

		<!-- 分页 -->
		<div
				style="position: relative; width: 100%; height: 200px"
				v-if="initData.length > 0"
		>
			<el-pagination
					style="
          position: absolute;
          left: 50%;
          top: 50%;
          transform: translate(-50%, -50%);
        "
					background
					layout="prev, pager, next"
					:total="totalNum"
					:page-size="6"
					@size-change="handleSizeChange"
					@current-change="handleCurrentChange"
			>
			</el-pagination>
		</div>

		<!-- 我要留言 -->
		<el-dialog
				:title="$t('common.ToleaveMessage')"
				:visible.sync="dialogVisible"
				width="40%"
		>
			<el-form :inline="true" :model="formInline" class="demo-form-inline">
				<el-form-item :label="$t('common.Messageclassification') + ':'">
					<el-select
							v-model="formInline.MessageClassification"
							:placeholder="$t('common.PleaseSelect')"
							v-on:change="getShowId($event)"
					>
						<el-option
								v-for="(list, index) in classList"
								:label="list.name"
								:value="list.id"
								style="display: block; width: 100%"
						></el-option>
					</el-select>
				</el-form-item>
				<el-form-item :label="$t('common.Messagetypes') + ':'">
					<el-select
							v-model="formInline.MessageType"
							:placeholder="$t('common.PleaseSelect')"
							v-on:change="mess2getShowId($event)"
					>
						<el-option
								v-for="(type, index) in typeList"
								:label="type.name"
								:value="type.id"
								style="display: block; width: 100%"
						></el-option>
					</el-select>
				</el-form-item>
			</el-form>
			<el-form>
				<el-form-item
						:label="$t('common.ToleaveMessage') + ':'"
						:required="true"
				>
					<el-input
							type="text"
							:placeholder="$t('common.InputContent')"
							maxlength="200"
							show-word-limit
							v-model="formInline.title"
							style="width: 90%"
					>
					</el-input>
				</el-form-item>
			</el-form>

			<el-input
					type="textarea"
					:rows="2"
					:placeholder="$t('common.InputContent')"
					maxlength="200"
					show-word-limit
					v-model="formInline.textarea"
			>
			</el-input>
			<span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisibleClose()">{{
		        $t("common.Cancel")
	        }}</el-button>
        <el-button type="primary" @click="publish()"
        >{{ $t("common.OK") }}
        </el-button>
      </span>
		</el-dialog>

		<!-- 登录提示 -->
		<el-dialog
				:title="$i18n.locale == 'zh' ? '提示' : 'Reminder'"
				:visible.sync="toViewLogin"
				:width="$i18n.locale == 'zh' ? '500px' : '750px'"
				:height="$i18n.locale == 'zh' ? '300px' : '386px'"
				:before-close="toViewLoginChange"
		>
			<div style="width: 100%; height: 100%">
				<img
						src="@/assets/img/loginTips.png"
						alt=""
						style="width: 180px; height: 180px; margin-left: 20px"
				/>
				<div
						style="float: right; margin-right: 20px"
						:style="
            $i18n.locale == 'zh'
              ? 'width: 49%;margin-top: 10px;'
              : 'width: 453px;margin-top: -25px;'
          "
				>
					<div
							style="
              font-size: 20px;
              font-weight: normal;
              color: #333333;
              font-family: HiraginoSansGB-W3, HiraginoSansGB;
              line-height: 40px;
            "
					>
						{{ $t("common.ReminderFirst") }}
					</div>
					<div
							style="
              font-size: 16px;
              font-family: HiraginoSansGB-W3, HiraginoSansGB;
              font-weight: normal;
              color: #666666;
              line-height: 30px;
            "
					>
						{{ $t("common.ReminderSecond") }}
						<span style="color: #0091ff; font-size: 18px">{{ num }}</span>
						{{ $t("common.ReminderThird") }}
					</div>
					<div
							style="
              font-size: 14px;
              font-family: HiraginoSansGB-W3, HiraginoSansGB;
              font-weight: normal;
              color: #666666;
              line-height: 30px;
            "
					>
						{{ $t("common.ReminderForth") }}
					</div>
					<div
							style="
              font-size: 14px;
              font-family: HiraginoSansGB-W3, HiraginoSansGB;
              height: 33px;
              line-height: 60px;
              font-weight: normal;
              color: #0091ff;
            "
					>
            <span
		            style="margin-left: 40px"
		            class="cursor"
		            @click="toView('login')"
            >
              {{ $t("common.ReminderFifth") }}
            </span>
						<span
								style="margin-left: 10px"
								class="cursor"
								@click="toView('Register')"
						>
              {{ $t("common.ReminderSixth") }}
            </span>
					</div>
				</div>
			</div>
		</el-dialog>
	</div>
</template>
<script>
import Base from "@/views/base/Base";
import Screen from "@/components/screen";
import developmentDetails from "./development/developmentDetails";
import {
	getMessage,
	getsCustomized,
	getsCustomizedMy,
	getColumnTree,
	saveOrUpdate,
	clickLike,
	getMessagesByCollect,
} from "@/api/baseDevelopment";
import {
	getFollowModeNumlByModelId,
	getFollowModelNumByUser,
	saveFollowModel,
} from "@/api/operation/basePortalModelFollowInfo";
import {getFollowModeNumlByModelIdAndUserId} from "@/api/operation/basePortalModelFollowInfo";
import {getToken} from "@/utils/auth";
import {formatDate} from "@/utils/formatUtils";
import {addIntegral, addGrowth} from "@/utils/toCompleteTask";
import {getUserPointPage} from "@/api/user";
import _ from "lodash";

export default {
	name: "developmentCooperation",
	extends: Base,
	components: {Screen},
	data() {
		return {
			dictParam: {
				classifiedMessage: "all",
				questionType: "all",
			},
			//留言内容的查询条件
			params: {
				pageNo: 1,
				pageSize: 6,
				language: "",
				queryType: 1,
				replyStatus: 1,
				// status:'',
				createBy: null,
			},
			//留言分类
			classifiedMessage: {
				value: "common.Messageclassification",
				item: [],
			},
			//问题类型
			questionType: {
				value: "common.Problemtypes",
				item: [],
			},
			//字典的查询条件
			paramsDict: {
				language: "",
			},
			//留言点赞
			likeId: {
				id: "",
			},

			ifcommon: false,
			replyMess: [],
			active: 1,
			num: 0,
			totalNum: 0,
			total: 0,
			centerDialogVisible: false,
			dialogVisible: false,
			formInline: {
				MessageClassification: "",
				MessageType: "",
				title: "",
				textarea: "",
			},
			toViewLogin: false,
			pageNo: 1,
			screen1: {
				item: [],
			},
			screen2: {
				item: [],
			},
			initData: [],
			classList: [],
			typeList: [],
			indexId: 0,
			status: "",
			indexId2: 0,
			indexNum: 0,
			baseDevelopmentCooperationMessage: {
				id: this.indexId,
				columnId: "",
				title: "",
				content: "",
				likeNum: "",
				clickNum: "",
				collectNum: "",
				replyStatus: "",
				membershipPermissionType: "",
				status: "",
				createBy: "",
				createDate: "",
				updateBy: "",
				updateDate: "",
				userName: "",
				columnName: "",
				columnNameParent: "",
			},
			user: {
				umsUser: {},
			},
			collectId: "",
			giveLikeId: "",
			pointStatus: null,
			isToken: null,
		};
	},
	watch: {
		"$i18n.locale"() {
			this.getMessages();
			this.getDict();
			this.changeActive(this.active);
		},
		//toViewLogin变量检查是否进行跳转
		toViewLogin() {
			if (this.toViewLogin == true) {
				this.loginTipsChange();
				this.changeActive();
				this.liked();
			}
		},
	},
	mounted() {
		this.user = JSON.parse(window.localStorage.getItem("user"));
		window.localStorage.setItem("router", "developmentCooperation");
		//获取留言字典
		this.getDict();
		//获取留言消息
		this.getMessages();
		this.judgeState()
	},

	methods: {
		judgeState() {
			this.isToken = getToken()
			if (this.isToken) {
				getUserPointPage().then((res) => {
					this.pointStatus = res.data.umsUserPoints[0].pointStatus
				})
			}
		},
		//获取留言信息
		getMessages: function () {
			this.params.language = this.$i18n.locale.toUpperCase();
			getsCustomized(this.params).then((res) => {
				this.initData = [];
				this.totalNum = res.data.page.totalCount - 0;
				this.getMyCollecModel(res.data.baseDevelopmentCooperationMessages);
				this.initData = [];

				this.initData = res.data.baseDevelopmentCooperationMessages;

				this.initData.forEach((i) => {
					i.createDate = i.createDate
							? formatDate(i.createDate, "YYYY-MM-DD")
							: "";
				});
			});
		},
		getMyCollecModel(baseDevelopmentCooperationMessages) {
			baseDevelopmentCooperationMessages.forEach((i) => {
				if (this.$Cookies.get("token")) {
					let user = window.localStorage.getItem("user");
					var users = JSON.parse(user);
					let MyCollecModel = {
						modelType: "developmentCooperation",
						userId: users.userId,
						modelEntityId: i.id,
					};
					getFollowModeNumlByModelIdAndUserId(
							i.id,
							"developmentCooperation",
							this.userId
					).then((res) => {
						// i.ifcommon =  res.data;
						this.$set(i, "ifcommonCollect", res.data);
					});
				}
			});
		},
		dialogVisibleClose() {
			this.formInline.MessageClassification = "";
			this.formInline.MessageType = "";
			this.dialogVisible = false;
		},
		//图片地址补全
		imageAddPath(path) {
			const origin = document.location.origin;
			// console.log(origin + "/common/opt/file/pub/" + path)
			return origin + "/api/file/pub/" + path;
		},
		//选项切换
		changeDictParam(type, id) {
			if (type == "classifiedMessage") {
				this.dictParam.classifiedMessage = id;
				for (let index in this.classifiedMessage.item) {
					if (id == "all") {
						this.questionType = this.classifiedMessage.item[0].children;
						this.params.columnId = null;
					} else if (
							this.classifiedMessage.item[index].id ==
							this.dictParam.classifiedMessage
					) {
						this.questionType = this.classifiedMessage.item[index].children;
						this.params.columnId = id;
					}
				}
			} else if ((type = "questionType")) {
				this.dictParam.questionType = id;
				if (id == "all") {
					this.params.columnId = null;
				} else {
					this.params.columnId = id;
				}
			}

			this.getMessages();
		},
		//登录跳转
		loginTipsChange() {
			const that = this;
			this.num = 5;
			this.timer = setInterval(function () {
				if (that.num > 0) {
					that.num--;
				} else {
					if (that.toViewLogin == true) {
						clearInterval(that.timer);
						that.toView("login");
					} else {
						clearInterval(that.timer);
					}
				}
			}, 1000);
		},
		// 判断未登录跳转是否关闭
		toViewLoginChange(done) {
			this.toViewLogin = false;
			this.num = 5;
			clearInterval(this.timer);
		},

		// 分页
		handleCurrentChange(val) {
			this.pageNo = val;
			this.params.pageNo = this.pageNo;
			if (this.active == 1) {
				this.params.createBy = null;
				this.params.queryType = 1;
				this.params.replyStatus = 1;
				this.getMessages();
			} else if (this.active == 2) {
				this.params.createBy = null;
				this.params.queryType = 2;
				this.params.replyStatus = 1;
				this.getMessages();
			} else if (this.active == 3) {
				this.params.replyStatus = null;
				this.params.queryType = 3;
				// let user = window.localStorage.getItem("user");
				if (!this.$Cookies.get("token")) {
					this.toViewLogin = true;
				} else {
					// var users = JSON.parse(user);
					// this.params.createBy = users.userId;
					let token = getToken();
					this.getMessagesMy(token);
				}
			} else if (this.active == 4) {
				this.params.queryType = 4;
				if (!this.$Cookies.get("token")) {
					this.toViewLogin = true;
				} else {
					// var users = JSON.parse(user);
					// this.params.createBy = users.userId;
					let token = getToken();
					this.getMessagesByCollect(token);
				}
			}
		},
		handleSizeChange(val) {
			console.log(`每页 ${val} 条`);
		},
		//分页索引接着上一页的索引
		indexMethod(index) {
			return (this.page - 1) * 10 + index + 1;
		},
		//选项卡列表
		getList() {
			let user = window.localStorage.getItem("user");
			if (!this.$Cookies.get("token")) {
				this.toViewLogin = true;
			} else {
				this.dialogVisible = true;
				var params = {
					language: this.$i18n.locale.toUpperCase(),
				};

				getColumnTree(params).then((res) => {
					this.classList = res.data;
					this.indexId = this.classList[0].id;
				});
			}
		},
		//留言分类选项卡
		getShowId(val) {
			this.indexId = val;
			let i = 0;
			for (i = 0; i < this.classList.length; i++) {
				if (this.classList[i].id == this.indexId) {
					this.indexNum = i;
					break;
				}
			}
			this.typeList = this.classList[this.indexNum].children;
			this.formInline.MessageType = "";
		},
		mess2getShowId(val) {
			this.indexId2 = val;
		},

		//获取留言字典
		getDict() {
			this.paramsDict.language = this.$i18n.locale.toUpperCase();
			var that = this;
			that.classifiedMessage = {};
			getColumnTree(this.paramsDict).then((res) => {
				//留言分类处理
				if (this.$i18n.locale == "zh") {
					that.classifiedMessage = {
						value: "留言类型",
						item: [],
					};
				} else if (this.$i18n.locale == "en") {
					that.classifiedMessage = {
						value: "Message Classification",
						item: [],
					};
				}

				that.classifiedMessage.item = res.data;
				for (let index in that.classifiedMessage.item) {
					if (index == "remove") {
						break;
					}
					if (this.$i18n.locale == "zh") {
						var chidren = {
							value: "问题类型",
							item: [],
						};
					} else if (this.$i18n.locale == "en") {
						var chidren = {
							value: "Problem Types",
							item: [],
						};
					}

					chidren.item = that.classifiedMessage.item[index].children;

					chidren.item.unshift({
						name: "common.All",
						selected: 1,
						id: "all",
					});
					that.classifiedMessage.item[index].children = chidren;
				}
				that.questionType = that.classifiedMessage.item[0].children;
				that.classifiedMessage.item.unshift({
					name: "common.All",
					selected: 1,
					id: "all",
				});
				that.classifiedMessage.item[0].children =
						that.classifiedMessage.item[1].children;
			});
		},
		changeActive(i) {
			this.active = i.currentTarget.id;
			if (this.active == 1) {
				this.params.pageNo = 1;
				this.params.createBy = null;
				this.params.queryType = 1;
				this.params.replyStatus = 1;
				this.getMessages();
			} else if (this.active == 2) {
				this.params.pageNo = 1;
				this.params.createBy = null;
				this.params.queryType = 2;
				this.params.replyStatus = 1;
				this.getMessages();
			} else if (this.active == 3) {
				this.params.pageNo = 1;
				this.params.replyStatus = null;
				this.params.queryType = 3;
				// let user = window.localStorage.getItem("user");
				if (!this.$Cookies.get("token")) {
					this.toViewLogin = true;
				} else {
					// var users = JSON.parse(user);
					// this.params.createBy = users.userId;
					let token = getToken();
					this.getMessagesMy(token);
				}
			} else if (this.active == 4) {
				this.params.pageNo = 1;
				this.params.queryType = 4;
				if (!this.$Cookies.get("token")) {
					this.toViewLogin = true;
				} else {
					// var users = JSON.parse(user);
					// this.params.createBy = users.userId;
					let token = getToken();
					this.getMessagesByCollect(token);
				}
			}
		},
		getMessagesByCollect: function (token) {
			this.params.language = this.$i18n.locale.toUpperCase();
			getMessagesByCollect(this.params, token).then((res) => {
				if (res.data.baseDevelopmentCooperationMessages) {
					let newData = [];
					this.totalNum = res.data.page.totalCount - 0;
					this.getMyCollecModel(res.data.baseDevelopmentCooperationMessages);
					this.initData = [];
					this.initData = res.data.baseDevelopmentCooperationMessages;

					this.initData.forEach((i) => {
						i.createDate = i.createDate
								? formatDate(i.createDate, "YYYY-MM-DD")
								: "";
					});
				} else {
					this.initData = [];
				}
			});
		},
		getMessagesMy: function (token) {
			this.params.language = this.$i18n.locale.toUpperCase();
			getsCustomizedMy(this.params, token).then((res) => {
				let newData = [];
				this.totalNum = res.data.page.totalCount - 0;
				this.getMyCollecModel(res.data.baseDevelopmentCooperationMessages);
				this.initData = [];
				this.initData = res.data.baseDevelopmentCooperationMessages;
				this.initData.forEach((i) => {
					i.createDate = i.createDate
							? formatDate(i.createDate, "YYYY-MM-DD")
							: "";
					i.ifcommon = false;
				});
			});
		},

		// 收藏状态改变
		// collect(item, ifcommonCollect) {
		//   this.collectId = item.id;
		//   if (ifcommonCollect) {
		//     this.saveFollowModelDo("unfollow", item);
		//   } else {
		//     this.saveFollowModelDo("follow", item);
		//   }
		// },
		collect: _.throttle(function (item, ifcommonCollect) {
			this.collectId = item.createBy;
			if (this.collectId == this.user.userId) {
				this.$message({
					message: this.$i18n.locale == "zh" ? "不可收藏" : "Not Collect",
					type: "warning",
				});
			} else {
				if (ifcommonCollect) {
					this.saveFollowModelDo("unfollow", item);
				} else {
					this.saveFollowModelDo("follow", item);
				}
			}
		}, 3000),
		// 点赞状态改变
		// shareChange(id, item) {
		//   if (!item.ifcommon) {
		//     item.ifcommon = !item.ifcommon;
		//   }
		//   this.$forceUpdate();
		//   this.likeId.id = id;
		//   if (item.ifcommon) {
		//     this.liked("unlike", item);
		//   } else {
		//     this.liked("liked", item);
		//   }
		// },
		shareChange: _.throttle(function (id, item) {
			this.giveLikeId = item.createBy;
			if (this.giveLikeId == this.user.userId) {
				this.$message({
					message: this.$i18n.locale == "zh" ? "不可点赞" : "Not Liked",
					type: "warning",
				});
			} else {
				if (!item.ifcommon) {
					item.ifcommon = !item.ifcommon;
				}
				this.$forceUpdate();
				this.likeId.id = id;
				if (item.ifcommon) {
					this.liked("unlike", item);
				} else {
					this.liked("liked", item);
				}
			}
		}, 3000),
		//收藏操作方法
		saveFollowModelDo: function (followType, item) {
			let user = window.localStorage.getItem("user");
			if (!this.$Cookies.get("token")) {
				// this.$message.warning("请先登录");
				// this.$confirm('检测到您未登录，是否登录')
				// .then(_ => {
				//  this.toView('login');
				// })
				// .catch(_ => {});
				this.toViewLogin = true;
			} else {
				var users = JSON.parse(user);
				var token = "" + getToken();
				var projectId = item.id;
				var userId = users.userId;
				// 接口逻辑
				this.submitHandler((token) => {
					saveFollowModel(
							projectId,
							"developmentCooperation",
							userId,
							followType,
							token
					)
							.then((result) => {
								// console.log(result);
								if (followType == "unfollow") {
									if (this.$i18n.locale == "zh") {
										this.$message({
											message: "取消收藏",
											type: "success",
										});
									} else {
										this.$message({
											message: "cancel coilection",
											type: "success",
										});
									}
								} else {
									if (this.user.umsUser.userUsertypeDict !== "2" && this.pointStatus == 'y') {
										addGrowth("message_is_saved");
									}
									if (this.$i18n.locale == "zh") {
										this.$message({
											message: "已收藏",
											type: "success",
										});
									} else {
										this.$message({
											message: "Already collected",
											type: "success",
										});
									}
								}
								this.ifcommon = !this.ifcommon;
								let token = getToken();
								if (this.active == 1) {
									this.params.pageNo = 1;
									this.params.createBy = null;
									this.params.queryType = 1;
									this.params.replyStatus = 1;
									this.getMessages();
								} else if (this.active == 2) {
									this.params.pageNo = 1;
									this.params.createBy = null;
									this.params.queryType = 2;
									this.params.replyStatus = 1;
									this.getMessages();
								} else if (this.active == 3) {
									this.params.pageNo = 1;
									this.params.replyStatus = null;
									this.params.queryType = 3;
									// let user = window.localStorage.getItem("user");
									if (!this.$Cookies.get("token")) {
										this.toViewLogin = true;
									} else {
										// var users = JSON.parse(user);
										// this.params.createBy = users.userId;
										let token = getToken();
										this.getMessagesMy(token);
									}
								} else if (this.active == 4) {
									this.params.pageNo = 1;
									this.params.queryType = 4;
									if (!this.$Cookies.get("token")) {
										this.toViewLogin = true;
									} else {
										// var users = JSON.parse(user);
										// this.params.createBy = users.userId;
										let token = getToken();
										this.getMessagesByCollect(token);
									}
								}
								this.resetToken();
							})
							.catch((error) => {
								// 此处你的业务代码
							});
				});
			}
		},
		//点赞
		liked(type, item) {
			let list = {
				id:this.likeId.id,
				userId:this.user.userId,
			}
			clickLike(list).then((res) => {
				if (res.status == 200) {
					if (this.user.umsUser.userUsertypeDict !== "2" && this.pointStatus == 'y') {
						addGrowth("the_message_was_liked");
					}
					this.$message({
						message: this.$i18n.locale == "zh" ? "已点赞" : "Liked of success",
						type: "success",
					});
					item.likeNum++;
					// item.ifcommon = !item.ifcommon;
					this.$forceUpdate();
				}

				this.resetToken();
			});
		},

		//留言方法
		publish: function () {
			if (!this.$Cookies.get("token")) {
				this.toViewLogin = true;
			} else {
				console.log(this.indexId2);
				//留言内容
				this.baseDevelopmentCooperationMessage.content =
						this.formInline.textarea;
				this.baseDevelopmentCooperationMessage.columnId = this.indexId2;
				this.baseDevelopmentCooperationMessage.title = this.formInline.title;
				if (this.baseDevelopmentCooperationMessage.title == "") {
					alert(
							this.$i18n.locale == "zh" ? "标题不能为空" : "Title cannot be empty"
					);
					return;
				}
				// let user = window.localStorage.getItem("user");
				// var users = JSON.parse(user);
				// this.baseDevelopmentCooperationMessage.createBy = users.userId;
				console.log(this.baseDevelopmentCooperationMessage);
				var token = "" + getToken();
				//发送留言
				if (this.baseDevelopmentCooperationMessage.content) {
					if (this.formInline.MessageClassification) {
						if (this.formInline.MessageType) {
							this.submitHandler((token) => {
								saveOrUpdate(
										JSON.stringify(this.baseDevelopmentCooperationMessage),
										token
								)
										.then((res) => {
											if (this.user.umsUser.userUsertypeDict !== "2" && this.pointStatus == 'y') {
												addIntegral(
														"point_task_development_cooperation_message",
														"3"
												);
											}
											// alert(res.msg);
											this.$message({
												message:
														this.$i18n.locale == "zh"
																? "发送成功"
																: "Sent successfully",
												type: "success",
											});
										})
										.catch((error) => {
											this.$message({
												message:
														this.$i18n.locale == "zh" ? "保存失败" : "Save failed",
												type: "error",
											});
										});
								this.formInline = {};
								this.dialogVisible = false;
								this.resetToken();
							});
						} else {
							this.$message("请选择留言类型");
						}
					} else {
						this.$message("请选择留言分类");
					}
				} else {
					this.$message(this.$t("common.Pleasefillinthecontentfirst"));
				}
			}
		},
		toView(router, json) {
			console.log(json);
			clearInterval(this.timer);
			this.$router.push({
				name: router,
				id: "",
				query: {
					key: json,
				},
			});
		},
	},
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
body {
	margin: 0;
}

.box {
	margin-top: 10px;
	background: #fff;
	/* height: 500px; */
	padding: 20px 0;
}

.crumbs {
	margin-left: 20px;
}

.box >>> .el-textarea__inner {
	min-height: 220px !important;
	max-height: 220px !important;
}

ul li {
	background: #e9eef2;
	width: 136px;
	text-align: center;
}

ul li,
.addClass {
	display: inline-block;
	height: 42px;
	padding: 0 30px;
	font-size: 14px;
	line-height: 42px;
	/* background-color: #30548c; */
	cursor: pointer;
}

.addClass:active {
	border: 1px solid #0079ef;
}

.active {
	background-color: #30548c;
	color: #fff;
}

.messageBox {
	padding: 0px 0 0 0;
	border-bottom: 1px dashed #aaaaaa;
}

.lable1,
.lable2 {
	padding: 5px;
	color: #666;
	white-space: nowrap;
}

.lable1 {
	border-radius: 30px;
	background: #feead5;
	color: #fe8150;
}

.Platform {
	width: 100%;
	margin: 20px 0;
	/* border-top: 3px solid #a9bcd4; */
	border-bottom: 3px solid #34547b;
}
</style>