修改个人发表管理

src/api/system/publish.js

@@ -0,0 +1,67 @@
+import request from '@/utils/request'
+
+// 查询我的近况列表
+export function listPublish(query) {
+  return request({
+    url: '/system/publish/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询我的近况详细
+export function getPublish(id) {
+  return request({
+    url: '/system/publish/' + id,
+    method: 'get'
+  })
+}
+
+// 新增我的近况
+export function addPublish(data) {
+  return request({
+    url: '/system/publish',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改我的近况
+export function updatePublish(data) {
+  return request({
+    url: '/system/publish',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除我的近况
+export function delPublish(id) {
+  return request({
+    url: '/system/publish/' + id,
+    method: 'delete'
+  })
+}
+
+// 导出我的近况
+export function exportPublish(query) {
+  return request({
+    url: '/system/publish/export',
+    method: 'get',
+    params: query
+  })
+}
+// 获取评论列表
+export function listComment(id) {
+  return request({
+    url: '/system/publish/listComment/'+id,
+    method: 'get'
+  })
+}
+// 删除一条评论
+export function delComment(id) {
+  return request({
+    url: '/system/publish/delComment/'+id,
+    method: 'get'
+  })
+}

src/api/system/publishImg.js

@@ -0,0 +1,53 @@
+import request from '@/utils/request'
+
+// 查询我的状况图片列表
+export function listPublishImg(query) {
+  return request({
+    url: '/system/publishImg/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询我的状况图片详细
+export function getPublishImg(id) {
+  return request({
+    url: '/system/publishImg/' + id,
+    method: 'get'
+  })
+}
+
+// 新增我的状况图片
+export function addPublishImg(data) {
+  return request({
+    url: '/system/publishImg',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改我的状况图片
+export function updatePublishImg(data) {
+  return request({
+    url: '/system/publishImg',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除我的状况图片
+export function delPublishImg(id) {
+  return request({
+    url: '/system/publishImg/' + id,
+    method: 'delete'
+  })
+}
+
+// 导出我的状况图片
+export function exportPublishImg(query) {
+  return request({
+    url: '/system/publishImg/export',
+    method: 'get',
+    params: query
+  })
+}

src/router/index.js

@@ -39,14 +39,6 @@ export const constantRoutes = [
     ]
   },
   {
-    path: '/template/t1/:id(\\d+)',
-    component: (resolve) => require(['@/views/template/t1'], resolve),
-    meta:{
-      title: '个人页'
-    },
-    hidden: true
-  },
-  {
     path: '/login',
     component: (resolve) => require(['@/views/login'], resolve),
     hidden: true
@@ -102,19 +94,6 @@ export const constantRoutes = [
     ]
   },
   {
-    path: '/personal',
-    component: Layout,
-    hidden: true,
-    children: [
-      {
-        path: 'detail/pic/:id(\\d+)',
-        component: (resolve) => require(['@/views/system/personalPage/detail/pic'], resolve),
-        name: 'PersonalImg',
-        meta: { title: '个人照片', icon: '' }
-      }
-    ]
-  },
-  {
     path: '/job',
     component: Layout,
     hidden: true,
@@ -140,6 +119,53 @@ export const constantRoutes = [
       }
     ]
   }
+  ,
+  {
+    path: '/template/t1/:id(\\d+)',
+    component: (resolve) => require(['@/views/template/t1'], resolve),
+    meta:{
+      title: '个人页'
+    },
+    hidden: true
+  },
+  {
+    path: '/personal',
+    component: Layout,
+    hidden: true,
+    children: [
+      {
+        path: 'detail/pic/:id(\\d+)',
+        component: (resolve) => require(['@/views/system/personalPage/detail/pic'], resolve),
+        name: 'PersonalImg',
+        meta: { title: '个人照片', icon: '' }
+      }
+    ]
+  },
+  {
+    path: '/my',
+    component: Layout,
+    hidden: true,
+    children: [
+      {
+        path: 'publish',
+        name: 'publish',
+        component: (resolve) => require(['@/views/system/appUser/detail/publish'], resolve),
+        meta: { title: '个人发表' }
+      },
+      {
+        path: 'friend',
+        name: 'friend',
+        component: (resolve) => require(['@/views/system/appUser/detail/friend'], resolve),
+        meta: { title: '好友列表' }
+      },
+      {
+        path: 'family',
+        name: 'family',
+        component: (resolve) => require(['@/views/system/appUser/detail/family'], resolve),
+        meta: { title: '好友列表' }
+      }
+  ]
+  },
 ]
 
 export default new Router({

src/views/system/appUser/detail/publish.vue

@@ -0,0 +1,411 @@
+<template>
+  <div class="app-container">
+    <span><i class="el-icon-user"></i> 个人发表 - {{nickName}}</span>
+    <el-divider></el-divider>
+    <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
+      <el-form-item label="内容" prop="contents">
+        <el-input
+          v-model="queryParams.contents"
+          placeholder="请输入内容"
+          clearable
+          size="small"
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item>
+        <el-button type="cyan" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+      </el-form-item>
+    </el-form>
+
+    <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button
+          type="danger"
+          icon="el-icon-delete"
+          size="mini"
+          :disabled="multiple"
+          @click="handleDelete"
+          v-hasPermi="['system:publish:remove']"
+        >删除</el-button>
+      </el-col>
+	  <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
+    </el-row>
+
+    <el-table v-loading="loading" :data="publishList" @selection-change="handleSelectionChange">
+      <el-table-column type="selection" width="55" align="center" />
+      <el-table-column label="主键id" align="center" prop="id" v-if="false"/>
+      <el-table-column label="发表内容" align="center" prop="contents" :formatter="contentsFormat" width="450"/>
+      <el-table-column label="发布时间" align="center" prop="createTime" width="160"/>
+      <el-table-column
+        label="纪念留言"
+        align="center"
+        prop="message"
+        :formatter="messageFormat"
+        width="100"
+      />
+      <el-table-column label="点赞数" align="center" prop="thumbs" />
+      <el-table-column label="评论数" align="center" prop="comments" />
+      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
+        <template slot-scope="scope">
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-search"
+            @click="handleUpdate(scope.row)"
+            v-hasPermi="['system:publish:edit']"
+          >查看</el-button>
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-delete"
+            @click="handleDelete(scope.row)"
+            v-hasPermi="['system:publish:remove']"
+          >删除</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+    
+    <pagination
+      v-show="total>0"
+      :total="total"
+      :page.sync="queryParams.pageNum"
+      :limit.sync="queryParams.pageSize"
+      @pagination="getList"
+    />
+
+    <!-- 添加或修改我的近况（发）对话框 -->
+    <el-dialog  :visible.sync="open" width="600px" append-to-body :close-on-click-modal=false>
+      <el-card class="box-card">
+      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+
+        <el-card class="box-card" shadow="hover">
+          <div style="line-height:150%">{{form.contents}}</div>
+        <el-divider />
+
+        <div>
+          <div style="float: left;padding:0px 0px 10px;">
+            <el-tag type="info"> 点赞数：{{form.thumbs}} </el-tag>
+          </div>
+          <div v-if="form.message == 'Y'" style="float: right;font-size: 10px;color:#909399;">
+            <div style="padding:1px;">留 念 人：{{form.messageUser}}</div>
+            <div style="padding:2px;">发布时间：{{form.createTime}}</div>
+          </div>
+        </div>
+        </el-card>
+
+        <div class="block1">
+          <el-collapse>
+            <el-collapse-item>
+              <template slot="title">
+                <i class="header-icon el-icon-picture-outline-round"></i> 查看图片
+              </template>
+              <div v-for="item in imgList" :key="item.key" class="block">
+                <el-image :key="item.key" :src="item.value" :preview-src-list="[item.value]" class="images" />
+              </div>
+            </el-collapse-item>
+          </el-collapse>
+        </div>
+
+      </el-form>
+        <el-card class="box-card" shadow="hover" :body-style="{height:'200px'}">
+          <div slot="header" class="clearfix">
+            <span>评论</span>
+            <div style="float: right; padding: 3px 0">{{form.comments}}</div>
+          </div>
+          
+          <el-carousel :autoplay="false" :loop="false" arrow="always">
+            <el-carousel-item v-for="item in commentList" :key="item.id">
+
+              <el-row :gutter="10" type="flex" justify="start">
+                <el-col :span="3" style="padding: 10px;margin:0 auto;text-align:center;">
+                    <el-avatar :size="40" :src="item.appUserUrl"></el-avatar>
+                    <div style="width: 100%;margin:0 auto;text-align:center;">
+                      <span>{{item.appUser}}</span>
+                    </div>
+                </el-col>
+                <el-col :span="21" style="padding: 10px">
+                  <div style="float: right;">
+                    <el-button type="danger" size="mini" icon="el-icon-delete" circle @click="delComm(item)"/>
+                  </div> 
+                  <div style="float: top;font-size:11px;color:#909399;padding:0px 0px 10px">
+                    {{item.createTime}}
+                  </div>
+                  <div style="float: bottom;font-size:12px;height:120px">
+                    {{item.contents}}
+                  </div>
+                </el-col>
+              </el-row>
+
+            </el-carousel-item>
+          </el-carousel>
+        </el-card>
+
+      </el-card>
+      <div slot="footer" class="dialog-footer">
+        <el-button @click="cancel" type="primary">关 闭</el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { listPublish, getPublish, delPublish, addPublish, updatePublish, exportPublish,listComment,delComment } from "@/api/system/publish";
+import { getUser } from "@/api/system/appUser";
+
+export default {
+  name: "Publish",
+  data() {
+    return {
+      // 遮罩层
+      loading: true,
+      // 选中数组
+      ids: [],
+      pid: null,
+      // 非单个禁用
+      single: true,
+      // 非多个禁用
+      multiple: true,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      // 我的近况表格数据
+      publishList: [],
+      imgList:[],
+      messageOptions: [],
+      // 弹出层标题
+      title: "",
+      // 是否显示弹出层
+      open: false,
+      nickName: "",
+      commentList: [],
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        appUserId: null,
+        contents: null,
+        message: null,
+        messageUserId: null,
+        thumbs: null,
+      },
+      // 表单参数
+      form: {},
+      // 表单校验
+      rules: {
+      }
+    };
+  },
+  created() {
+    const uid = this.$route.query.uid;
+    this.queryParams.appUserId = uid;
+
+    this.getDicts("sys_yes_no").then(response => {
+      this.messageOptions = response.data;
+    });
+
+    this.getUser(uid);
+    this.getList();
+  },
+  methods: {
+      getUser(id){
+        getUser(id).then(response => {
+            const nickName = response.data.nickName;
+            this.nickName = nickName == null ? "全部" : nickName;
+        });
+      },
+    /** 查询我的近况（发）列表 */
+    getList() {
+      this.loading = true;
+      listPublish(this.queryParams).then(response => {
+        this.publishList = response.rows;
+        this.total = response.total;
+        this.loading = false;
+      });
+    },
+    // 是否纪念留言 字典翻译
+    messageFormat(row, column) {
+      return this.selectDictLabel(this.messageOptions, row.message);
+    },
+    contentsFormat(row, column) {
+      return row.contents.substr(0,32)+"...";
+    },
+    // 取消按钮
+    cancel() {
+      this.open = false;
+      this.reset();
+    },
+    // 表单重置
+    reset() {
+      this.form = {
+        id: null,
+        appUserId: null,
+        contents: null,
+        message: null,
+        messageUserId: null,
+        thumbs: null,
+        createBy: null,
+        createTime: null,
+        updateBy: null,
+        updateTime: null,
+        remark: null,
+        imgList: []
+      };
+      this.resetForm("form");
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNum = 1;
+      this.getList();
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.resetForm("queryForm");
+      this.handleQuery();
+    },
+    // 多选框选中数据
+    handleSelectionChange(selection) {
+      this.ids = selection.map(item => item.id)
+      this.single = selection.length!==1
+      this.multiple = !selection.length
+    },
+    /** 新增按钮操作 */
+    handleAdd() {
+      this.reset();
+      this.open = true;
+      this.title = "添加我的发表";
+    },
+    /** 修改按钮操作 */
+    handleUpdate(row) {
+      this.reset();
+      const id = row.id || this.ids;
+
+      getPublish(id).then(response => {
+        this.form = response.data;
+        this.open = true;
+        this.title = "查看我的发表";
+
+        this.imgList = [];
+        var apiUrl = process.env.VUE_APP_BASE_API;
+        var items = response.data.imgList;
+        for (const i in items) {
+            var url = apiUrl + items[i].url;
+            this.imgList.push({ key: items[i].id, value: url})
+        }
+        this.listComment(id);
+      });
+    },
+    listComment(id) {
+        listComment(id).then(res => {
+          this.commentList = res.rows;
+        });
+    },
+    /** 提交按钮 */
+    submitForm() {
+      this.$refs["form"].validate(valid => {
+        if (valid) {
+          if (this.form.id != null) {
+            updatePublish(this.form).then(response => {
+              if (response.code === 200) {
+                this.msgSuccess("修改成功");
+                this.open = false;
+                this.getList();
+              }
+            });
+          } else {
+            addPublish(this.form).then(response => {
+              if (response.code === 200) {
+                this.msgSuccess("新增成功");
+                this.open = false;
+                this.getList();
+              }
+            });
+          }
+        }
+      });
+    },
+    /** 删除按钮操作 */
+    handleDelete(row) {
+      const ids = row.id || this.ids;
+      this.$confirm('是否确认删除?', "警告", {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning"
+        }).then(function() {
+          return delPublish(ids);
+        }).then(() => {
+          this.getList();
+          this.msgSuccess("删除成功");
+        }).catch(function() {});
+    },
+    /** 导出按钮操作 */
+    handleExport() {
+      const queryParams = this.queryParams;
+      this.$confirm('是否确认导出所有我的发表数据项?', "警告", {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning"
+        }).then(function() {
+          return exportPublish(queryParams);
+        }).then(response => {
+          this.download(response.msg);
+        }).catch(function() {});
+    },
+    delComm(item) {
+      var id = item.id;
+      this.$confirm('是否删除这条评论?', "警告", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      }).then(function() {
+        return delComment(id);
+      }).then(() => {
+        this.listComment(item.publishId);
+        this.form.comments -= 1;
+        this.msgSuccess("删除成功");
+      }).catch(function() {});
+    }
+  }
+};
+</script>
+
+<style>
+.el-dialog__body {
+  padding: 10px 20px;
+}
+.el-form-item {
+  margin-bottom: 8px;
+}
+.block {
+    padding: 1px 1px 0px;
+    display: inline-block;
+    align-items: center;
+}
+.block1 {
+    width: 100%;
+    padding: 10px 0px 10px;
+}
+ .images {
+    width: 140px;
+    display: block;
+  }
+.image-slot {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    width: 100%;
+    height: 100%;
+    background: #f5f7fa;
+    color: #909399;
+}
+.el-divider--horizontal {
+  margin: 10px 0px;
+}
+.el-card__body {
+  padding: 12px;
+}
+.el-carousel__item {
+  height: 200px;
+}
+</style>

src/views/system/appUser/index.vue

@@ -5,7 +5,7 @@
       <el-form-item label="模糊条件" prop="searchValue">
         <el-input
           v-model="queryParams.searchValue"
-          placeholder="请输入昵称、手机号"
+          placeholder="请输入ID、昵称、手机号"
           clearable
           size="small"
           @keyup.enter.native="handleQuery"
@@ -91,10 +91,9 @@
               <span>{{ parseTime(scope.row.loginTime) }}</span>
             </template>
           </el-table-column>
-      <el-table-column label="备注" align="center" prop="remark" />
-      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
+      <el-table-column label="操作" width="210">
         <template slot-scope="scope">
-          <el-button
+          <!-- <el-button
             size="mini"
             type="text"
             icon="el-icon-edit"
@@ -107,7 +106,35 @@
             icon="el-icon-delete"
             @click="handleDelete(scope.row)"
             v-hasPermi="['system:appUser:remove']"
-          >删除</el-button>
+          >删除</el-button> -->
+          <el-row style="margin-bottom: 3px;">
+          <el-button
+            size="mini"
+            type="primary"
+            @click="myPage(scope.row)"
+            v-hasPermi="['system:appUser:query']"
+          >个人页</el-button>
+          <el-button
+            size="mini"
+            type="danger"
+            @click="myPublish(scope.row)"
+            v-hasPermi="['system:appUser:query']"
+          >个人发表</el-button>
+          </el-row>
+          <el-row>
+          <el-button
+            size="mini"
+            type="primary"
+            @click="myFriend(scope.row)"
+            v-hasPermi="['system:appUser:query']"
+          >好友</el-button>
+          <el-button
+            size="mini"
+            type="danger"
+            @click="myFamily(scope.row)"
+            v-hasPermi="['system:appUser:query']"
+          >家族</el-button>
+          </el-row>
         </template>
       </el-table-column>
     </el-table>
@@ -260,7 +287,6 @@ export default {
     },
     // 性别 字典翻译
     genderFormat(row, column) {
-      debugger
       return this.selectDictLabel(this.genderOptions, row.gender);
     },
     // 取消按钮
@@ -316,7 +342,6 @@ export default {
       this.reset();
       const id = row.userId || this.ids;
       getUser(id).then(response => {
-        debugger
         this.form = response.data;
         this.open = true;
         this.title = "修改会员";
@@ -364,6 +389,34 @@ export default {
           this.download(response.msg);
         }).catch(function() {});
     }
+    ,
+    myPage(row) {
+
+    },
+    myPublish(row) {
+      this.$router.push({ 
+        path:'/my/publish',
+        query: {
+            uid: row.userId
+        }
+      })
+    },
+    myFriend(row) {
+      this.$router.push({ 
+        path:'/my/friend',
+        query: {
+            id: row.userId
+        }
+      })
+    },
+    myFamily(row) {
+      this.$router.push({ 
+        path:'/my/family',
+        query: {
+            id: row.userId
+        }
+      })
+    },
   }
 };
 </script>

src/views/system/publish/index.vue

@@ -0,0 +1,351 @@
+<template>
+  <div class="app-container">
+    <span><i class="el-icon-user"></i> 个人发表 - 张三丰</span>
+    <el-divider></el-divider>
+    <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
+      <el-form-item label="内容" prop="contents">
+        <el-input
+          v-model="queryParams.appUserId"
+          placeholder="请输入内容"
+          clearable
+          size="small"
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="纪念留言" prop="message">
+        <el-input
+          v-model="queryParams.message"
+          placeholder="请输入纪念留言"
+          clearable
+          size="small"
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="留念人" prop="messageUserId">
+        <el-input
+          v-model="queryParams.messageUserId"
+          placeholder="请输入留念人"
+          clearable
+          size="small"
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item>
+        <el-button type="cyan" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+      </el-form-item>
+    </el-form>
+
+    <el-row :gutter="10" class="mb8">
+      <!-- <el-col :span="1.5">
+        <el-button
+          type="primary"
+          icon="el-icon-plus"
+          size="mini"
+          @click="handleAdd"
+          v-hasPermi="['system:publish:add']"
+        >新增</el-button>
+      </el-col> -->
+      <!-- <el-col :span="1.5">
+        <el-button
+          type="success"
+          icon="el-icon-edit"
+          size="mini"
+          :disabled="single"
+          @click="handleUpdate"
+          v-hasPermi="['system:publish:edit']"
+        >修改</el-button>
+      </el-col> -->
+      <el-col :span="1.5">
+        <el-button
+          type="danger"
+          icon="el-icon-delete"
+          size="mini"
+          :disabled="multiple"
+          @click="handleDelete"
+          v-hasPermi="['system:publish:remove']"
+        >删除</el-button>
+      </el-col>
+      <!-- <el-col :span="1.5">
+        <el-button
+          type="warning"
+          icon="el-icon-download"
+          size="mini"
+          @click="handleExport"
+          v-hasPermi="['system:publish:export']"
+        >导出</el-button>
+      </el-col> -->
+	  <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
+    </el-row>
+
+    <el-table v-loading="loading" :data="publishList" @selection-change="handleSelectionChange">
+      <el-table-column type="selection" width="55" align="center" />
+      <el-table-column label="主键id" align="center" prop="id" v-if="false"/>
+      <el-table-column label="发表内容" align="center" prop="contents" />
+      <el-table-column label="纪念留言" align="center" prop="message" />
+      <el-table-column label="留念人" align="center" prop="messageUserId" />
+      <el-table-column label="点赞数" align="center" prop="thumbs" />
+      <el-table-column label="备注" align="center" prop="remark" />
+      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
+        <template slot-scope="scope">
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-search"
+            @click="handleUpdate(scope.row)"
+            v-hasPermi="['system:publish:edit']"
+          >查看</el-button>
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-delete"
+            @click="handleDelete(scope.row)"
+            v-hasPermi="['system:publish:remove']"
+          >删除</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+    
+    <pagination
+      v-show="total>0"
+      :total="total"
+      :page.sync="queryParams.pageNum"
+      :limit.sync="queryParams.pageSize"
+      @pagination="getList"
+    />
+
+    <!-- 添加或修改我的近况（发）对话框 -->
+    <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
+      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+        <el-form-item label="发表内容" prop="contents">
+          <el-input v-model="form.contents" type="textarea" placeholder="请输入内容" />
+        </el-form-item>
+        <el-form-item label="图片1" prop="picurl1">
+          <el-input v-model="form.picurl1" placeholder="请输入图片1" />
+        </el-form-item>
+        <el-form-item label="图片2" prop="picurl2">
+          <el-input v-model="form.picurl2" placeholder="请输入图片2" />
+        </el-form-item>
+        <el-form-item label="图片3" prop="picurl3">
+          <el-input v-model="form.picurl3" placeholder="请输入图片3" />
+        </el-form-item>
+        <el-form-item label="图片4" prop="picurl4">
+          <el-input v-model="form.picurl4" placeholder="请输入图片4" />
+        </el-form-item>
+        <el-form-item label="图片5" prop="picurl5">
+          <el-input v-model="form.picurl5" placeholder="请输入图片5" />
+        </el-form-item>
+        <el-form-item label="图片6" prop="picurl6">
+          <el-input v-model="form.picurl6" placeholder="请输入图片6" />
+        </el-form-item>
+        <el-form-item label="图片7" prop="picurl7">
+          <el-input v-model="form.picurl7" placeholder="请输入图片7" />
+        </el-form-item>
+        <el-form-item label="图片8" prop="picurl8">
+          <el-input v-model="form.picurl8" placeholder="请输入图片8" />
+        </el-form-item>
+        <el-form-item label="图片9" prop="picurl9">
+          <el-input v-model="form.picurl9" placeholder="请输入图片9" />
+        </el-form-item>
+        <el-form-item label="纪念留言" prop="message">
+          <el-input v-model="form.message" placeholder="请输入纪念留言" />
+        </el-form-item>
+        <el-form-item label="留念人" prop="messageUserId">
+          <el-input v-model="form.messageUserId" placeholder="请输入留念人" />
+        </el-form-item>
+        <el-form-item label="点赞数" prop="thumbs">
+          <el-input v-model="form.thumbs" placeholder="请输入点赞数" />
+        </el-form-item>
+        <el-form-item label="备注" prop="remark">
+          <el-input v-model="form.remark" type="textarea" placeholder="请输入内容" />
+        </el-form-item>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="submitForm">确 定</el-button>
+        <el-button @click="cancel">取 消</el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { listPublish, getPublish, delPublish, addPublish, updatePublish, exportPublish } from "@/api/system/publish";
+
+export default {
+  name: "Publish",
+  data() {
+    return {
+      // 遮罩层
+      loading: true,
+      // 选中数组
+      ids: [],
+      // 非单个禁用
+      single: true,
+      // 非多个禁用
+      multiple: true,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      // 我的近况（发）表格数据
+      publishList: [],
+      // 弹出层标题
+      title: "",
+      // 是否显示弹出层
+      open: false,
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        appUserId: null,
+        contents: null,
+        picurl1: null,
+        picurl2: null,
+        picurl3: null,
+        picurl4: null,
+        picurl5: null,
+        picurl6: null,
+        picurl7: null,
+        picurl8: null,
+        picurl9: null,
+        message: null,
+        messageUserId: null,
+        thumbs: null,
+      },
+      // 表单参数
+      form: {},
+      // 表单校验
+      rules: {
+      }
+    };
+  },
+  created() {
+    this.getList();
+  },
+  methods: {
+    /** 查询我的近况（发）列表 */
+    getList() {
+      this.loading = true;
+      listPublish(this.queryParams).then(response => {
+        this.publishList = response.rows;
+        this.total = response.total;
+        this.loading = false;
+      });
+    },
+    // 取消按钮
+    cancel() {
+      this.open = false;
+      this.reset();
+    },
+    // 表单重置
+    reset() {
+      this.form = {
+        id: null,
+        appUserId: null,
+        contents: null,
+        picurl1: null,
+        picurl2: null,
+        picurl3: null,
+        picurl4: null,
+        picurl5: null,
+        picurl6: null,
+        picurl7: null,
+        picurl8: null,
+        picurl9: null,
+        message: null,
+        messageUserId: null,
+        thumbs: null,
+        createBy: null,
+        createTime: null,
+        updateBy: null,
+        updateTime: null,
+        remark: null
+      };
+      this.resetForm("form");
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNum = 1;
+      this.getList();
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.resetForm("queryForm");
+      this.handleQuery();
+    },
+    // 多选框选中数据
+    handleSelectionChange(selection) {
+      this.ids = selection.map(item => item.id)
+      this.single = selection.length!==1
+      this.multiple = !selection.length
+    },
+    /** 新增按钮操作 */
+    handleAdd() {
+      this.reset();
+      this.open = true;
+      this.title = "添加我的发表";
+    },
+    /** 修改按钮操作 */
+    handleUpdate(row) {
+      this.reset();
+      const id = row.id || this.ids
+      getPublish(id).then(response => {
+        this.form = response.data;
+        this.open = true;
+        this.title = "查看我的发表";
+      });
+    },
+    /** 提交按钮 */
+    submitForm() {
+      this.$refs["form"].validate(valid => {
+        if (valid) {
+          if (this.form.id != null) {
+            updatePublish(this.form).then(response => {
+              if (response.code === 200) {
+                this.msgSuccess("修改成功");
+                this.open = false;
+                this.getList();
+              }
+            });
+          } else {
+            addPublish(this.form).then(response => {
+              if (response.code === 200) {
+                this.msgSuccess("新增成功");
+                this.open = false;
+                this.getList();
+              }
+            });
+          }
+        }
+      });
+    },
+    /** 删除按钮操作 */
+    handleDelete(row) {
+      const ids = row.id || this.ids;
+      this.$confirm('是否确认删除?', "警告", {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning"
+        }).then(function() {
+          return delPublish(ids);
+        }).then(() => {
+          this.getList();
+          this.msgSuccess("删除成功");
+        }).catch(function() {});
+    },
+    /** 导出按钮操作 */
+    handleExport() {
+      const queryParams = this.queryParams;
+      this.$confirm('是否确认导出所有我的发表数据项?', "警告", {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning"
+        }).then(function() {
+          return exportPublish(queryParams);
+        }).then(response => {
+          this.download(response.msg);
+        }).catch(function() {});
+    }
+  }
+};
+</script>