招商资讯基本完成。

src/views/businessInfo/index.vue

@@ -20,53 +20,65 @@
 								</el-form-item>
 								<el-form-item label="发布时间">
 									<el-date-picker v-model="formInline.search_datatime" type="daterange" align="right" start-placeholder="开始日期"
-										end-placeholder="结束日期" format="yyyy-MM-dd" value-format="yyyy-MM-dd">
+										end-placeholder="结束日期" format="yyyy-MM-dd" value-format="yyyy-MM-dd" @change="btn_search">
 									</el-date-picker>
 								</el-form-item>
 								<el-form-item label="是否置顶">
-									<el-select v-model="formInline.id" clearable placeholder="请选择" style="width: 120px;">
-										<el-option v-for="item in formInline.options" :key="item.id" :label="item.hotelTownship" :value="item.id">
+									<el-select v-model="formInline.is_top" clearable placeholder="请选择" style="width: 120px;" @change="btn_search">
+										<el-option v-for="item in formInline.options" :key="item.is_top" :label="item.label" :value="item.is_top">
 										</el-option>
 									</el-select>
 								</el-form-item>
 							</el-form>
 							<div class="btns">
-								<el-button type="primary" class="info-del" @click="info_del">删除</el-button>
-								<el-button type="primary" class="export" @click="info_update">更新</el-button>
-								<el-button type="primary" class="export" @click="info_get">获取文章</el-button>
+								<el-button type="primary" class="btn-article-del" @click="article_del">删除</el-button>
+								<el-button type="primary" class="btn-update-get-article" @click="article_update">更新</el-button>
+								<el-button type="primary" class="btn-update-get-article" @click="article_get">获取文章</el-button>
 							</div>
 						</div>
-						<el-table :data="tableData" height="558" style="width: 100%" :cell-style="cell_style" v-loading="loading" :key='Math.random()'
-							:header-cell-style="header_cell_style">
+						<el-table :data="tableData" height="564" style="width: 100%" :cell-style="cell_style" :key='Math.random()'
+							:header-cell-style="header_cell_style" @selection-change="handle_table_change">
 							<el-table-column type="selection" width="50"></el-table-column>
 							<el-table-column label="标题" align="center">
 								<template slot-scope="scope">
-									<span>{{ scope.row.hotelTownshipName }}</span>
+									<span><el-link type="primary" :underline="false"
+											@click="show_article_detail(scope.row)">{{ scope.row.title }}</el-link></span>
 								</template>
 							</el-table-column>
 							<el-table-column label="封面图" align="center">
 								<template slot-scope="scope">
-									<span>{{ scope.row.hotelTownshipName }}</span>
+									<span v-if="scope.row.first_img != ''">
+										<viewer>
+											<img style="height: 100px; cursor: pointer;" :src="scope.row.first_img" />
+										</viewer>
+									</span>
+									<span v-else>
+										<el-image>
+											<div slot="error" class="image-slot"><i class="el-icon-picture-outline"></i></div>
+										</el-image>
+									</span>
 								</template>
 							</el-table-column>
-							<el-table-column label="内容" align="center">
+							<el-table-column label="内容" width="600">
 								<template slot-scope="scope">
-									<span>{{ scope.row.hotelName }}</span>
+									<span v-text="removeHtmlTags(scope.row.content)"></span>
 								</template>
 							</el-table-column>
-							<el-table-column label="发布时间" align="center">
+							<el-table-column label="发布时间" align="center" width="100">
 								<template slot-scope="scope">
-									<span>{{ scope.row.checkOutTime }}</span>
+									<span>{{ scope.row.update_time }}</span>
 								</template>
 							</el-table-column>
-							<el-table-column label="是否置顶" align="center">
+							<el-table-column label="是否置顶" align="center" width="90">
 								<template slot-scope="scope">
-									<span>{{ scope.row.houseTotalPrice }}</span>
+									<span>{{ scope.row.is_top }}</span>
 								</template>
 							</el-table-column>
-							<el-table-column label="操作" width="160" align="center">
+							<el-table-column label="操作" width="130" align="center">
 								<template slot-scope="scope">
-									<el-button @click.native.prevent="" type="text" size="small">置顶</el-button>
+									<el-button v-if="scope.row.is_top == 0" @click.native.prevent="handle_top(scope.row.id, 1)" type="text"
+										size="small">置顶</el-button>
+									<el-button v-else @click.native.prevent="handle_top(scope.row.id, 0)" type="text" size="small">取消置顶</el-button>
 								</template>
 							</el-table-column>
 						</el-table>
