活动发布开关添加文章类型

5415ba97 · dongjipeng · 805f3cfc · 5415ba97 · 5415ba97 · 5415ba97
Commit 5415ba97 authored Jul 10, 2020 by dongjipeng
11 changed files
--- a/.env.alpha
+++ b/.env.alpha
+NODE_ENV = 'production'
+VUE_APP_TITLE = 'alpha'
\ No newline at end of file
--- a/.env.build
+++ b/.env.build
+NODE_ENV = 'production'
+VUE_APP_TITLE = 'production'
\ No newline at end of file
--- a/.env.development
+++ b/.env.development
-VUE_APP_API_PREFIX=development
+NODE_ENV = 'development'
+VUE_APP_TITLE = 'development'
\ No newline at end of file
--- a/.env.production
+++ b/.env.production
-VUE_APP_API_PREFIX=production
+NODE_ENV = 'production'
+VUE_APP_TITLE = 'production'
\ No newline at end of file
--- a/src/assets/css/reset.scss
+++ b/src/assets/css/reset.scss
 html, body {width: 100%; height: 100%}
 html, body, ul, li, ol, dl, dd, dt, p, h1, h2, h3, h4, h5, h6, form, fieldset, legend, img { margin:0; padding:0; }
 fieldset, img { border:none; }
-img{display: block;}
+// img{display: block;}
-address, caption, cite, code, dfn, th, var { font-style:normal; font-weight:normal; }
+address, caption, cite, code, dfn, th, var { /* font-style:normal; */ font-weight:normal; }
 ul, ol { list-style:none; }
 input { padding-top:0; padding-bottom:0; font-family: "SimSun","宋体";}
 input::-moz-focus-inner { border:none; padding:0; }
