群发消息

src/components/groupSend/index.vue

 <template>
 <div class="index">
-  <div class="top">
-    <span class="title">群发助手</span>
-  </div>
+  <div class="b-title">群发列表 <el-button style="float: right; margin-bottom: 10px;" type="primary" plain @click="show = true">新建群发消息</el-button></div>
+  <el-table
+    :data="tableData"
+    style="width: 100%">
+    <el-table-column
+      prop="send_id"
+      label="消息ID">
+    </el-table-column>
+    <el-table-column
+      prop="send_num"
+      label="预计发送">
+    </el-table-column>
+    <el-table-column
+      prop="arrive_num"
+      label="已发送">
+    </el-table-column>
+    <el-table-column
+      prop="failed_num"
+      label="发送失败">
+    </el-table-column>
+    <el-table-column
+      prop="end_at"
+      label="截止时间">
+    </el-table-column>
+    <el-table-column
+      prop="created_at"
+      label="发送时间">
+    </el-table-column>
+    <el-table-column
+      label="操作"
+      min-width="100"
+    >
+      <template slot-scope="scope">
+        <el-button
+          @click="getMsgResult(scope.row.send_id)"
+          type="text"
+          plain
+          size="mini">
+          查询结果
+        </el-button>
+      </template>
+    </el-table-column>
+  </el-table>
+  <page :total="total" :limit="limit"  @pageChange="onPageChange"/>
+  <el-dialog title="新建群发消息"
+             :visible.sync="show">
+      <el-form ref="searchFrom" :model="searchFrom" label-width="150px">
+        <el-form-item label="时间">
+          <el-date-picker
+            v-model="searchFrom.time"
+            type="datetimerange"
+            range-separator="至"
+            start-placeholder="开始日期"
+            end-placeholder="结束日期"
+            :default-time="['00:00:00','23:59:59']">
+          </el-date-picker>
+        </el-form-item>
+        <el-form-item label="是否发送筛选用户">
+          <el-switch
+            v-model="searchFrom.is_test"
+            active-color="#13ce66"
+            inactive-color="#ff4949"/>
+        </el-form-item>
+        <el-form-item label="额外添加的open_id">
+          <el-input v-model="searchFrom.test_open_ids"></el-input>
+        </el-form-item>
         <el-tabs v-model="activeName" type="card" @tab-click="handleClick">
           <el-tab-pane label="文本" name="text">
             <div class="inner-edit_area">
@@ -14,7 +77,7 @@
               </el-input>
             </div>
           </el-tab-pane>
-    <el-tab-pane label="图片" name="picture">
+          <el-tab-pane label="图片" name="image">
             <div class="inner-edit_area">
               <el-upload
                 action="/api/public/upload/zone"
@@ -29,48 +92,75 @@
               </el-upload>
             </div>
           </el-tab-pane>
-    <el-tab-pane label="视频" name="radio">
-      <div class="inner-edit_area">
+          <el-tab-pane label="视频" name="video">
             <el-upload
+              class="upload-video"
               action="/api/public/upload/zone"
-          :http-request="uploadFile"
-          :before-upload="beforeAvatarUpload"
-          list-type="picture-card"
-          :file-list="imageList"
-          :on-success="handleAvatarSuccess"
-          :on-remove="handleRemove"
+              :http-request="uploadVideoFile"
+              :file-list="fileList"
+              :on-remove="handleRemoveVideo"
               :limit="1">
-          <i class="el-icon-plus"></i>
-        </el-upload>
+              <el-button size="small" type="primary" :disabled="(fileUid && progress < 99)">点击上传</el-button>
+              <div style="width: 300px">
+                <el-progress v-if="fileUid" :percentage="progress"></el-progress>
               </div>
+            </el-upload>
           </el-tab-pane>
         </el-tabs>
