11.20

src/permission.js

@@ -5,7 +5,7 @@ import 'nprogress/nprogress.css'// Progress 进度条样式
 import { Message } from 'element-ui'
 import { Message } from 'element-ui'
 import { getToken } from '@/utils/auth' // 验权
 import { getToken } from '@/utils/auth' // 验权
 
 
-const whiteList = ['/userList','/courseList','/pianoList','/courseEdit','/bannerList','/bannerEdit'] // 不重定向白名单
+const whiteList = ['/userList','/courseList','/pianoList','/courseEdit','/bannerList','/bannerEdit','/bargainList','/bargainEdit'] // 不重定向白名单
 router.beforeEach((to, from, next) => {
 router.beforeEach((to, from, next) => {
   NProgress.start()
   NProgress.start()
   if (getToken()) {
   if (getToken()) {

src/router/index.js

@@ -110,6 +110,25 @@ export const constantRouterMap = [
       }
       }
     ]
     ]
   },
   },
+  {
+    path: '',
+    component: Layout,
+    children: [
+      {
+        path: '/bargainList',
+        component: () => import('@/views/bargain/index'),
+        name: 'bargainList',
+        meta: { title: '砍价活动管理', noCache: false }
+      },
+      {
+        path: '/bargainEdit',
+        component: () => import('@/views/bargain/bargainEdit'),
+        name: 'bargainEdit',
+        meta: { title: '砍价活动编辑', noCache: false },
+        hidden: true
+      }
+    ]
+  },
   { path: '*', redirect: '/404', hidden: true }
   { path: '*', redirect: '/404', hidden: true }
 ]
 ]
 
 

src/views/bargain/bargainEdit.vue

