更新

src/api/system/news.js

@@ -17,6 +17,14 @@ export function getNews(id) {
   })
 }
 
+// 分享新闻
+export function detail(id) {
+  return request({
+    url: '/system/news/detail/' + id,
+    method: 'get'
+  })
+}
+
 // 新增资讯
 export function addNews(data) {
   return request({

src/permission.js

@@ -7,7 +7,7 @@ import { getToken } from '@/utils/auth'
 
 NProgress.configure({ showSpinner: false })
 
-const whiteList = ['/login', '/auth-redirect', '/bind', '/register', '/template']
+const whiteList = ['/login', '/auth-redirect', '/bind', '/register', '/template','/news/detail/']
 
 router.beforeEach((to, from, next) => {
   NProgress.start()
@@ -53,6 +53,8 @@ router.beforeEach((to, from, next) => {
     for(var i in whiteList){
       var item = whiteList[i];
       if (to.path.indexOf(item) !== -1){
+        //设置页面标题
+        document.title =to.meta.title;
         k++;
       }
     }

src/router/index.js

@@ -26,17 +26,14 @@ import Layout from '@/layout'
  */
 
 // 公共路由
-export const constantRoutes = [
-  {
+export const constantRoutes = [{
     path: '/redirect',
     component: Layout,
     hidden: true,
-    children: [
-      {
-        path: '/redirect/:path(.*)',
-        component: (resolve) => require(['@/views/redirect'], resolve)
-      }
-    ]
+    children: [{
+      path: '/redirect/:path(.*)',
+      component: (resolve) => require(['@/views/redirect'], resolve)
+    }]
   },
   {
     path: '/login',
@@ -57,73 +54,77 @@ export const constantRoutes = [
     path: '',
     component: Layout,
     redirect: 'index',
-    children: [
-      {
-        path: 'index',
-        component: (resolve) => require(['@/views/index'], resolve),
-        name: '首页',
-        meta: { title: '首页', icon: 'dashboard', noCache: true, affix: true }
+    children: [{
+      path: 'index',
+      component: (resolve) => require(['@/views/index'], resolve),
+      name: '首页',
+      meta: {
+        title: '首页',
+        icon: 'dashboard',
+        noCache: true,
+        affix: true
       }
-    ]
+    }]
   },
   {
     path: '/user',
     component: Layout,
     hidden: true,
     redirect: 'noredirect',
-    children: [
-      {
-        path: 'profile',
-        component: (resolve) => require(['@/views/system/user/profile/index'], resolve),
-        name: 'Profile',
-        meta: { title: '个人中心', icon: 'user' }
+    children: [{
+      path: 'profile',
+      component: (resolve) => require(['@/views/system/user/profile/index'], resolve),
+      name: 'Profile',
+      meta: {
+        title: '个人中心',
+        icon: 'user'
       }
-    ]
+    }]
   },
   {
     path: '/dict',
     component: Layout,
     hidden: true,
-    children: [
-      {
-        path: 'type/data/:dictId(\\d+)',
-        component: (resolve) => require(['@/views/system/dict/data'], resolve),
-        name: 'Data',
-        meta: { title: '字典数据', icon: '' }
+    children: [{
+      path: 'type/data/:dictId(\\d+)',
+      component: (resolve) => require(['@/views/system/dict/data'], resolve),
+      name: 'Data',
+      meta: {
+        title: '字典数据',
+        icon: ''
       }
-    ]
+    }]
   },
   {
     path: '/job',
     component: Layout,
     hidden: true,
-    children: [
-      {
-        path: 'log',
-        component: (resolve) => require(['@/views/monitor/job/log'], resolve),
-        name: 'JobLog',
-        meta: { title: '调度日志' }
+    children: [{
+      path: 'log',
+      component: (resolve) => require(['@/views/monitor/job/log'], resolve),
+      name: 'JobLog',
+      meta: {
+        title: '调度日志'
       }
-    ]
+    }]
   },
   {
     path: '/gen',
     component: Layout,
     hidden: true,
-    children: [
-      {
-        path: 'edit/:tableId(\\d+)',
-        component: (resolve) => require(['@/views/tool/gen/editTable'], resolve),
-        name: 'GenEdit',
-        meta: { title: '修改生成配置' }
+    children: [{
+      path: 'edit/:tableId(\\d+)',
+      component: (resolve) => require(['@/views/tool/gen/editTable'], resolve),
+      name: 'GenEdit',
+      meta: {
+        title: '修改生成配置'
       }
-    ]
-  }
-  ,
+    }]
+  },
   {
     path: '/template/t1/:id(\\d+)',
     component: (resolve) => require(['@/views/template/t1'], resolve),
-    meta:{
+    meta: {
       title: '个人页'
     },
     hidden: true
@@ -132,27 +133,36 @@ 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: '' }
+    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: '个人发表' }
-      },
-    ]
+    children: [{
+      path: 'publish',
+      name: 'publish',
+      component: (resolve) => require(['@/views/system/appUser/detail/publish'], resolve),
+      meta: {
+        title: '个人发表'
+      }
+    }, ]
+  },
+  {
+    path: '/news/detail/:id(\\d+)',
+    component: (resolve) => require(['@/views/system/news/detail'], resolve),
+    name:'news_share',
+    meta: {
+      title: '新闻详情'
+    }
   },
   // {
   //   path: '/family',
@@ -171,6 +181,8 @@ export const constantRoutes = [
 
 export default new Router({
   mode: 'history', // 去掉url中的#
-  scrollBehavior: () => ({ y: 0 }),
+  scrollBehavior: () => ({
+    y: 0
+  }),
   routes: constantRoutes
 })

src/views/system/news/detail.vue

@@ -0,0 +1,66 @@
+<template>
+  <div class="contents" v-loading="loading">
+    <div v-if="item">
+      <div class="time">
+        <span>{{ item.createTime }}</span>
+        <span class="views" v-if="item.views">{{ item.views }} 人看过</span>
+      </div>
+      <div class="title">
+        <span v-if="item.title">【{{ item.title }}】</span>
+      </div>
+      <div v-html="item.contents"></div>
+    </div>
+    <div class="noData" v-else>内容无法访问</div>
+  </div>
+</template>
+
+<script>
+import { detail } from '@/api/system/news';
+export default {
+  data() {
+    return {
+      loading: true,
+      item: null
+    };
+  },
+  mounted(e) {
+    detail(this.$route.params.id).then(res => {
+      if (res.data) {
+        this.item = res.data;
+      }
+      this.loading = false;
+    });
+  },
+  methods: {}
+};
+</script>
+<style lang="scss">
+.contents {
+  padding: 20px;
+  .time {
+    color: #818184;
+    padding-bottom: 12px;
+    font-size: 14px;
+    .views {
+      padding-left: 20px;
+      float: right;
+    }
+  }
+  .title {
+    padding-top: 20px;
+    font-size: 23px;
+    font-weight: 400;
+    margin-bottom: 30px;
+  }
+  .noData {
+    text-align: center;
+    margin-top: 50px;
+    color: darkgray;
+    font-size: 20px;
+  }
+  img{
+    width: 100%;
+    border-radius: 3px;
+  }
+}
+</style>

src/views/system/news/edit.vue

@@ -6,7 +6,7 @@
         <el-form-item label="资讯标题" prop="title"><el-input v-model="form.title" placeholder="请输入资讯标题" clearable /></el-form-item>
         <el-form-item label="封面图" prop="pic">
           <el-button icon="el-icon-scissors" @click="getImg()">选取图片</el-button>
-          <el-image v-if="form.pic" :fit="'contain'" style="max-width:10%;display: block;margin-top: 10px;" :src="form.pic" :preview-src-list="[form.pic]"></el-image>
+          <el-image v-if="form.pic" :fit="'contain'" style="max-width:10%;display: block;margin-top: 10px;" :src="baseUrl+form.pic" :preview-src-list="[baseUrl+form.pic]"></el-image>
         </el-form-item>
         <div class="meditor">
           <el-form-item label="资讯内容" prop="contents"><Editor v-model="form.contents" :min-height="292" /></el-form-item>
@@ -38,6 +38,7 @@ export default {
   },
   data() {
     return {
+      baseUrl: process.env.VUE_APP_BASE_API,
       // 遮罩层
       show: false,
       loading: false,

src/views/system/news/index.vue

@@ -23,7 +23,7 @@
       <el-table-column label="资讯标题" align="center" prop="title" />
       <el-table-column label="封面图" align="center">
         <template slot-scope="scope">
-          <el-image class="lsw_square" :fit="'contain'" style="max-width:80px;" :src="scope.row.pic" :preview-src-list="[scope.row.pic]"></el-image>
+          <el-image class="lsw_square" :fit="'contain'" style="max-width:80px;" :src="baseUrl+scope.row.pic" :preview-src-list="[baseUrl+scope.row.pic]"></el-image>
         </template>
       </el-table-column>
       <el-table-column label="阅读量" align="center" prop="views" width="120"/>
@@ -56,6 +56,7 @@ export default {
   },
   data() {
     return {
+      baseUrl: process.env.VUE_APP_BASE_API,
       //新增,修改弹出框
       dialogVisible: false,
       // 遮罩层

src/views/system/shop/goods/edit.vue

@@ -12,7 +12,7 @@
         <el-form-item label="商品价格" prop="price"><el-input type="number" v-model="form.price" placeholder="请输入商品价格" clearable /></el-form-item>
         <el-form-item label="商品图片" prop="pic">
           <el-button icon="el-icon-scissors" @click="getImg()">选取图片</el-button>
-          <el-image v-if="form.pic" :fit="'contain'" style="max-width:10%;display: block;margin-top: 10px;" :src="form.pic" :preview-src-list="[form.pic]"></el-image>
+          <el-image v-if="form.pic" :fit="'contain'" style="max-width:10%;display: block;margin-top: 10px;" :src="baseUrl + form.pic" :preview-src-list="[baseUrl+form.pic]"></el-image>
         </el-form-item>
         <div>
           <el-form-item label="商品详情" prop="details"><Editor v-model="form.details" :min-height="292" /></el-form-item>
@@ -44,6 +44,7 @@ export default {
   },
   data() {
     return {
+      baseUrl: process.env.VUE_APP_BASE_API,
       // 遮罩层
       show: false,
       loading: false,

src/views/system/shop/goods/index.vue

@@ -1,11 +1,11 @@
 <template>
   <div class="app-container">
     <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="88px">
-        <el-form-item label="商品分类" prop="typeId">
-          <el-select v-model="queryParams.typeId" placeholder="请选择商品分类" clearable>
-            <el-option v-for="dict in typeIdOptions" :key="dict.id" :label="dict.name" :value="dict.id"></el-option>
-          </el-select>
-        </el-form-item>
+      <el-form-item label="商品分类" prop="typeId">
+        <el-select v-model="queryParams.typeId" placeholder="请选择商品分类" clearable>
+          <el-option v-for="dict in typeIdOptions" :key="dict.id" :label="dict.name" :value="dict.id"></el-option>
+        </el-select>
+      </el-form-item>
       <el-form-item label="商品标题" prop="title"><el-input v-model="queryParams.title" placeholder="请输入商品标题" clearable @keyup.enter.native="handleQuery" /></el-form-item>
       <el-form-item label="创建时间" prop="createTime">
         <el-date-picker
@@ -35,7 +35,7 @@
       <el-table-column label="商品类型" align="center" prop="tbGoodsType.name" />
       <el-table-column label="商品图片" align="center">
         <template slot-scope="scope">
-          <el-image class="lsw_square" :fit="'contain'" style="max-width:80px;" :src="scope.row.pic" :preview-src-list="[scope.row.pic]"></el-image>
+          <el-image class="lsw_square" :fit="'contain'" style="max-width:80px;" :src="baseUrl+scope.row.pic" :preview-src-list="[baseUrl+scope.row.pic]"></el-image>
         </template>
       </el-table-column>
       <el-table-column label="商品价格" align="center" prop="price" />
@@ -60,7 +60,7 @@
 </template>
 
 <script>
-import {typeList, listGoods, getGoods, delGoods, addGoods, updateGoods, exportGoods } from '@/api/system/shop/goods';
+import { typeList, listGoods, getGoods, delGoods, addGoods, updateGoods, exportGoods } from '@/api/system/shop/goods';
 import edit from './edit';
 export default {
   components: {
@@ -68,6 +68,7 @@ export default {
   },
   data() {
     return {
+      baseUrl: process.env.VUE_APP_BASE_API,
       //新增,修改弹出框
       dialogVisible: false,
       // 遮罩层

src/views/system/shop/orders/edit.vue

@@ -1,91 +1,218 @@
 <template>
   <div class="app-container">
     <!-- 添加或修改订单对话框 -->
-    <el-dialog :title="form.id?'编辑':'新增'"  :close-on-click-modal="false" :visible.sync="visible" @close="close" append-to-body>
-      <el-form ref="form" :model="form" :rules="rules" label-width="120px" v-loading="loading">
-        <el-form-item label="用户id" prop="appUserId">
-          <el-input v-model="form.appUserId" placeholder="请输入用户id" clearable/>
-        </el-form-item>
-        <el-form-item label="商品id" prop="goodsId">
-          <el-input v-model="form.goodsId" placeholder="请输入商品id" clearable/>
-        </el-form-item>
-        <el-form-item label="商品标题" prop="title">
-          <el-input v-model="form.title" placeholder="请输入商品标题" clearable/>
-        </el-form-item>
-      </el-form>
-      <div slot="footer" class="dialog-footer">
-        <el-button type="primary" @click="submitForm">确 定</el-button>
-        <el-button @click="visible = false">取 消</el-button>
+    <el-dialog :title="form.id ? '编辑' : '新增'" :close-on-click-modal="false" :visible.sync="visible" @close="close" append-to-body>
+      <div class="act" v-loading="loading">
+        <div class="mt10">
+          <el-alert class="mt10" title="用户取消订单" type="error" :closable="false" v-if="form.state == -1">{{ form.payCancelTime }}</el-alert>
+          <el-alert class="mt10" title="订单已完成" type="success" :closable="false" v-if="form.state == 2">{{ form.updateTime }}</el-alert>
+        </div>
+        <div class="timeline_user">
+          <!--用户信息-->
+          <div class="lsw_flex" v-if="form.tbAppUser">
+            <div class="f1"><img :src="baseUrl + form.tbAppUser.avatar" class="head" /></div>
+            <div class="f" v-if="form.tbAppUser">
+              <div class="nick_name">{{ form.tbAppUser.nickName }}</div>
+              <div class="phone">{{ form.tbAppUser.mobile }}</div>
+            </div>
+          </div>
+          <!--操作时间线-->
+          <div class="timeline">
+            <el-timeline :reverse="false">
+              <el-timeline-item v-for="(activity, index) in activities" :color="activity.color" :timestamp="activity.timestamp">
+                {{ activity.content }}
+                <el-card v-if="activity.content == '创建订单'" class="mt5">
+                  <div class="title">
+                    <i class="el-icon-message-solid"></i>
+                    购买服务
+                  </div>
+                  <div class="describe">{{ form.title }}</div>
+                   <div class="describe" style="margin-top: 10px;">备注：{{ form.notes }}</div>
+                </el-card>
+                <el-card v-if="activity.content == '支付成功'" class="mt5">
+                  <div class="title">
+                    <i class="el-icon-message-solid"></i>
+                    实付款
+                  </div>
+                  <div class="describe" style="font-size:29px;color: red;">¥ {{ form.money }}</div>
+                </el-card>
+              </el-timeline-item>
+            </el-timeline>
+          </div>
+          <!--操作时间线-->
+        </div>
+        <el-divider content-position="left"><span class="fs16">订单信息</span></el-divider>
+        <div class="bg">
+          <div class="lsw_row">
+            <div class="r1"><img :src="baseUrl + form.tbGoods.pic" class="pic" /></div>
+            <div class="r9">
+              <div>
+                {{ form.tbGoods.title }}
+                <span class="attr" style="margin-left:10px;">
+                  <el-tag effect="dark">{{ form.tbGoods.tbGoodsType.name }}</el-tag>
+                </span>
+              </div>
+              <div class="red mt5">¥ {{ form.money }}</div>
+              <div class="mt5">x {{ form.nums }}</div>
+            </div>
+            <div class="clearfix"></div>
+          </div>
+        </div>
+        <!--合计-->
+        <div class="order_info">
+          <div class="v-title">
+            合计:
+            <span class="red">￥{{ form.money }}</span>
+          </div>
+          <div class="v-title">
+            订单编号 :
+            <span class="bh">{{ form.orderNum }}</span>
+          </div>
+          <div class="v-title">
+            交易编号 :
+            <span class="bh">{{ form.transactionId }}</span>
+          </div>
+          <div class="v-title" v-if="form.state == 1">
+            <el-dropdown @command="submitForm">
+              <el-button type="primary">
+                订单操作
+                <i class="el-icon-arrow-down el-icon--right"></i>
+              </el-button>
+              <el-dropdown-menu slot="dropdown"><el-dropdown-item command="2">完成</el-dropdown-item></el-dropdown-menu>
+            </el-dropdown>
+          </div>
+        </div>
       </div>
     </el-dialog>
   </div>
 </template>
 
 <script>
-import { listOrders, getOrders, delOrders, addOrders, updateOrders, exportOrders } from "@/api/system/shop/orders";
+import { listOrders, getOrders, delOrders, addOrders, updateOrders, exportOrders } from '@/api/system/shop/orders';
 import { getToken } from '@/utils/auth';
 export default {
-  components: {
-  },
+  components: {},
   data() {
     return {
+      baseUrl: process.env.VUE_APP_BASE_API,
       // 遮罩层
       loading: false,
       visible: false,
       // 表单参数
-      form: {
-      },
-      // 表单校验
-      rules: {
-        orderNum: [{ required: true, message: "订单编号不能为空", trigger: "blur" }],
-        createTime: [{ required: true, message: "创建时间不能为空", trigger: "blur" }],
-      }
+      form: {},
+      activities: []
     };
   },
-  created() {
-  },
+  created() {},
   methods: {
     /** 查询订单列表 */
     init(id) {
-        this.visible = true;
-        if (id!='') {
-            this.loading = true;
-            getOrders(id).then(response => {
-                this.form = response.data;
-                this.loading = false;
-            });
-        }
+      this.visible = true;
+      if (id != '') {
+        this.loading = true;
+        getOrders(id).then(response => {
+          this.form = response.data;
+          this.activities = [];
+          this.activities.push({ content: '创建订单', timestamp: this.form.createTime, color: '#FF5722' });
+          if (this.form.state == 0) {
+            this.activities.push({ content: '待支付', timestamp: this.form.createTime, color: '#f56c6c' });
+          }
+          if (this.form.state > 0) {
+            this.activities.push({ content: '支付成功', timestamp: this.form.paySuccessTime, color: '#0bbd87' });
+          }
+          if (this.form.state == -1) {
+            this.activities.push({ content: '取消订单', timestamp: this.form.payCancelTime, color: '#f56c6c' });
+          }
+          this.loading = false;
+        });
+      }
     },
-    /** 提交按钮 */
-    submitForm() {
-      this.$refs["form"].validate(valid => {
-        if (valid) {
-          if (this.form.id != null) {
-            updateOrders(this.form).then(response => {
-              if (response.code === 200) {
-                this.msgSuccess("修改成功");
-                this.$emit('refresh'); //刷新父组件数据
-                this.visible = false;
-              }
-            });
-          } else {
-            addOrders(this.form).then(response => {
-              if (response.code === 200) {
-                this.msgSuccess("新增成功");
-                this.$emit('refresh'); //刷新父组件数据
-                this.visible = false;
-              }
-            });
+    /** 订单操作 */
+    submitForm(command) {
+      this.$confirm('是否确认完成！', '提示', { type: 'warning' }).then(() => {
+        this.form.state = command;
+        updateOrders(this.form).then(response => {
+          if (response.code === 200) {
+            this.msgSuccess('操作成功');
+            this.$emit('refresh');
+            this.visible = false;
           }
-        }
+        });
       });
     },
     // 关闭弹窗表单重置
-    close() {
-        this.resetForm('form');
-        this.form = {
-     }
-    },
+    close() {}
   }
 };
 </script>
+<style lang="scss">
+.lsw_flex {
+  display: flex;
+}
+.lsw_flex .f {
+  flex: 1;
+}
+.timeline_user {
+  margin-top: 20px;
+  .head {
+    width: 80px;
+    height: 80px;
+    border-radius: 50%;
+  }
+  .nick_name {
+    font-size: 16px;
+    font-weight: bold;
+    padding-top: 20px;
+    padding-left: 10px;
+  }
+  .phone {
+    padding-top: 5px;
+    padding-left: 10px;
+  }
+  .timeline {
+    margin-top: 13px;
+  }
+  .title {
+    font-size: 15px;
+    text-align: left;
+    font-weight: bold;
+    margin: 0px auto 15px auto !important;
+  }
+  .describe {
+    color: grey;
+    margin-top: 10px;
+    font-size: 13px;
+  }
+}
+.bg {
+  background-color: #e7e6e6;
+  padding: 10px;
+  border-radius: 3px;
+  font-size: 15px;
+  .lsw_row {
+    width: 100%;
+    .r1 {
+      float: left;
+      width: 10%;
+      img {
+        width: 65px;
+        height: 65px;
+      }
+    }
+    .r9 {
+      width: 90%;
+      float: left;
+    }
+  }
+}
+.order_info {
+  margin-top: 20px;
+  .v-title {
+    font-size: 20px;
+    margin-top: 10px;
+    .bh {
+      color: darkgray;
+    }
+  }
+}
+</style>

src/views/system/shop/orders/index.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="app-container">
     <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
-      <el-form-item label="手机号" prop="mobile"><el-input v-model="queryParams.mobile" placeholder="请输入商品标题" clearable @keyup.enter.native="handleQuery" /></el-form-item>
+      <el-form-item label="手机号" prop="mobile"><el-input v-model="queryParams.mobile" placeholder="请输入手机号" clearable @keyup.enter.native="handleQuery" /></el-form-item>
       <el-form-item label="订单编号" prop="orderNum">
         <el-input v-model="queryParams.orderNum" placeholder="请输入订单编号" clearable @keyup.enter.native="handleQuery" />
       </el-form-item>
@@ -36,7 +36,7 @@
       <el-table-column label="订单编号" align="center" prop="orderNum" />
       <el-table-column label="支付方式" align="center" prop="payType" sortable width="120">
         <template slot-scope="scope">
-          <el-tag type="danger" effect="dark" v-if="scope.row.payType == 1">支付宝</el-tag>
+          <el-tag effect="dark" v-if="scope.row.payType == 1">支付宝</el-tag>
           <el-tag type="success" effect="dark" v-if="scope.row.payType == 0">微信</el-tag>
         </template>
       </el-table-column>
@@ -44,6 +44,7 @@
         <template slot-scope="scope">
           <el-tag type="danger" effect="dark" v-if="scope.row.state == 0">未支付</el-tag>
           <el-tag type="success" effect="dark" v-if="scope.row.state == 1">进行中</el-tag>
+          <el-tag effect="dark" v-if="scope.row.state == 2">完成</el-tag>
           <el-tag type="info" effect="dark" v-if="scope.row.state == -1">取消订单</el-tag>
         </template>
       </el-table-column>
@@ -88,7 +89,7 @@ export default {
       queryParams: {
         pageNum: 1,
         pageSize: 10,
-        mobile:null,
+        mobile: null,
         orderNum: null,
         orderByColumn: 'o.id', //排序字段
         isAsc: 'desc' //排序方式