|
|
@@ -0,0 +1,491 @@
|
|
|
+<!-- -->
|
|
|
+<template>
|
|
|
+ <div class="sugbox">
|
|
|
+ <div class="baselistbox_top">
|
|
|
+ <div class="baselistbox_top_title">
|
|
|
+ <p @click="backtrack" style="cursor: pointer">
|
|
|
+ <i class="el-icon-back"></i>
|
|
|
+ <span>返回</span>
|
|
|
+ </p>
|
|
|
+ <p>专家建议</p>
|
|
|
+ </div>
|
|
|
+ <p class="baselistbox_top_line"></p>
|
|
|
+ <div class="baselistbox_top_search" v-show="listoradd == 0">
|
|
|
+ <div class="left_search">
|
|
|
+ <div class="btnbox2" @click="listoradd = 1">新增建议</div>
|
|
|
+ </div>
|
|
|
+ <div class="right_search">
|
|
|
+ <el-date-picker
|
|
|
+ v-model="value1"
|
|
|
+ type="daterange"
|
|
|
+ range-separator="至"
|
|
|
+ start-placeholder="开始日期"
|
|
|
+ end-placeholder="结束日期"
|
|
|
+ size="mini"
|
|
|
+ @change="timechange"
|
|
|
+ >
|
|
|
+ </el-date-picker>
|
|
|
+ <div class="firstsearch">
|
|
|
+ <el-input
|
|
|
+ v-model="key_word"
|
|
|
+ size="mini"
|
|
|
+ placeholder="请输入关键字搜索"
|
|
|
+ ></el-input>
|
|
|
+ </div>
|
|
|
+ <div class="btnbox" @click="searchChange">查询</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="baselistbox_top_search" v-show="listoradd == 1">
|
|
|
+ <div class="left_search">
|
|
|
+ <div class="btnbox2" @click="listoradd = 0">列 表</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="baselistbox_table" v-show="listoradd == 0">
|
|
|
+ <div class="listbox">
|
|
|
+ <div
|
|
|
+ class="listbox_item"
|
|
|
+ v-for="(item, index) in suggestlist"
|
|
|
+ :key="index"
|
|
|
+ >
|
|
|
+ <div class="listbox_title">
|
|
|
+ <p>分析人员：{{ item.user_name }}</p>
|
|
|
+ <p>{{ item.create_time }}</p>
|
|
|
+ </div>
|
|
|
+ <div class="listbox_text">{{ item.foreword }}<span v-if="item.foreword.length==150">...</span></div>
|
|
|
+ <div class="listbox_btn">
|
|
|
+ <p @click="dellist(item)">删除</p>
|
|
|
+ <p @click="seeinfo(item)">查看详细</p>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="none" v-if="!suggestlist.length">
|
|
|
+ <img src="../../../static/images/quexingye.png" alt="" />
|
|
|
+ </div>
|
|
|
+ <div class="pagination">
|
|
|
+ <el-pagination
|
|
|
+ background
|
|
|
+ layout="prev, pager, next,sizes,jumper"
|
|
|
+ :total="totalnum"
|
|
|
+ :page-sizes="[4, 8, 12, 16]"
|
|
|
+ :page-size="page_size"
|
|
|
+ @size-change="handleSizeChange"
|
|
|
+ @current-change="handleCurrentChange"
|
|
|
+ :current-size.sync="page"
|
|
|
+ :key="pagekey"
|
|
|
+ >
|
|
|
+ </el-pagination>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="baselistbox_table" v-show="listoradd == 1">
|
|
|
+ <editor :tinymceHtml="sugaddinfo.content" @inp="inp($event)"></editor>
|
|
|
+ <div class="btnbigbox">
|
|
|
+ <div class="btnbox" @click="sugadd">提交</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <el-dialog
|
|
|
+ title="专家建议"
|
|
|
+ :visible.sync="dialogVisible"
|
|
|
+ width="766px"
|
|
|
+ :close-on-click-modal="false"
|
|
|
+ >
|
|
|
+ <div class="infobox">
|
|
|
+ <div v-html="infohtml"></div>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+//这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）
|
|
|
+import Editor from "@/components/editor/Editor";
|
|
|
+export default {
|
|
|
+ //import引入的组件需要注入到对象中才能使用
|
|
|
+ components: {
|
|
|
+ Editor,
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ //这里存放数据
|
|
|
+ return {
|
|
|
+ value1: "",
|
|
|
+ key_word: "",
|
|
|
+ totalnum: 10,
|
|
|
+ page: 1,
|
|
|
+ pagekey: 1,
|
|
|
+ page_size: 4,
|
|
|
+ suggestlist: [],
|
|
|
+ listoradd: 0,
|
|
|
+ prevention: "",
|
|
|
+ sugaddinfo: {
|
|
|
+ content: "",
|
|
|
+ foreword: "",
|
|
|
+ },
|
|
|
+ start_time: "",
|
|
|
+ end_time: "",
|
|
|
+ dialogVisible:false,
|
|
|
+ infohtml:"",
|
|
|
+ type:""
|
|
|
+ };
|
|
|
+ },
|
|
|
+ //监听属性 类似于data概念
|
|
|
+ computed: {},
|
|
|
+ //监控data中的数据变化
|
|
|
+ watch: {},
|
|
|
+ //方法集合
|
|
|
+ methods: {
|
|
|
+ backtrack() {
|
|
|
+ this.$router.go(-1);
|
|
|
+ },
|
|
|
+ handleSizeChange(e) {
|
|
|
+ this.page_size = e;
|
|
|
+ this.page = 1;
|
|
|
+ this.pagekey = Math.random() * 10 + 1;
|
|
|
+ this.getsuglist();
|
|
|
+ },
|
|
|
+ handleCurrentChange(e) {
|
|
|
+ this.page = e;
|
|
|
+ this.getsuglist();
|
|
|
+ },
|
|
|
+ timechange(e) {
|
|
|
+ console.log(e);
|
|
|
+ if (e) {
|
|
|
+ var time = new Date(e[0]);
|
|
|
+ var year1 = time.getFullYear();
|
|
|
+ var month1 = time.getMonth() + 1;
|
|
|
+ var date1 = time.getDate();
|
|
|
+ var time2 = new Date(e[1]);
|
|
|
+ var year2 = time2.getFullYear();
|
|
|
+ var month2 = time2.getMonth() + 1;
|
|
|
+ var date2 = time2.getDate();
|
|
|
+ this.start_time = year1 + "-" + month1 + "-" + date1;
|
|
|
+ this.end_time = year2 + "-" + month2 + "-" + date2;
|
|
|
+ } else {
|
|
|
+ this.start_time = "";
|
|
|
+ this.end_time = "";
|
|
|
+ }
|
|
|
+ this.page = 1;
|
|
|
+ this.pagekey = Math.random() * 10 + 1;
|
|
|
+ this.getsuglist();
|
|
|
+ },
|
|
|
+ inp(el) {
|
|
|
+ // console.log(this.getHtmlPlainText(el.sunHtml));
|
|
|
+ this.sugaddinfo.content = el.sunHtml;
|
|
|
+ this.sugaddinfo.foreword = this.getHtmlPlainText(el.sunHtml);
|
|
|
+ },
|
|
|
+ getHtmlPlainText(str) {
|
|
|
+ str = str.replace(/(\n)/g, "");
|
|
|
+ str = str.replace(/(\t)/g, "");
|
|
|
+ str = str.replace(/(\r)/g, "");
|
|
|
+ str = str.replace(/( )/g, "");
|
|
|
+ str = str.replace(/<\/?[^>]*>/g, "");
|
|
|
+ str = str.replace(/\s*/g, "");
|
|
|
+ str = str.replace(/<[^>]*>/g, "");
|
|
|
+ //或
|
|
|
+ //var text = html_str.replace(/<[^<>]+>/g, "");
|
|
|
+ return str;
|
|
|
+ },
|
|
|
+ searchChange() {
|
|
|
+ this.page = 1;
|
|
|
+ this.pagekey = Math.random() * 10 + 1;
|
|
|
+ this.getsuglist();
|
|
|
+ },
|
|
|
+ getsuglist() {
|
|
|
+ this.$axios({
|
|
|
+ method: "post",
|
|
|
+ url: "api/api_gateway?method=article.article.list_article",
|
|
|
+ data: this.qs.stringify({
|
|
|
+ start_time: this.start_time,
|
|
|
+ end_time: this.end_time,
|
|
|
+ key_word: this.key_word,
|
|
|
+ article_type: this.type,
|
|
|
+ page: this.page,
|
|
|
+ page_size: this.page_size,
|
|
|
+ }),
|
|
|
+ }).then((res) => {
|
|
|
+ if (res.data.message == "") {
|
|
|
+ console.log(res.data.data);
|
|
|
+ this.suggestlist = res.data.data.data;
|
|
|
+ this.totalnum = res.data.data.total_num;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ sugadd() {
|
|
|
+ console.log(this.sugaddinfo.foreword);
|
|
|
+ if (this.sugaddinfo.foreword == "") {
|
|
|
+ if (document.getElementsByClassName("el-message").length == 0) {
|
|
|
+ this.$message.error("请输入内容");
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ console.log(this.sugaddinfo.foreword.slice(0, 150));
|
|
|
+ this.$axios({
|
|
|
+ method: "post",
|
|
|
+ url: "api/api_gateway?method=article.article.add_article",
|
|
|
+ data: this.qs.stringify({
|
|
|
+ article_type: this.type,
|
|
|
+ foreword: this.sugaddinfo.foreword.slice(0, 150),
|
|
|
+ content: this.sugaddinfo.content,
|
|
|
+ }),
|
|
|
+ }).then((res) => {
|
|
|
+ if (res.data.message == "") {
|
|
|
+ if (document.getElementsByClassName("el-message").length == 0) {
|
|
|
+ this.$message.success("添加成功");
|
|
|
+ }
|
|
|
+ this.listoradd = 0;
|
|
|
+ this.sugaddinfo.content = "";
|
|
|
+ this.sugaddinfo.foreword = "";
|
|
|
+ this.getsuglist();
|
|
|
+ } else {
|
|
|
+ if (document.getElementsByClassName("el-message").length == 0) {
|
|
|
+ this.$message.error(res.data.message);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ dellist(item) {
|
|
|
+ this.$confirm("此操作将删除该条建议, 是否继续?", "提示", {
|
|
|
+ confirmButtonText: "确定",
|
|
|
+ cancelButtonText: "取消",
|
|
|
+ type: "warning",
|
|
|
+ })
|
|
|
+ .then(() => {
|
|
|
+ this.$axios({
|
|
|
+ method: "post",
|
|
|
+ url: "api/api_gateway?method=article.article.del_article",
|
|
|
+ data: this.qs.stringify({
|
|
|
+ ea_id: item.ea_id,
|
|
|
+ }),
|
|
|
+ }).then((res) => {
|
|
|
+ if (res.data.message == "") {
|
|
|
+ this.$message({
|
|
|
+ type: "success",
|
|
|
+ message: "删除成功!",
|
|
|
+ });
|
|
|
+ this.getsuglist();
|
|
|
+ } else {
|
|
|
+ this.$message({
|
|
|
+ type: "error",
|
|
|
+ message: res.data.message,
|
|
|
+ });
|
|
|
+ }
|
|
|
+ });
|
|
|
+ })
|
|
|
+ .catch(() => {
|
|
|
+ this.$message({
|
|
|
+ type: "info",
|
|
|
+ message: "已取消删除",
|
|
|
+ });
|
|
|
+ });
|
|
|
+ },
|
|
|
+ seeinfo(item){
|
|
|
+ this.infohtml = item.content
|
|
|
+ this.dialogVisible = true
|
|
|
+ }
|
|
|
+ },
|
|
|
+ beforeCreate() {}, //生命周期 - 创建之前
|
|
|
+ //生命周期 - 创建完成（可以访问当前this实例）
|
|
|
+ created() {
|
|
|
+ this.type = this.$route.query.type
|
|
|
+ console.log(this.$route)
|
|
|
+ this.getsuglist();
|
|
|
+ },
|
|
|
+ beforeMount() {}, //生命周期 - 挂载之前
|
|
|
+ //生命周期 - 挂载完成（可以访问DOM元素）
|
|
|
+ mounted() {},
|
|
|
+ beforeUpdate() {}, //生命周期 - 更新之前
|
|
|
+ updated() {}, //生命周期 - 更新之后
|
|
|
+ beforeDestroy() {}, //生命周期 - 销毁之前
|
|
|
+ destroyed() {}, //生命周期 - 销毁完成
|
|
|
+ activated() {}, //如果页面有keep-alive缓存功能，这个函数会触发
|
|
|
+};
|
|
|
+</script>
|
|
|
+<style lang="less" scoped>
|
|
|
+.sugbox {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ .baselistbox_top {
|
|
|
+ width: 100%;
|
|
|
+ height: 130px;
|
|
|
+ background-color: #fff;
|
|
|
+ border-radius: 10px;
|
|
|
+ .baselistbox_top_title {
|
|
|
+ width: 100%;
|
|
|
+ height: 65px;
|
|
|
+ display: flex;
|
|
|
+ padding: 20px;
|
|
|
+ box-sizing: border-box;
|
|
|
+ line-height: 25px;
|
|
|
+ p:first-child {
|
|
|
+ font-size: 14px;
|
|
|
+ }
|
|
|
+ p:last-child {
|
|
|
+ font-size: 18px;
|
|
|
+ font-weight: 700;
|
|
|
+ margin-left: 20px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .baselistbox_top_line {
|
|
|
+ width: 100%;
|
|
|
+ height: 1px;
|
|
|
+ background-color: #f2f2f2;
|
|
|
+ }
|
|
|
+ .baselistbox_top_search {
|
|
|
+ width: 100%;
|
|
|
+ height: 68px;
|
|
|
+ display: flex;
|
|
|
+ padding: 20px;
|
|
|
+ box-sizing: border-box;
|
|
|
+ line-height: 28px;
|
|
|
+ justify-content: space-between;
|
|
|
+ .left_search {
|
|
|
+ display: flex;
|
|
|
+ .btnbox,
|
|
|
+ .btnbox2 {
|
|
|
+ width: 80px;
|
|
|
+ height: 26px;
|
|
|
+ border: 1px solid #4f71ff;
|
|
|
+ text-align: center;
|
|
|
+ border-radius: 3px;
|
|
|
+ font-size: 14px;
|
|
|
+ cursor: pointer;
|
|
|
+ line-height: 26px;
|
|
|
+ }
|
|
|
+ .btnbox {
|
|
|
+ background-color: #4f71ff;
|
|
|
+ color: #fff;
|
|
|
+ }
|
|
|
+ .btnbox2 {
|
|
|
+ color: #4f71ff;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .right_search {
|
|
|
+ display: flex;
|
|
|
+ .firstsearch,
|
|
|
+ .secsearch {
|
|
|
+ display: flex;
|
|
|
+ margin-left: 20px;
|
|
|
+ /deep/.el-input {
|
|
|
+ width: 240px;
|
|
|
+ }
|
|
|
+ .biaoti {
|
|
|
+ font-size: 14px;
|
|
|
+ margin-right: 20px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .btnbox,
|
|
|
+ .btnbox2 {
|
|
|
+ width: 68px;
|
|
|
+ height: 26px;
|
|
|
+ border: 1px solid #4f71ff;
|
|
|
+ text-align: center;
|
|
|
+ border-radius: 3px;
|
|
|
+ font-size: 14px;
|
|
|
+ margin-left: 20px;
|
|
|
+ cursor: pointer;
|
|
|
+ line-height: 26px;
|
|
|
+ }
|
|
|
+ .btnbox {
|
|
|
+ background-color: #4f71ff;
|
|
|
+ color: #fff;
|
|
|
+ }
|
|
|
+ .btnbox2 {
|
|
|
+ color: #4f71ff;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .baselistbox_table {
|
|
|
+ width: 100%;
|
|
|
+ background-color: #fff;
|
|
|
+ margin-top: 10px;
|
|
|
+ padding: 20px;
|
|
|
+ box-sizing: border-box;
|
|
|
+ position: relative;
|
|
|
+ border-radius: 10px;
|
|
|
+ .listbox {
|
|
|
+ width: 100%;
|
|
|
+ .listbox_item {
|
|
|
+ width: 100%;
|
|
|
+ border-bottom: 1px solid #f2f2f2;
|
|
|
+ margin-bottom: 20px;
|
|
|
+ .listbox_title {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ p:first-child {
|
|
|
+ font-size: 18px;
|
|
|
+ color: #4f71ff;
|
|
|
+ }
|
|
|
+ p:last-child {
|
|
|
+ color: #8c8c8c;
|
|
|
+ font-size: 14px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .listbox_text {
|
|
|
+ margin: 15px 0;
|
|
|
+ color: #595959;
|
|
|
+ font-size: 14px;
|
|
|
+ letter-spacing: 1px;
|
|
|
+ line-height: 22px;
|
|
|
+ }
|
|
|
+ .listbox_btn {
|
|
|
+ display: flex;
|
|
|
+ justify-content: flex-end;
|
|
|
+ margin-bottom: 10px;
|
|
|
+ p {
|
|
|
+ margin-left: 10px;
|
|
|
+ font-size: 14px;
|
|
|
+ color: #4f71ff;
|
|
|
+ cursor: pointer;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ /deep/.tinymce {
|
|
|
+ .mce-container-body > .mce-first > .mce-container-body > .mce-menubar {
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
+ .mce-flow-layout > .mce-btn-group:nth-child(8) {
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .btnbigbox {
|
|
|
+ display: flex;
|
|
|
+ justify-content: flex-end;
|
|
|
+ }
|
|
|
+ .btnbox {
|
|
|
+ width: 68px;
|
|
|
+ height: 26px;
|
|
|
+ border: 1px solid #4f71ff;
|
|
|
+ text-align: center;
|
|
|
+ border-radius: 3px;
|
|
|
+ font-size: 14px;
|
|
|
+ cursor: pointer;
|
|
|
+ line-height: 26px;
|
|
|
+ background-color: #4f71ff;
|
|
|
+ color: #fff;
|
|
|
+ margin-top: 15px;
|
|
|
+ }
|
|
|
+ .none {
|
|
|
+ width: 100%;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-around;
|
|
|
+ }
|
|
|
+ .pagination {
|
|
|
+ display: flex;
|
|
|
+ justify-content: flex-end;
|
|
|
+ margin-top: 20px;
|
|
|
+ /deep/.el-pager {
|
|
|
+ .active {
|
|
|
+ background-color: #4f71ff !important;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ /deep/.el-input__inner:hover {
|
|
|
+ border-color: #4f71ff;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+.infobox{
|
|
|
+ overflow: hidden;
|
|
|
+}
|
|
|
+</style>
|