@@ -79,37 +91,45 @@
 				</div>
 			</el-col>
 		</el-row>
-		<el-dialog custom-class="dialog-qingzhang" :visible.sync="dialog_info_del" :close-on-click-modal="false" :close-on-press-escape="false"
+		<el-dialog custom-class="dialog-qingzhang" :visible.sync="dialog_del_article" :close-on-click-modal="false" :close-on-press-escape="false"
 			:show-close="false">
 			<div slot="" class="dialog-qingzhang-body">
 				<img src="../../icons/serveAC/del_warning.png" alt="">
 				<div class="dialog-qingzhang-body-txt">删除后的文章将不在民宿小程序<br>上进行展示，确定删除吗？</div>
 			</div>
 			<div slot="footer" class="dialog-footer">
-				<el-button class="add-user-cancel-btn" @click="dialog_info_del = false"> 取消 </el-button>
-				<el-button class="add-user-confirm-btn" @click=""> 确定 </el-button>
+				<el-button class="add-user-cancel-btn" @click="dialog_del_article = false"> 取消 </el-button>
+				<el-button class="add-user-confirm-btn" @click="handle_del_article"> 确定 </el-button>
 			</div>
 		</el-dialog>
-		<el-dialog custom-class="dialog-qingzhang" :visible.sync="dialog_info_update" :close-on-click-modal="false" :close-on-press-escape="false"
+		<el-dialog custom-class="dialog-qingzhang" :visible.sync="dialog_update_article" :close-on-click-modal="false" :close-on-press-escape="false"
 			:show-close="false">
 			<div slot="" class="dialog-qingzhang-body">
 				<img src="../../icons/serveAC/del_warning.png" alt="">
 				<div class="dialog-qingzhang-body-txt">确定对选中的文章进行更新吗？</div>
 			</div>
 			<div slot="footer" class="dialog-footer">
-				<el-button class="add-user-cancel-btn" @click="dialog_info_update = false"> 取消 </el-button>
-				<el-button class="add-user-confirm-btn" @click=""> 确定 </el-button>
+				<el-button class="add-user-cancel-btn" @click="dialog_update_article = false"> 取消 </el-button>
+				<el-button class="add-user-confirm-btn" @click="handle_update_article"> 确定 </el-button>
 			</div>
 		</el-dialog>
-		<el-dialog custom-class="dialog-qingzhang" :visible.sync="dialog_info_get" :close-on-click-modal="false" :close-on-press-escape="false"
+		<el-dialog custom-class="dialog-qingzhang" :visible.sync="dialog_get_article" :close-on-click-modal="false" :close-on-press-escape="false"
 			:show-close="false">
 			<div slot="" class="dialog-qingzhang-body">
 				<img src="../../icons/serveAC/del_warning.png" alt="">
 				<div class="dialog-qingzhang-body-txt">确定从公众号获取最新文章数据吗？</div>
 			</div>
 			<div slot="footer" class="dialog-footer">
-				<el-button class="add-user-cancel-btn" @click="dialog_info_get = false"> 取消 </el-button>
-				<el-button class="add-user-confirm-btn" @click=""> 确定 </el-button>
+				<el-button class="add-user-cancel-btn" @click="dialog_get_article = false"> 取消 </el-button>
+				<el-button class="add-user-confirm-btn" @click="handle_get_article"> 确定 </el-button>
+			</div>
+		</el-dialog>
+		<el-dialog :visible.sync="dialog_show_article" title="文章详情" width="50%">
+			<div>
+				<h3 style="text-align: center;">{{ article_detail.title }}</h3>
+				<p style="text-align: center;">作者：{{ article_detail.author }}</p>
+				<p style="text-align: center;">时间：{{ article_detail.time }}</p>
+				<div v-html="article_detail.content" style="height: 500px; overflow: auto; border: 1px solid #e3e3e3; padding: 10px 10px 10px 30px;"></div>
 			</div>
 		</el-dialog>
 	</div>