@@ -17,7 +17,7 @@ html, select, input, textarea {font-family: "FZLanTingHei-L-GBK", "Helvetica Neu
 a { color:#666; text-decoration:none; }
 a:visited { color:#1a1a1a; }
 a:hover, a:active, a:focus {text-decoration:none; }
-i, em, b {font-style: normal}
+// i, em, b {font-style: normal}
 button {outline: none; border: none; background: transparent; cursor: pointer}
 /*placeholder*/

--- a/src/components/Test.vue
+++ b/src/components/Test.vue
+<template>
+  <div>Test</div>
+</template>
+<script>
+export default {
+  beforeCreate () {
+    console.log('子组件：beforeCreate')
+  },
+  created () {
+    console.log('子组件：created')
+  },
+  beforeMount () {
+    console.log('子组件：beforeMount')
+  },
+  mounted () {
+    console.log('子组件：mounted')
+  },
+  beforeDestroy () {
+    console.log('子组件：beforeDestroy')
+  },
+  destroyed () {
+    console.log('子组件：destroyed')
+  }
+}
+</script>
--- a/src/main.js
+++ b/src/main.js
@@ -5,13 +5,13 @@ import axios from 'axios'
 import QS from 'qs'
 import store from './store'
 import VueQuillEditor from 'vue-quill-editor'
+import '../src/assets/css/reset.scss'
 import 'quill/dist/quill.core.css'
 import 'quill/dist/quill.snow.css'
 import 'quill/dist/quill.bubble.css'
 import ElementUi from 'element-ui'
 import './element-variables.scss'
 import rules from './util/validator'
-import '../src/assets/css/reset.scss'
 import '../src/assets/css/main.scss'
 import getCookie from './cookie'
 import previewAlert from './util/previewAlert'
@@ -24,38 +24,43 @@ Vue.prototype.$axios = axios
 Vue.prototype.$qs = QS
 Vue.prototype.$previewAlert = previewAlert
-// const DOMAIN_NAME = 'cfldcn'
+// 开发环境
-// const DOMAIN_NAME = 'cfldpe'
+const DEVDOMIN = 'http://10.2.98.32:8091/admin/'
-// var ssoHttp = ''
+// 测试环境
+const ALPHADOMIN = 'http://happy.cfldpe.com/admin/'
-// 判断环境变量，执行对应打包命令
+// 生产环境
-console.log('当前环境变量', process.env.VUE_APP_TITLE)
+const PRODOMIN = 'http://happy.cfldcn.com/admin/'
 switch (process.env.VUE_APP_TITLE) {
  case 'development':
    // ssoHttp = 'http://sso.' + 'cfldpe' + '.com/'
-    Vue.prototype.$ssoHttp = 'http://sso.' + 'cfldpe' + '.com/'
+    Vue.prototype.$ssoHttp = 'http://sso.cfldpe.com/'
-    axios.defaults.baseURL = 'http://10.2.98.32:8091/admin/'
+    axios.defaults.baseURL = DEVDOMIN
-    Vue.prototype.$baseURL = 'http://10.2.98.32:8091/admin/'
+    Vue.prototype.$baseURL = DEVDOMIN
-    Vue.prototype.$imgUrl = 'http://10.2.98.32:8091/admin/images/'
+    Vue.prototype.$imgUrl = DEVDOMIN + 'images/'
-    Vue.prototype.$imgUrlFitness = 'http://10.2.98.32:8091/admin/exerciseImages/'
+    Vue.prototype.$imgUrlFitness = DEVDOMIN + 'exerciseImages/'
    break
  case 'alpha':
    // ssoHttp = 'http://sso.' + 'cfldcn' + '.com/'
-    Vue.prototype.$ssoHttp = 'http://sso.' + 'cfldpe' + '.com/'
+    Vue.prototype.$ssoHttp = 'http://sso.cfldpe.com/'
-    axios.defaults.baseURL = 'http://10.2.98.32:8081/admin/'
+    // axios.defaults.baseURL = 'http://10.2.98.32:8081/admin/'
-    Vue.prototype.$baseURL = 'http://10.2.98.32:8081/admin/'
+    // axios.defaults.baseURL = 'http://10.2.98.32:8081/admin/'
-    Vue.prototype.$imgUrl = 'http://10.2.98.32:8081/admin/images/'
+    // Vue.prototype.$baseURL = 'http://10.2.98.32:8081/admin/'
-    Vue.prototype.$imgUrlFitness = 'http://10.2.98.32:8081/admin/exerciseImages/'
+    // Vue.prototype.$imgUrl = 'http://10.2.98.32:8081/admin/images/'
+    // Vue.prototype.$imgUrlFitness = 'http://10.2.98.32:8081/admin/exerciseImages/'
+    // 新
+    axios.defaults.baseURL = ALPHADOMIN
+    Vue.prototype.$baseURL = ALPHADOMIN
+    Vue.prototype.$imgUrl = ALPHADOMIN + 'images/'
+    Vue.prototype.$imgUrlFitness = ALPHADOMIN + 'exerciseImages/'
    break
  case 'production':
    // ssoHttp = 'http://sso.' + 'cfldcn' + '.com/'
-    Vue.prototype.$ssoHttp = 'http://sso.' + 'cfldcn' + '.com/'
+    Vue.prototype.$ssoHttp = 'http://sso.cfldcn.com/'
    getCookie(Vue.prototype.$ssoHtt)
-    axios.defaults.baseURL = 'http://happy.' + 'cfldcn' + '.com/admin/'
+    axios.defaults.baseURL = PRODOMIN
-    Vue.prototype.$baseURL = 'http://happy.' + 'cfldcn' + '.com/admin/'
+    Vue.prototype.$baseURL = PRODOMIN
-    Vue.prototype.$imgUrl = 'http://happy.' + 'cfldcn' + '.com/admin/images/'
+    Vue.prototype.$imgUrl = PRODOMIN + 'images/'
-    Vue.prototype.$imgUrlFitness = 'http://happy.' + 'cfldcn' + '.com/admin/exerciseImages/'
+    Vue.prototype.$imgUrlFitness = PRODOMIN + 'exerciseImages/'
    break
 }

--- a/src/util/validator.js
+++ b/src/util/validator.js
@@ -26,6 +26,10 @@ export default {
      required: true,
      message: '文章链接不能为空'
    },
+    activePublisher: {
+      required: true,
+      message: '发布人不能为空'
+    },
    bookName: {
      required: true
    },

--- a/src/views/home/ActivityPropaganda.vue
+++ b/src/views/home/ActivityPropaganda.vue
@@ -66,9 +66,8 @@
      </el-tab-pane>
      <el-tab-pane label="活动文章" name="second">
        <div class="btn-warp tr mb15">
-          <el-button type="primary" size="small">
+          <el-button type="primary" size="small" @click="addNewArticleLink">新增文章链接</el-button>
-            <router-link to="/home/newArticle" style="color: #fff">新增活动文章</router-link>
+          <el-button type="primary" size="small" @click="goNewArticlePage">新增活动文章</el-button>
-          </el-button>
        </div>
        <el-table
          :data="activityList"
@@ -87,14 +86,10 @@
            label="文章名称">
          </el-table-column>
          <el-table-column
-            prop="activeType"
+            prop="classifyName"
            label="文章类型"
            align="center"
-            width="90">
+            width="150">
-            <template slot-scope="scope">
-              <div v-if="scope.row.activeType === 1">活动</div>
-              <div v-if="scope.row.activeType === 2">专题</div>
-            </template>
          </el-table-column>
          <el-table-column
            prop="createTime"
@@ -129,12 +124,12 @@
                <el-button icon="el-icon-edit" size="small" @click="articleEdit(scope.row)"></el-button>
                <el-switch
                  v-model="scope.row.activeStatus"
-                  @change="switchChange(scope.row)"
+                  @change="switchChange(scope.$index, scope.row)"
                  :active-value=1
                  :inactive-value=2
-                  style="margin: 0 15px"
                  active-color="#13ce66"
-                  inactive-color="#666">
+                  inactive-color="#666"
+                  style="margin: 0 15px">
                </el-switch>
                <el-button icon="el-icon-delete" size="small" @click="articleDel(scope.row.id)"></el-button>
              </div>
@@ -212,9 +207,19 @@
        </el-form-item>
        <el-form-item label="文章类型" prop='articleType'>
          <el-col :sm="18">
-            <el-select v-model="outLink.articleType" placeholder="请选择文章类型" style="width: 100%">
+            <!-- <el-select v-model="outLink.articleType" placeholder="请选择文章类型" style="width: 100%">
              <el-option label="活动" :value=1></el-option>
              <el-option label="专题" :value=2></el-option>
+            </el-select> -->
+            <el-select v-model="outLink.articleType" placeholder="类型" style="width: 100%">
+              <el-option :label="item.classifyName" v-for="(item, index) in activitys" :key="index" :value='item.id'></el-option>
+            </el-select>
+          </el-col>
+        </el-form-item>
+        <el-form-item label="发布人" prop='activePublisher'>
+          <el-col :sm="18">
+            <el-select v-model="outLink.activePublisher" placeholder="发布人" style="width: 100%">
+              <el-option :label="index" :value="index" v-for="(item, index) in activePublishers" :key="item"></el-option>
            </el-select>
          </el-col>
        </el-form-item>
@@ -298,12 +303,8 @@ export default {
      outLink: {
        articleName: '',
        articleType: '',
-        articleLink: ''
+        articleLink: '',
-      },
+        activePublisher: ''
-      outLinkFormRules: {
-        articleName: { required: true, message: '请输入文章名称', trigger: 'blur' },
-        articleType: { required: true, message: '请选择文章类型', trigger: 'change' },
-        articleLink: { required: true, message: '请输入文章链接', trigger: 'blur' }
      },
      articleDialogVisible: false,
      articleForm: {
@@ -311,11 +312,6 @@ export default {
        articleType: '',
        editorContent: ''
      },
-      articleFormRules: {
-        articleTitle: { required: true, message: '请输入文章标题', trigger: 'blur' },
-        articleType: { required: true, message: '请选择文章类型', trigger: 'change' },
-        editorContent: { required: true, message: '请输入文章内容', trigger: 'blur' }
-      },
      editorOption: {},
      activityBannerList: [],
      currentPage2: 1,
@@ -335,12 +331,16 @@ export default {
      },
      rules: rules,
      actBannerId: '',
-      articleId: ''
+      articleId: '',
+      activePublishers: {},
+      activitys: []
    }
  },
  mounted () {
    this._getActiveBannerList()
    this._getActiveList()
+    this._getActivePublisher()
+    this._getActivityClassify()
  },
  methods: {
    /** *********** 活动banner *************/
@@ -464,6 +464,27 @@ export default {
      }).catch(() => { console.log('取消删除') })
    },
    /** *********** 活动文章 *************/
+    // 跳转到活动文章新增页面
+    goNewArticlePage () {
+      this.$router.push({ name: 'newArticle' })
+    },
+    // 点击显示文章链接弹窗
+    addNewArticleLink () {
+      this.outLinkDialogVisible = true
+      this.outLink.articleName = ''
+      this.outLink.articleType = ''
+      this.outLink.activePublisher = ''
+      this.outLink.articleLink = ''
+    },
+    // 获取发布人
+    _getActivePublisher () {
+      let _this = this
+      this.$axios.get('/active/publisher/list')
+        .then(res => {
+          // console.log(res)
+          _this.activePublishers = res
+        })
+    },
    _getActiveList () { // 文章列表
      let _this = this
      this.$axios.get('/active/list', {
@@ -483,14 +504,43 @@ export default {
      this.currentPage2 = currentPage
      this._getActiveList()
    },
-    switchChange (item) { // 修改发布状态
+    switchChange (index, item) { // 修改发布状态
-      let _this = this
+      let id = item.id
-      let params = {
+      let flag = item.activeStatus // 保存点击之后v-modeld的值
-        'activeStatus': item.activeStatus,
+      var msg = ''
-        'id': item.id
+      if (item.activeStatus === 1) { // 保存点击之前的状态
+        item.activeStatus = 2
+        msg = '发布'
+      } else {
+        item.activeStatus = 1
+        msg = '不发布'
      }
-      this.$axios.post('/active/update/status', params)
+      this.$confirm(`确定${msg}这篇文章吗?（请确认好文章内容）`, '提示', {
-        .then(function (res) {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        if (flag === 1) {
+          console.log(1)
+          item.activeStatus = 1
+          // this.$message.success('打开成功!')
+          this.$_switchHand(id, 1)
+        } else {
+          console.log(2)
+          item.activeStatus = 2
+          // this.$message.success('关闭成功！')
+          this.$_switchHand(id, 2)
+        }
+      }).catch(() => {
+        console.log('取消操作')
+      })
+    },
+    $_switchHand (id, type) {
+      let _this = this
+      this.$axios.post('/active/update/status', {
+        'activeStatus': type, // 1=>发布  2=>不发布
+        'id': id
+      }).then(function (res) {
        if (res === 'OK') {
          _this.$message({
            type: 'success',
@@ -523,7 +573,7 @@ export default {
    // 跳转到编辑页面
    articleEdit (item) {
      this.articleId = item.id
-      // console.log(item)
+      console.log(item)
      if (item.linkType === 1) { // 文本（文章编辑）
        // this.articleForm.articleTitle = item.activeTitle
        // this.articleForm.articleType = item.activeType
@@ -534,6 +584,7 @@ export default {
        this.outLink.articleName = item.activeTitle
        this.outLink.articleType = item.activeType
        this.outLink.articleLink = item.linkUrl
+        this.outLink.activePublisher = item.activePublisher
        this.outLinkDialogVisible = true
      }
    },
@@ -585,6 +636,7 @@ export default {
            'activeStatus': 1,
            'activeTitle': _this.outLink.articleName,
            'activeType': _this.outLink.articleType,
+            'activePublisher': _this.outLink.activePublisher,
            'linkUrl': _this.outLink.articleLink
          }
          this.$axios.post('/active/add/links', params)
@@ -608,6 +660,7 @@ export default {
          let params = {
            'activePropagandaId': _this.articleId,
            'activeTitle': _this.outLink.articleName,
+            'activePublisher': _this.outLink.activePublisher,
            'activeType': _this.outLink.articleType,
            'linkUrl': _this.outLink.articleLink
          }
@@ -624,7 +677,16 @@ export default {
            })
        }
      })
-    }
+    },
+    // 获取文章类型
+    _getActivityClassify () {
+      let _this = this
+      this.$axios.get('/active/classify')
+        .then(res => {
+          // console.log(res)
+          _this.activitys = res
+        })
+    },
  },
  beforeRouteEnter (to, from, next) {
    // console.log('to', to)

--- a/src/views/home/ArticleType.vue
+++ b/src/views/home/ArticleType.vue
@@ -11,35 +11,32 @@
      <el-table-column
        type="index"
        align="center"
-        label="序号"
+        width="100"
-        width="150">
+        label="序号">
      </el-table-column>
      <el-table-column
        prop="classifyName"
        align="left"
-        width="400"
        label="文章类型">
      </el-table-column>
      <el-table-column
        prop="createTime"
        align="left"
-        width="300"
        label="添加时间">
      </el-table-column>
      <el-table-column
        prop="createUser"
        align="center"
-        width="300"
        label="添加人">
      </el-table-column>
      <el-table-column
        prop="classifyMemo"
        align="center"
-        width="300"
        label="备注">
      </el-table-column>
      <el-table-column
        align="center"
+        width="200"
        label="操作">
        <template slot-scope="scope">
          <div @click.stop="deleteVisible = true">

--- a/src/views/home/NewArticle.vue
+++ b/src/views/home/NewArticle.vue
@@ -44,13 +44,13 @@
      :title=activeTitle
      :visible.sync="dialogVisible"
       class="active-content"
-      width="45%">
+      width="54%">
      <div class="sub_title">
        <!-- <span>发布时间：2020-06-28</span> -->
        <span style="margin-right: 30px">发布人：{{activePublisher}}</span>
        <span>发布时间：{{activePublishTime}}</span>
      </div>
-      <div v-html="activeContent"></div>
+      <div class="ql-snow ql-editor" v-html="activeContent"></div>
      <!-- <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisible = false">取 消</el-button>
        <el-button type="primary" @click="dialogVisible = false">确 定</el-button>
@@ -64,6 +64,7 @@ export default {
  name: 'newArticle',
  data () {
    return {
+      articleId: '', // 文章id
      activeTitle: '', // 文章标题
      activeType: '', // 文章类型id
      activitys: [],
@@ -72,15 +73,37 @@ export default {
      activeContent: '', // 富文本内容
      activePublishTime: '',
      editorOption: {
-        style: {
+        style: {},
-          // 'height': '700px'
+        modules: {
-        }
+          // syntax: {
+          //   highlight: text => hljs.highlightAuto(text).value
+          // },
+          toolbar: [
+            ['bold', 'italic', 'underline', 'strike'], // toggled buttons
+            ['blockquote', 'code-block'],
+            [{ 'header': 1 }, { 'header': 2 }], // custom button values
+            [{ 'list': 'ordered' }, { 'list': 'bullet' }],
+            [{ 'script': 'sub' }, { 'script': 'super' }], // superscript/subscript
+            [{ 'indent': '-1' }, { 'indent': '+1' }], // outdent/indent
+            [{ 'direction': 'rtl' }], // text direction
+            [{ 'size': ['small', false, 'large', 'huge'] }], // custom dropdown
+            [{ 'header': [1, 2, 3, 4, 5, 6, false] }],
+            [{ 'color': [] }, { 'background': [] }], // dropdown with defaults from theme
+            [{ 'font': [] }],
+            [{ 'align': [] }],
+            ['image']// 去除video
+          ]
+        },
+        placeholder: '编辑文章...'
      },
      dialogVisible: false
    }
  },
  mounted () {
-    this.activeContent = '发布 NewArticle.vue?64ba:75 <h1><strong>千年马场夏日再现“万马奔腾”美景</strong></h1><p>2020-07-01 07:13&nbsp;</p><p><img src="https://m1-1253159997.image.myqcloud.com/imageDir/5163634aca3444999659fd38eb9484af.jpg"></p><p>王将 摄</p><p><img src="https://m1-1253159997.image.myqcloud.com/imageDir/162b08588923879cd37c5c864687e777.jpg"></p><p>王将 摄王将 摄王将 摄王将 摄王将 摄王将 摄王将 摄王将 摄</p>'
+    console.log('父组件：mounted')
    this._getActivityClassify()
    this._getActivePublisher()
    this._getDetail()
@@ -88,12 +111,13 @@ export default {
  methods: {
    _getDetail () {
      console.log(this.$route.params)
-      const { activeTitle, activeContent, activePublisher, activeType, createTime } = this.$route.params
+      const { activeTitle, activeContent, activePublisher, activeType, createTime, id } = this.$route.params
      this.activeTitle = activeTitle
      this.activeContent = activeContent
      this.activePublisher = activePublisher
      this.activeType = activeType
      this.activePublishTime = createTime
+      this.articleId = id
    },
    // 获取活动类型
    _getActivityClassify () {
@@ -124,39 +148,58 @@ export default {
      // })
      this.dialogVisible = true
    },
-    $_publishHand () {
+    // 添加操作
+    $_addHand (type, msg) {
      let _this = this
      this.$axios.post('/active/add', {
        'activeContent': _this.activeContent,
        'activePublisher': _this.activePublisher,
-        'activeStatus': 1, // 1 => 发布  2 => 保存
+        'activeStatus': type, // 1 => 发布  2 => 保存
        'activeTitle': _this.activeTitle,
        'activeType': _this.activeType
      }).then(function (res) {
        if (res) {
          _this.$message({
            type: 'success',
-            message: '添加成功!'
+            message: msg
          })
        }
      })
    },
-    $_saveHand () {
+    // 更新操作
+    $_updateHand (type) {
      let _this = this
-      this.$axios.post('/active/add', {
+      this.$axios.post('/active/update', {
        'activeContent': _this.activeContent,
+        'activePropagandaId': _this.articleId,
+        'activeStatus': type, // 1 => 发布  2 => 保存
        'activePublisher': _this.activePublisher,
-        'activeStatus': 2,
        'activeTitle': _this.activeTitle,
        'activeType': _this.activeType
      }).then(function (res) {
        if (res) {
          _this.$message({
            type: 'success',
-            message: '保存成功!'
+            message: '更新成功!'
          })
        }
      })
+    },
+    // 发布
+    $_publishHand () {
+      if (this.articleId) { // 更新操作
+        this.$_updateHand(1)
+      } else {
+        this.$_addHand(1, '发布成功')
+      }
+    },
+    // 保存
+    $_saveHand () {
+      if (this.articleId) {
+        this.$_updateHand(2)
+      } else {
+        this.$_addHand(2, '保存成功')
+      }
    }
  }
 }