-  <div>
-    <el-button type="success" plain style="float: right; margin-right: 2%; margin-top: 20px;" @click="send" v-if="!$store.state.readonly">发送</el-button>
-  </div>
+      </el-form>
+    <span slot="footer" class="dialog-footer">
+      <el-button type="primary" @click="send()">确 定</el-button>
+    </span>
+  </el-dialog>
 </div>
 </template>
 
 <script>
-  import {uploadFileApi} from "../../service/api";
+  import {uploadFileApi,getMsgListApi,sendMsgApi} from "../../service/api";
+  import {MSGENVOPTION} from "../../util/wordbook";
+  import page from '../framework/page'
+  import CommonJs from '../../util/common';
   export default {
     name: "index",
+    components: {
+      page
+    },
     data() {
       return {
+        nowPage: 1,
+        total: 0,
+        limit: 10,
+        show: false,
         loading: false,
         activeName: 'text',
         list: [],
         content: '',
         uploadShow: true,
-        imageList: []
+        imageList: [],
+        fileList: [],
+        imageContent: '',
+        videoContent: '',
+        searchFrom: {},
+        msgOption: MSGENVOPTION,
+        tableData: [],
+        fileUid: null
       }
     },
     methods: {
+        test(){
+            console.log('searchFrom', this.searchFrom.is_test)
+        },
       handleClick(tab) {
         this.activeName = tab.name;
       },
       handleRemove(){
         this.uploadShow = true
+        this.imageList = []
+        this.imageContent = '';
+      },
+      handleRemoveVideo(){
+        this.videoContent = '';
+        this.fileList = []
       },
       beforeAvatarUpload(){
         this.uploadShow = false
@@ -83,6 +173,8 @@
         this.$store.dispatch('setProgress',{type:'new',id:a.file.uid});
         uploadFileApi({file:a.file,type:'local'}).then(res=>{
           this.imageList = [{name:res.url,url:process.env.IMAGE_URL_HEAD + res.url}]
+          this.imageContent = process.env.IMAGE_URL_HEAD + res.url;
+          console.log('this.imageContent', this.imageContent)
           this.loading = false;
           this.$message({
             type: 'success',
@@ -92,8 +184,131 @@
           this.loading = false;
         })
       },
+      uploadVideoFile(a) {
+        this.fileUid = a.file.uid;
+        this.loading = true;
+        this.$store.dispatch('setProgress',{type:'new',id:a.file.uid});
+        uploadFileApi({file:a.file,type:'local'}).then(res=>{
+            console.log('uploadVideoFile', res);
+          this.videoContent = process.env.IMAGE_URL_HEAD + res.url;
+          this.fileList = [{name:res.name,url:process.env.IMAGE_URL_HEAD + res.url}]
+          this.loading = false;
+          this.$message({
+            type: 'success',
+            message: '上传成功!'
+          });
+          this.$store.dispatch('setProgress',{type:'delete',id:a.file.uid});
+          this.fileUid=null
+        }).catch(()=>{
+          this.loading = false;
+        })
+      },
       send(){
+        let json = {}
+        if(this.searchFrom.time && this.searchFrom.time.length > 0){
+          json.start_at = CommonJs.dateFmt(this.searchFrom.time[0],"yyyy-MM-dd hh:mm:ss");
+          json.end_at = CommonJs.dateFmt(this.searchFrom.time[1],"yyyy-MM-dd hh:mm:ss")
+        } else {
+          this.$message({
+            type: 'error',
+            message: '请选择时间!'
+          });
+          return
+        }
+        let _content = {}
+        _content.type = this.activeName;
+        if (this.activeName === 'text') {
+          if(!this.content) {
+            this.$message({
+              type: 'error',
+              message: '请输入文本!'
+            });
+            return
+          } else {
+            _content.content = this.content;
+          }
+        } else if (this.activeName === 'image') {
+          if(!this.imageContent) {
+            this.$message({
+              type: 'error',
+              message: '请上传图片!'
+            });
+            return
+          } else {
+            _content.content = this.imageContent;
+          }
 
+        } else if (this.activeName === 'video') {
+          if(!this.videoContent) {
+            this.$message({
+              type: 'error',
+              message: '请上传视频!'
+            });
+            return
+          } else {
+            _content.content = this.videoContent;
+          }
+        }
+        json.content = JSON.stringify(_content)
+        json.is_test = this.searchFrom.is_test ? 1 : 2
+        if(this.searchFrom.test_open_ids){
+          json.test_open_ids = this.searchFrom.test_open_ids
+        }
+        console.log('sendmsg', json);
+        sendMsgApi(json).then((res)=>{
+          this.$message({
+            message: res,
+            type: 'success'
+          });
+          this.show = false;
+          this.clearData();
+          this.getMsgList();
+        })
+      },
+      clearData(){
+        this.content = '';
+        this.videoContent = null;
+        this.imageContent = null;
+        this.activeName === 'text';
+        this.searchFrom = {};
+        this.fileList = [];
+        this.imageList = [];
+      },
+      getMsgList(){
+        let json = {
+          limit: this.limit,
+          page: this.nowPage
+        };
+        getMsgListApi(json).then((res)=>{
+          this.tableData = res.list;
+          this.total = res.total
+        })
+      },
+      onPageChange(val){
+        this.nowPage = val
+        this.getMsgList()
+      },
+      getMsgResult(id){
+        if(!id) return;
+        let json = {
+          only_text: 1,
+          send_id: id
+        };
+        getMsgListApi(json).then((res)=>{
+          this.$message({
+            message: res,
+            type: 'success'
+          });
+          this.getMsgList();
+        })
+      }
+    },
+    mounted(){
+      this.getMsgList();
+    },
+    computed:{
+      progress(){
+        return this.$store.state.progressList.find(i=>{return i.id === this.fileUid}).num <100 ? this.$store.state.progressList.find(i=>{return i.id === this.fileUid}).num : 100
       }
     }
   }
@@ -118,4 +333,12 @@
     width: 96%;
     margin: 0 auto;
   }
+  .upload-video {
+    width: 50%;
+    margin-left:2%;
+  }
+  .b-title {
+    padding: 20px;
+    color: #666;
+  }
 </style>

src/components/order/index.vue

@@ -169,6 +169,10 @@
         prop="pay_at"
         label="购买时间">
       </el-table-column>
+      <el-table-column
+        prop="created_at"
+        label="下单时间">
+      </el-table-column>
       <el-table-column
         prop="desc"
         label="备注">

src/components/userDetail/index.vue

@@ -217,7 +217,7 @@
       <el-table-column
         label="购买方式">
         <template slot-scope="scope">
-          {{scope.row.buy_type === 1 ? '团购' : '单买'}}
+          {{scope.row.buy_type === 1 ? '团购' : '直购'}}
         </template>
       </el-table-column>
       <el-table-column
@@ -238,7 +238,7 @@
       </el-table-column>
       <el-table-column
         prop="created_at"
-        label="创建时间">
+        label="下单时间">
       </el-table-column>
     </el-table>
     <page :total="total" :limit="limit"  @pageChange="onPageChange"/>

src/service/api.js

@@ -554,4 +554,14 @@ const getWatchListUrl = '/api/admin/open/subscribe/statistics';
 export const getWatchListApi = function (json) {
   return Vue.prototype.$fetch(getWatchListUrl,json)
 };
+// 获取群发结果
+const getMsgListUrl = '/api/admin/open/muti/msg';
+export const getMsgListApi = function (json) {
+  return Vue.prototype.$fetch(getMsgListUrl,json)
+};
+// 群发客服消息
+const sendMsgUrl = `/api/admin/open/muti/msg`;
+export const sendMsgApi = function (json) {
+  return Vue.prototype.$post(`${sendMsgUrl}`, json)
+};
 

src/util/wordbook.js

@@ -92,3 +92,12 @@ export const INVITETYPEOPTION = [
     value: '推广渠道'
   }
 ];
+export const MSGENVOPTION = [
+  {
+    id: 1, value: '测试'
+  },
+  {
+    id: 2,
+    value: '正式'
+  },
+]