@@ -118,9 +138,14 @@
 <script>
 	import {
 		getTableData,
-		getTowns,
-		downloadExcel
-	} from '@/api/stdbookMgr'
+		getArticle,
+		updateArticle,
+		delArticle,
+		topArticle
+	} from '@/api/businessInfo'
+	import {
+		isEmpty
+	} from '@/js/common'
 
 	export default {
 		data() {
@@ -144,10 +169,14 @@
 				},
 				// 查询数据
 				formInline: {
-					options: [],
-					id: '',
-					amount1: '',
-					amount2: '',
+					options: [{
+						is_top: 0,
+						label: '否'
+					}, {
+						is_top: 1,
+						label: '是'
+					}],
+					is_top: '',
 					search_datatime: '',
 					keyword: ''
 				},
@@ -156,13 +185,22 @@
 				// 分页参数
 				pagination: {
 					currentPage: 1,
-					pageSize: 8,
+					pageSize: 4,
 					total: 0
 				},
-				loading: true,
-				dialog_info_del: false,
-				dialog_info_update: false,
-				dialog_info_get: false
+				// 文章删除、更新、获取的参数
+				dialog_del_article: false,
+				del_ids: [],
+				dialog_update_article: false,
+				update_ids: [],
+				dialog_get_article: false,
+				dialog_show_article: false,
+				article_detail: {
+					title: '',
+					author: '',
+					time: '',
+					content: ''
+				}
 			}
 		},
 		created() {
@@ -175,55 +213,132 @@
 			}
 			// 获取消费记录,表格数据
 			this.get_table_data('list')