+<template>
+  <div class="app-container">
+    <sticky className="sub-navbar">
+      <div style="text-align: right;margin-bottom: 20px">
+        <el-button type="primary" @click="saveData">保存</el-button>
+        <el-button type="danger" @click="backList">取消</el-button>
+      </div>
+    </sticky>
+    <el-form :rules="rules" ref="dataForm" :model="temp" label-position="left" label-width="100px"
+             style='width: 650px; margin-left:50px;'>
+      <el-form-item label="活动名称" prop="activityName">
+        <el-input type="text" placeholder="请输入活动名称"
+                  v-model.trim="temp.activityName">
+        </el-input>
+      </el-form-item>
+      <el-form-item label="活动天数" prop="activityDay">
+        <el-input type="text" placeholder="请输入活动天数"
+                  v-model.trim="temp.activityDay">
+        </el-input>
+      </el-form-item>      
+      <el-form-item label="参与人数" prop="numberOfParticipants">
+        <el-input type="text" placeholder="请输入参与人数"
+                  v-model.trim="temp.numberOfParticipants">
+        </el-input>
+      </el-form-item>      
+      <el-form-item label="原价" prop="originalPrice">
+        <el-input type="text" placeholder="请输入原价"
+                  v-model.trim="temp.originalPrice">
+        </el-input>
+      </el-form-item>      
+      <el-form-item label="活动价格" prop="activityPrice">
+        <el-input type="text" placeholder="请输入活动价格"
+                  v-model.trim="temp.activityPrice">
+        </el-input>
+      </el-form-item>      
+      <el-form-item label="实际可砍价金额" prop="ActualAmountAvailable">
+        <el-input type="text" placeholder="请输入实际可砍价金额"
+                  v-model.trim="temp.ActualAmountAvailable">
+        </el-input>
+      </el-form-item>      
+    </el-form>
+
+    <div class="editor-container">
+      <Tinymce :height="500" ref="editor" v-model="temp.commodity_introduction"/>
+    </div>
+  </div>
+</template>
+
+<script>
+import Tinymce from '@/components/Tinymce'
+import Sticky from '@/components/Sticky' // 粘性header组件
+import { upload_url } from '@/common/config'
+
+export default {
+  name: 'courseEdit',
+  components: { Tinymce, Sticky},
+  props: ['currentId'],
+  data() {
+    return {
+      bannerTypes: [],
+      // 临时的表单值
+      temp: {
+        id: undefined,
+        activityName:undefined,
+        activityDay: undefined,
+        numberOfParticipants: undefined,
+        originalPrice:undefined,
+        activityPrice: undefined,
+        ActualAmountAvailable: undefined,
+        createDate: undefined,
+        creteUser: undefined,
+        commodity_introduction: undefined
+      },
+      uploadUrl: upload_url,
+      // 表单验证的规则
+      rules: {
+        activityName: [
+          { required: true, message: '活动名称不能为空', trigger: 'blur'},
+          { type: 'string', max: 25, message: '活动名称不允许大于25位数', trigger: 'blur' },
+        ],
+        activityDay: [
+            { required: true, message: '活动天数不能为空', trigger: 'blur' },
+            { type: 'number', message: '只允许输入数字', trigger: 'blur' }
+            ],
+        numberOfParticipants: [
+            { required: true, message: '参与人数不能为空', trigger: 'blur' },
+            { type: 'number', message: '只允许输入数字', trigger: 'blur' }
+            ],
+        originalPrice: [
+            { required: true, message: '原价不能为空', trigger: 'blur' },
+            { type: 'number', message: '只允许输入数字', trigger: 'blur' }
+            ],
+        activityPrice: [
+            { required: true, message: '活动价格不能为空', trigger: 'blur' },
+            { type: 'number', message: '只允许输入数字', trigger: 'blur' }
+            ],
+        ActualAmountAvailable: [
+            { required: true, message: '实际可砍价金额不能为空', trigger: 'blur' },
+            { type: 'number', message: '只允许输入数字', trigger: 'blur' }
+            ],
+      },
+      videoFlag: false,
+      videoUploadPercent: 0,
+      pickerOptions1: {
+        // 大于当前时间
+        disabledDate: (time) => {
+          return time.getTime() < Date.now()
+        }
+      }
+    }
+  },
+  filters: {},
+  created() {
+    const params = this.$route.params
+    if (params && params.id) {
+      this.$fetch.sysCourse.query({ id: params.id }).then(({ data }) => {
+        this.temp = data;
+      })
+    }
+  },
+  computed: {
+    // 加载显示的文字
+    displays() {
+      return this.$store.getters.displays
+    }
+  },
+  mounted() {
+    this.createTime();
+    this.$fetch.sysCourseType.findAll().then(({ data }) => {
+      console.log(data);
+      this.bannerTypes = data
+      const params = this.$route.params
+      if (!params || !params.id) {
+        this.temp.type = data[0].value
+      }
+    })
+  },
+  methods: {
+    // 返回
+    backList() {
+      this.$confirm('是否放弃当前编辑信息?', '提示', {
+        confirmButtonText: '继续编辑',
+        cancelButtonText: '放弃',
+        type: 'warning'
+      }).then(() => {
+
+      }).catch(() => {
+        this.$message({
+          type: 'warning',
+          message: '已取消编辑'
+        })
+        this.back()
+      })
+    },
+    createTime(){
+      var date=new Date();
+      var year = date.getFullYear();       //年
+      var month = date.getMonth() + 1;     //月
+      var day = date.getDate(); 
+      this.temp.createDate=year+'-'+month+'-'+day;
+    },
+    // 返回
+    back() {
+      this.$router.push({ name: 'courseList' })
+    },
+    saveData() {
+      if (this.videoFlag) {
+        this.$message.warning('请等待视频上传成功')
+        return
+      }
+      console.log(this.$refs['dataForm'])
+      this.$refs['dataForm'].validate(valid => {
+        if (valid) {
+          const tempData = Object.assign({}, this.temp)
+          if (!tempData.id) {
+            this.createTime();
+            this.$fetch.sysCourse.insert(tempData).then(() => {
+              this.$message({
+                message: '创建成功',
+                type: 'success'
+              })
+              this.back()
+            })
+          } else {
+            this.$fetch.sysCourse.update(tempData).then(() => {
+              this.$message({
+                message: '更新成功',
+                type: 'success'
+              })
+              this.back()
+            })
+          }
+        } else {
+          console.log('valid error')
+        }
+      })
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+  .el-rate {
+  }
+
+  .editor-container {
+    min-height: 500px;
+    margin: 0 0 30px;
+
+  }
+
+  .editor-upload-btn-container {
+    text-align: right;
+    margin-right: 10px;
+  }
+
+  .editor-upload-btn {
+    display: inline-block;
+  }
+
+  .avatar {
+    width: 500px;
+    height: 300px;
+    display: block;
+  }
+  .avatar-img {
+    width: 150px;
+    height: 150px;
+    display: block;
+  }
+</style>