Merge branch 'cy' of http://39.105.160.25:10880/post-project-ui/post-ui into cy

Dockerfile

@@ -0,0 +1,5 @@
+FROM nginx
+EXPOSE 80
+RUN rm -v /etc/nginx/conf.d/default.conf
+ADD default.conf /etc/nginx/conf.d/
+COPY ./dist /usr/share/nginx/html

Jenkinsfile

@@ -0,0 +1,29 @@
+pipeline {
+    agent any
+    environment {
+        BRANCH_NAME="${env.BRANCH_NAME}".toLowerCase()
+    }
+    stages {
+        stage('Build') {
+            steps {
+                sh 'docker-compose down'
+                nodejs('16.19.0') {
+                    sh 'npm install --registry https://registry.npm.taobao.org'
+                    sh 'npm run build:prod'
+                }
+                sh 'docker build -t ${BRANCH_NAME}:${BUILD_NUMBER} .'
+            }
+        }
+        stage('Test') {
+            steps {
+                echo 'Testing..'
+            }
+        }
+        stage('Deploy') {
+            steps {
+                echo 'Deploying....'
+                sh 'docker-compose up -d'
+            }
+        }
+    }
+}

babel.config.js

@@ -1,7 +1,21 @@
 module.exports = {
-  presets: [
-    // https://github.com/vuejs/vue-cli/tree/master/packages/@vue/babel-preset-app
-    '@vue/cli-plugin-babel/preset'
+  "presets": [
+    '@vue/cli-plugin-babel/preset',
+    [
+      "@babel/preset-env",
+      {
+        "useBuiltIns": "usage",
+        "corejs": 3
+      }
+    ]
+  ],
+  "plugins": [
+    ["component",
+      {
+        "libraryName": "element-ui",
+        "styleLibraryName": "theme-chalk"
+      }
+    ]
   ],
   'env': {
     'development': {
@@ -10,4 +24,5 @@ module.exports = {
       'plugins': ['dynamic-import-node']
     }
   }
-}
+}
+

default.conf

@@ -0,0 +1,15 @@
+server {
+    #blue
+    listen       80;
+    server_name  localhost;
+
+    location / {
+        root   /usr/share/nginx/html;
+        index  index.html index.htm;
+    }
+    
+    location /prod-api/ {           
+        proxy_pass http://blue-post-project-api-1:8080/;
+    }
+    
+}

docker-compose.yml

@@ -0,0 +1,10 @@
+services:
+  post-project-ui:
+    image: ${BRANCH_NAME}:${BUILD_NUMBER}
+    ports:
+      - 8682:80
+    networks:
+      - local_public
+networks:
+  local_public:
+    external: true

package.json

@@ -37,9 +37,10 @@
   },
   "dependencies": {
     "@riophae/vue-treeselect": "0.4.0",
+    "async-validator": "^1.11.5",
     "axios": "0.24.0",
     "clipboard": "2.0.8",
-    "core-js": "3.25.3",
+    "core-js": "^3.27.2",
     "echarts": "5.4.0",
     "element-ui": "2.15.10",
     "file-saver": "2.0.5",
@@ -64,11 +65,15 @@
     "vuex": "3.6.0"
   },
   "devDependencies": {
+    "@babel/plugin-transform-runtime": "^7.17.10",
+    "@babel/runtime-corejs3": "^7.17.9",
     "@vue/cli-plugin-babel": "4.4.6",
     "@vue/cli-plugin-eslint": "4.4.6",
     "@vue/cli-service": "4.4.6",
     "babel-eslint": "10.1.0",
+    "babel-plugin-component": "^1.1.1",
     "babel-plugin-dynamic-import-node": "2.3.3",
+    "babel-plugin-import": "^1.13.5",
     "chalk": "4.1.0",
     "compression-webpack-plugin": "5.0.2",
     "connect": "3.6.6",

src/api/message/message.js

@@ -1,38 +1,34 @@
-// 后端接口版本
 import request from '@/utils/request'
 
-// 获取消息列表
-// export function getMessage() {
-//   return request({
-//     url: '/messageList/messageList',
-//     method: 'get'
-//   })
-// }
-
+// 查询消息列表
 export function getMessage(params) {
   return request({
-    url: '/api/message/getMessage',
+    url: '/system/news/list',
     params
   })
 }
 
+// 按标题时间搜索消息
 export function searchMessage(params) {
+  console.log(params);
   return request({
-    url: '/api/message/searchData',
+    url: 'system/news/queryNews',
     params
   })
 }
 
-export function detailMessage(params) {
+// 删除消息
+export function deleteMessage(id) {
   return request({
-    url: '/api/message/detailMessage',
-    params
+    url: 'system/news/remove/' + id,
+    method: 'delete',
   })
 }
 
-export function deleteMessage(data) {
+// 新增消息
+export function addMessage(data) {
   return request({
-    url: '/api/message/del',
+    url: 'system/news/add',
     method: 'post',
     data
   })

src/babel.config.json

@@ -0,0 +1,20 @@
+{
+    "presets": [
+      [
+        "@babel/preset-env",
+        {
+          "useBuiltIns": "usage",
+          "debug": false,
+          "corejs": 3
+        }
+      ]
+    ],
+    "plugins": [
+      [
+        "@babel/plugin-transform-runtime",
+        {
+          "corejs": 3
+        }
+      ]
+    ]
+  }

src/main.js

@@ -40,6 +40,9 @@ import DictTag from '@/components/DictTag'
 import VueMeta from 'vue-meta'
 // 字典数据组件
 import DictData from '@/components/DictData'
+// 将中国标准时间转化为年月日时分秒
+import formatDate from '@/utils/formatDate'
+
 
 // 全局方法挂载
 Vue.prototype.getDicts = getDicts
@@ -51,6 +54,7 @@ Vue.prototype.selectDictLabel = selectDictLabel
 Vue.prototype.selectDictLabels = selectDictLabels
 Vue.prototype.download = download
 Vue.prototype.handleTree = handleTree
+Vue.prototype.$formatDate = formatDate
 
 // 全局组件挂载
 Vue.component('DictTag', DictTag)

src/utils/formatDate.js

@@ -0,0 +1,34 @@
+function padLeftZero(str) {
+    return ('00' + str).substr(str.length)
+}
+
+export function formatDate(date, fmt) {
+    if (!date) {
+        return ''
+    }
+    if (/(y+)/.test(fmt)) {
+        fmt = fmt.replace(
+            RegExp.$1,
+            (date.getFullYear() + '').substr(4 - RegExp.$1.length)
+        )
+    }
+    const o = {
+        'M+': date.getMonth() + 1,
+        'd+': date.getDate(),
+        'h+': date.getHours(),
+        'm+': date.getMinutes(),
+        's+': date.getSeconds()
+    }
+    for (const k in o) {
+        if (new RegExp(`(${k})`).test(fmt)) {
+            const str = o[k] + ''
+            fmt = fmt.replace(
+                RegExp.$1,
+                RegExp.$1.length === 1 ? str : padLeftZero(str)
+            )
+        }
+    }
+    return fmt
+}
+
+export default formatDate

src/views/message/addMessage.vue

@@ -1,109 +1,92 @@
 <template>
   <div class="message-add">
-
-    <!-- <el-page-header @back="goBack" content="创建消息"></el-page-header> -->
     <div class="message-add-box">
       <el-form :model="message" :rules="rules" ref="form" label-width="100px">
-        <el-form-item label="消息标题:" prop="messageTitle">
-          <el-input v-model="message.messageTitle" placeholder="请输入消息标题"></el-input>
-        </el-form-item> 
-      
-        <el-form-item label="发布时间:" required>
-          <el-col :span="11">
-            <el-form-item prop="dateTime">
-              <el-time-picker placeholder="选择时间" v-model="message.dateTime" style="width: 100%;"></el-time-picker>
-            </el-form-item>
-          </el-col>
+        <el-form-item label="消息标题:" prop="title">
+          <el-input v-model="message.title" placeholder="请输入消息标题"></el-input>
         </el-form-item>
-
-        <el-form-item label="接受用户:" prop="receivedUsers">
-          <el-input type="textarea" :rows="2" placeholder="请导入用户" autosize v-model="message.receivedUsers"></el-input>
-        </el-form-item>  
-
-        <el-form-item label="消息内容:" prop="messageContent">
-          <quill-editor 
-            class="ql-editor"
-            v-model="content" 
-            ref="myQuillEditor" 
-            :options="editorOption" 
-            >
-          </quill-editor>
+        <el-form-item label="发布时间: " required>
+          <el-date-picker v-model="message.newsDate" type="date" placeholder="选择日期">
+          </el-date-picker>
+          <el-time-picker placeholder="选择时间" v-model="message.newsTime"></el-time-picker>
+        </el-form-item>
+        <el-form-item label="消息内容:" prop="content">
+          <editor v-model="message.content"></editor>
         </el-form-item>
-
-        <!-- <el-form-item>
-          <el-button type="primary" @click="submitForm('form')">立即创建</el-button>
-        </el-form-item> -->
       </el-form>
-    </div>     
+      <el-form style="margin-left: 100px;">
+        <el-button type="primary" @click="submit">创建</el-button>
+        <el-button @click="reset">重置</el-button>
+      </el-form>
+    </div>
   </div>
 </template>
 
 <script>
-import Quill from 'quill' // 引入编辑器
-// 自定义字体大小
-const Size = Quill.import('attributors/style/size')
-Size.whitelist = ['10px', '12px', '16px', '18px', '20px', '30px', '32px']
-Quill.register(Size, true)
-
-// 自定义字体类型
-var fonts = ['SimSun', 'SimHei', 'Microsoft-YaHei', 'KaiTi', 'FangSong', 'Arial', 'sans-serif']
-var Font = Quill.import('formats/font')
-Font.whitelist = fonts
-Quill.register(Font, true)
-
- export default {
-    data() {
-      return {
-        message: {
-          messageTitle: '',
-          dateTime: '',
-          receivedUsers: '',
-          messageContent: '',
-        },
-        rules: {
-          messageTitle: [
-            { required: true, message: '请输入消息标题', trigger: 'blur' }
-          ],
-          dateTime: [
-            { type: 'date', required: true, message: '选择时间', trigger: 'change' }
-          ],
-          receivedUsers: [
-            { required: true, message: '请导入用户', trigger: 'blur' }
-          ],
-          messageContent: [
-            { required: true, trigger: 'blur' }
-          ]
-        },
-        content: `<p>这是 vue-quill-editor 的内容！</p>`, //双向数据绑定数据
-        // 富文本编辑器配置
-        editorOption: {
-          modules: {
-              toolbar: [
-                ['bold', 'italic', 'underline', 'strike'], // 加粗 斜体 下划线 删除线
-                ['blockquote', 'code-block'], // 引用  代码块
-                  [{ header: 1 }, { header: 2 }], // 1、2 级标题
-                  [{ list: 'ordered' }, { list: 'bullet' }], // 有序、无序列表
-                  [{ script: 'sub' }, { script: 'super' }], // 上标/下标
-                  [{ indent: '-1' }, { indent: '+1' }], // 缩进
-                  [{ direction: 'rtl' }], // 文本方向
-                  [{ size: ['12px', false, '16px', '18px', '20px', '30px'] }], // 字体大小
-                  [{ header: [1, 2, 3, 4, 5, 6, false] }], // 标题
-                  [{ color: [] }, { background: [] }], // 字体颜色、字体背景颜色
-                  [{ font: [false, 'SimSun', 'SimHei', 'Microsoft-YaHei', 'KaiTi', 'FangSong', 'Arial'] }], // 字体种类
-                  [{ align: [] }], // 对齐方式
-                  ['clean'], // 清除文本格式
-                  ['link', 'image', 'video'] // 链接、图片、视频
-          ],
-            placeholder: '请输入正文'
-          }
+import { addMessage } from '../../api/message/message'
+export default {
+  data() {
+    return {
+      message: {
+        title: '',
+        content: '',
+        newsDate: '',
+        newsTime: ''
+      },
+      rules: {
+        title: [
+          { required: true, message: '请输入消息标题', trigger: 'blur' }
+        ],
+        content: [
+          { required: true, message: '请输入消息内容', trigger: 'blur' }
+        ]
+      },
+      content: ''
+    }
+  },
+  methods: {
+    submit() {
+      if (this.message.title && this.message.content) {
+        let nyr = this.$formatDate(this.message.newsDate, 'yyyy-MM-dd');
+        let sfm = this.$formatDate(this.message.newsTime, 'hh:mm:ss');
+        let news = {
+          newsTitle: this.message.title,
+          newsContent: this.message.content,
+          newsTime: nyr + ' ' + sfm
+        }
+        console.log(news.newsTime);
+        addMessage(news).then((res) => {
+          this.message.title = '';
+          this.message.content = '';
+          this.message.newsDate = '';
+          this.message.newsTime = '';
+        })
+        this.$notify({
+          title: '成功',
+          message: '创建消息成功',
+          type: 'success'
+        });
+        this.$router.push("./messageList");
+      } else {
+        this.$notify({
+          title: '警告',
+          message: '请填写内容',
+          type: 'warning'
+        });
       }
+    },
+    reset() {
+      this.message.title = '';
+      this.message.content = '';
+      this.message.newsDate = '';
+      this.message.newsTime = '';
     }
   }
 }
 </script>
 
 <style>
-.message-add{
+.message-add {
   width: 700px;
   height: 100%;
   position: absolute;
@@ -114,20 +97,22 @@ Quill.register(Font, true)
   margin: auto;
   border: 1px solid #ccc;
 }
-.message-add-box{
+
+.message-add-box {
   padding: 40px;
 }
+
 /* .users-input-box{
   color:aqua;
 } */
 
 .quill-editor /deep/ .ql-container {
-    min-height: 220px;
-  }
+  min-height: 220px;
+}
 
-  .ql-container {
-    min-height: 230px;
-  }
+.ql-container {
+  min-height: 230px;
+}
 
 .ql-toolbar.ql-snow {
   border: 1px solid #ccc;
@@ -137,8 +122,9 @@ Quill.register(Font, true)
   padding: 8px;
   width: 450px;
 }
-.ql-toolbar.ql-snow + .ql-container.ql-snow {
-    border-top: 0px;
-    width: 450px;
+
+.ql-toolbar.ql-snow+.ql-container.ql-snow {
+  border-top: 0px;
+  width: 450px;
 }
 </style>

src/views/message/messageDetails.vue

@@ -3,12 +3,9 @@
     <el-button id="returnBtn" @click="returnBtn">返回</el-button>
     <div class="noticeDetails">
       <div class="title">消息详情</div>
-      <h3 id="noticeTitle">数字邮局正式上线，创世版首发!</h3>
-      <!-- <div class="noticeTitle">数字邮局正式上线，创世版首发!</div> -->
-      <h4 id="noticeTime">2023-01-13 11:46:38</h4>
-      <div id="noticeContent">
-        邮贝数字邮局，是由中国邮政集团有限公司北京市公司设立，同时使用人民日报全国党媒联盟链进行数字邮品和数字产品的登记、认证与确权，服务广大集邮用户和数字收藏爱好者的邮政官方数字邮品和数字产品发行平台。邮贝数字邮局由北京游贝数字科技有限公司负责运营。
-      </div>
+      <h3 id="noticeTitle"></h3>
+      <h4 id="noticeTime"></h4>
+      <div id="noticeContent"></div>
     </div>
   </div>
 </template>

src/views/message/messageList.vue

@@ -10,11 +10,11 @@
       </div>
       <div class="left-up">
         <div class="up-input-title">
-          消息标题:<el-input v-model="input" class="up-input" placeholder="请输入内容"></el-input>
+          消息标题:<el-input v-model="input.value1" class="up-input" placeholder="请输入内容"></el-input>
         </div>
         <div class="up-input-title-right">
           <span class="demonstration">发布时间:</span>
-          <el-date-picker v-model="value2" type="datetimerange" class="up-input-right" range-separator="至"
+          <el-date-picker v-model="input.value2" type="datetimerange" class="up-input-right" range-separator="至"
             start-placeholder="开始日期" end-placeholder="结束日期" align="right">
           </el-date-picker>
         </div>
@@ -28,14 +28,12 @@
         </el-row>
       </div>
       <div class="down-table">
-        <el-table :data="tableData" order style="width: 100%" class="messagetable">
-          <el-table-column type="index" label="ID" align="center">
+        <el-table height="300" :data="tableData" order style="width: 100%" class="messagetable">
+          <el-table-column prop="newsId" label="ID" align="center">
           </el-table-column>
-          <el-table-column :formatter="stateFormat" prop="messageTitle" label="消息标题" align="center">
+          <el-table-column :formatter="stateFormat" prop="newsTitle" label="消息标题" align="center">
           </el-table-column>
-          <el-table-column prop="phoneNumber" label="手机号" align="center">
-          </el-table-column>
-          <el-table-column prop="publishTime" label="发布时间" align="center">
+          <el-table-column prop="newsTime" label="发布时间" align="center">
           </el-table-column>
           <el-table-column prop="operate" label="操作" align="center">
             <template slot-scope="scope">
@@ -49,11 +47,9 @@
         </el-table>
       </div>
     </div>
-    <div class="bottom">
-      <el-pagination @current-change="handleCurrentChange" background layout="total, prev, pager, next" :total="total"
-        id="page">
-      </el-pagination>
-    </div>
+    <el-pagination @current-change="handleCurrentChange" background layout="total, prev, pager, next" :total="total"
+      id="page">
+    </el-pagination>
   </div>
 </template>
 <script>
@@ -61,78 +57,102 @@ import { getMessage, searchMessage, deleteMessage } from '../../api/message/mess
 export default {
   data() {
     return {
-      tableData: [],
-      pageData: {
-        page: 1,
-        limit: 10
+      tableData: [],  // 数据内容
+      total: 1, // 数据个数
+      input: {
+        value1: '', // 搜索姓名
+        value2: ''  // 搜索时间
       },
-      total: 1,
-      input: "",
-      value2: ""
+      pageInfo: { // 分页信息
+        pageNum: 1,
+        pageSize: 10
+      }
     }
   },
   mounted() {
-    this.getMockMessageList();
-  },
-  beforeDestroy() {
+    this.getMessageList();
   },
   methods: {
-    getMockMessageList() {
-      getMessage(this.pageData).then((res) => {
-        this.tableData = res.list
-        this.total = res.count;
+    // 获取消息列表
+    getMessageList() {
+      getMessage(this.pageInfo).then((res) => {
+        this.tableData = res.rows;
+        this.total = res.total;
       })
     },
+    // 分页跳转
     handleCurrentChange(newPage) {
-      this.pageData.page = newPage;
-      this.getMockMessageList();
+      this.pageInfo.pageNum = newPage;
+      this.getMessageList();
     },
-    /**搜索按钮 */
+    // 搜索消息
     check() {
-      if (this.input) {
-        let con = {
-          name: this.input
+      if (this.input.value1 || this.input.value2) {
+        let startTime = this.$formatDate(this.input.value2[0], 'yyyy-MM-dd hh:mm:ss');
+        let endTime = this.$formatDate(this.input.value2[1], 'yyyy-MM-dd hh:mm:ss');
+        let searchCon = {
+          newsTitle: this.input.value1,
+          newsTimeStart: startTime,
+          newsTimeEnd: endTime
         }
-        searchMessage(con).then((data) => {
-          this.tableData = data.list;
-          this.total = data.count;
+        searchMessage(searchCon).then((res) => {
+          this.tableData = res.rows;
+          this.total = res.total;
         })
       } else {
-        this.getMockMessageList();
+        this.getMessageList();
       }
     },
+    // 重置搜索
     empty() {
-      this.input = "";
-      this.getMockMessageList();
+      this.input.value1 = "";
+      this.input.value2 = "";
+      this.getMessageList();
     },
-    stateFormat(row, column, cellValue) {
-      if (!cellValue) return ''
-      if (cellValue.length > 15) {       //最长固定显示10个字符
-        return cellValue.slice(0, 15) + '...'
-      }
-      return cellValue
-    },
-    //删除列表
+    //  删除列表
     deleteM(row) {
-      deleteMessage({ id: row.id }).then(() => {
-        this.getMockMessageList();
-      })
+      this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        deleteMessage(row.newsId).then(() => {
+          this.getMessageList();
+        })
+        this.$message({
+          type: 'success',
+          message: '删除成功!'
+        });
+      }).catch(() => {
+        this.$message({
+          type: 'info',
+          message: '已取消删除'
+        });
+      });
     },
-    //查看详情
+    // 查看详情
     viewDetails(row) {
       this.$router.push({
         name: "messageDetails",
         query: {
-          publishTime: row.publishTime,
-          title: row.messageTitle,
-          content: row.content
+          publishTime: row.newsTime,
+          title: row.newsTitle,
+          content: row.newsContent
         }
       });
     },
-    //添加跳转
+    // 添加跳转
     addNoticce() {
       this.$router.push("/messageList/addMessage");
-    }
+    },
+    // 标题省略
+    stateFormat(row, column, cellValue) {
+      if (!cellValue) return ''
+      if (cellValue.length > 15) {       //最长固定显示10个字符
+        return cellValue.slice(0, 15) + '...'
+      }
+      return cellValue
+    },
   }
 }
 </script>
@@ -270,4 +290,9 @@ export default {
 .bottom {
   float: right;
 }
+
+#page {
+  float: right;
+  margin-right: 20px;
+}
 </style>