-			// 获取乡镇
-			this.get_towns()
 		},
 		mounted() {
 			document.getElementsByClassName("el-pagination__jump")[0].childNodes[0].nodeValue = "跳至";
 		},
 		methods: {
-			// 获取文章
-			info_get() {
-				this.dialog_info_get = true
+			// 显示文章详情
+			show_article_detail(row) {
+				console.log(row);
+				this.article_detail.title = row.title
+				this.article_detail.author = row.author
+				this.article_detail.content = row.content
+				this.article_detail.time = row.update_time
+				this.article_detail.first_img = row.first_img
+				
+				this.dialog_show_article = true
 			},
-			// 更新文章
-			info_update() {
-				this.dialog_info_update = true
+			// 置顶/取消置顶
+			handle_top(id, param) {
+				// console.log(id, param);
+				var that = this
+				var data = [id, param]
+				topArticle(data).then((res) => {
+					// console.log(res);
+					if (res.code === 200) {
+						// 更新列表
+						that.get_table_data('list')
+						that.$message.success(res.message)
+					} else {
+						that.$message.warning(res.message)
+					}
+				}).catch((err) => {
+					that.$message.error(err.message)
+				});
+			},
+			// 获取选择的文章ids
+			handle_table_change(val) {
+				// console.log(val);
+				this.update_ids = []
+				this.del_ids = []
+				val.forEach(row => {
+					this.update_ids.push(row.id)
+					this.del_ids.push(row.id)
+				});
 			},
 			// 删除文章
-			info_del() {
-				this.dialog_info_del = true
+			handle_del_article() {
+				var that = this
+				delArticle(this.del_ids).then((res) => {
+					// console.log(res);
+					if (res.code === 200) {
+						// 更新列表
+						that.get_table_data('list')
+						that.dialog_del_article = false
+						that.$message.success(res.message)
+					} else {
+						that.dialog_del_article = false
+						that.$message.warning(res.message)
+					}
+				}).catch((err) => {
+					that.$message.error(err.message)
+				});
 			},
-			// 获取乡镇列表
-			get_towns() {
-				getTowns().then((res) => {
+			// 更新文章
+			handle_update_article() {
+				var that = this
+				updateArticle(this.update_ids).then((res) => {
+					// console.log(res);
 					if (res.code === 200) {
-						this.formInline.options = []
-						for (var i = 0; i < res.data.length; i++) {
-							let town = {
-								id: res.data[i].id,
-								hotelTownship: res.data[i].name
-							}
-							this.formInline.options.push(town)
-						}
+						// 更新列表
+						that.get_table_data('list')
+						that.dialog_update_article = false
+						that.$message.success(res.message)
 					} else {
-						if (res.data.length === 0) {
-							this.formInline.options = []
-							this.$message.warning('没有符合条件的数据！')
-						} else {
-							this.$message.warning(res.message)
-						}
+						that.dialog_update_article = false
+						that.$message.warning(res.message)
 					}
 				}).catch((err) => {
-					// console.log(err);
-					this.$message.error(err.message)
+					that.$message.error(err.message)
+				});
+			},
+			// 获取文章
+			handle_get_article() {
+				var that = this
+				getArticle().then((res) => {
+					// console.log(res);
+					if (res.code === 200) {
+						// 更新列表
+						that.get_table_data('list')
+						that.dialog_get_article = false
+						that.$message.success(res.message)
+					} else {
+						that.dialog_get_article = false
+						that.$message.warning(res.message)
+					}
+				}).catch((err) => {
+					that.$message.error(err.message)
 				});
 			},
+			// 移除文章内容中的html标签
+			removeHtmlTags(str) {
+				return str.replace(/<[^>]*>/g, '');
+			},
+			// 获取文章
+			article_get() {
+				this.dialog_get_article = true
+			},
+			// 更新文章
+			article_update() {
+				if (!isEmpty(this.update_ids)) {
+					this.dialog_update_article = true
+				} else {
+					this.$message.warning('请选择要【更新】的文章！')
+				}
+			},
+			// 删除文章
+			article_del() {
+				if (!isEmpty(this.del_ids)) {
+					this.dialog_del_article = true
+				} else {
+					this.$message.warning('请选择要【删除】的文章！')
+				}
+			},
 			/**
 			 * 获取消费记录,表格数据
 			 */
 			get_table_data(param) {
-				this.loading = true
 				this.get_condtion();
 
 				let data = this.cond_data;
@@ -237,14 +352,8 @@
 				getTableData(data).then((res) => {
 					// console.log(res);
 					if (res.code === 200) {
-						var d = res.data
-						that.pagination.total = d.bookIPage.total
-						that.tableData = []
-						for (var i = 0; i < d.bookIPage.pageList.length; i++) {
-							that.tableData.push(d.bookIPage.pageList[i])
-						}
-
-						that.sumAccount = d.sumAccount.toFixed(2)
+						that.pagination.total = res.total
+						that.tableData = res.rows
 					} else {
 						that.tableData = []
 						that.$message.warning('没有符合条件的数据！')
@@ -253,7 +362,6 @@
 					// console.log(err);
 					that.$message.error(err.message)
 				});
-				that.loading = false;
 			},
 			/**
 			 * 查询条件
@@ -264,18 +372,6 @@
 					rows: this.pagination.pageSize
 				}
 
-				if (this.formInline.id !== '') {
-					data.id = this.formInline.id
-				}
-
-				if (this.formInline.amount1 !== '') {
-					data.amount1 = this.formInline.amount1
-				}
-
-				if (this.formInline.amount2 !== '') {
-					data.amount2 = this.formInline.amount2
-				}
-
 				if (this.formInline.search_datatime !== '') {
 					data.search_datatime = this.formInline.search_datatime
 				}
@@ -284,6 +380,10 @@
 					data.keyword = this.formInline.keyword
 				}
 
+				if (this.formInline.is_top !== '') {
+					data.is_top = this.formInline.is_top
+				}
+
 				this.cond_data = data;
 			},
 			/**
@@ -380,7 +480,7 @@
 								flex-wrap: wrap;
 								align-items: center;
 								justify-content: flex-start;
-								
+
 								.el-form-item {
 									margin-bottom: 16px;
 								}
@@ -395,25 +495,25 @@
 								}
 							}
 
-							.info-del {
-								border-radius: 5px;
-								background: rgba(212, 48, 48, 1);
-								border: none;
-							}
-
-							.export {
-								background: rgba(9, 101, 98, 1);
-								font-size: 14px;
-								color: #FFFFFF;
-								font-family: Microsoft YaHei-3970(82674968);
-								border-radius: 5px;
-								border: none;
-							}
-
 							.btns {
 								display: flex;
 								align-items: center;
 								margin-bottom: 16px;
+
+								.btn-article-del {
+									border-radius: 5px;
+									background: rgba(212, 48, 48, 1);
+									border: none;
+								}
+
+								.btn-update-get-article {
+									background: rgba(9, 101, 98, 1);
+									font-size: 14px;
+									color: #FFFFFF;
+									font-family: Microsoft YaHei-3970(82674968);
+									border-radius: 5px;
+									border: none;
+								}
 							}
 						}
 
@@ -505,31 +605,31 @@
 	}
 
 	.demo-table-expand {
-		font-size: 0;
+		font-size: 0 !important;
 	}
 
 	.demo-table-expand label {
-		width: 180px;
-		color: #99a9bf;
+		width: 180px !important;
+		color: #99a9bf !important;
 	}
 
 	.demo-table-expand .el-form-item {
-		margin-right: 0;
-		margin-bottom: 0;
-		width: 33%;
+		margin-right: 0 !important;
+		margin-bottom: 0 !important;
+		width: 33% !important;
 	}
 
 	.dialog-footer {
-		display: flex;
-		justify-content: flex-end;
-		margin-top: -10px;
+		display: flex !important;
+		justify-content: flex-end !important;
+		margin-top: -10px !important;
 	}
 
 	.dialog-qingzhang {
 		height: 300px !important;
 		width: 500px !important;
 		margin-top: 330px !important;
-		border-radius: 8px;
+		border-radius: 8px !important;
 	}
 
 	.dialog-qingzhang .el-dialog__header {