云集订单展示老师班级人数情况

src/components/yunji/index.vue

@@ -9,31 +9,19 @@
       </el-form-item>
       <el-form-item label="绑定状态">
         <el-select v-model="searchFrom.user_buy" placeholder="请选择" @change="getList" clearable>
-              <el-option
-                v-for="item in useTypeList"
-                :key="item.user_buy"
-                :label="item.value"
-                :value="item.user_buy">
+          <el-option v-for="item in useTypeList" :key="item.user_buy" :label="item.value" :value="item.user_buy">
           </el-option>
         </el-select>
       </el-form-item>
       <el-form-item label="商品名称">
         <el-select v-model="searchFrom.goods_id" placeholder="请选择" @change="getList" clearable>
-              <el-option
-                v-for="(data,index) in goodList"
-                :key="index"
-                :label="data | filterGoods"
-                :value="data.id">
+          <el-option v-for="(data,index) in goodList" :key="index" :label="data | filterGoods" :value="data.id">
           </el-option>
         </el-select>
       </el-form-item>
       <el-form-item label="老师">
         <el-select v-model="searchFrom.teacher_id" placeholder="请选择" @change="getList" clearable filterable>
-          <el-option
-            v-for="(data,index) in teacherList"
-            :key="index"
-            :label="data.name"
-            :value="data.id">
+          <el-option v-for="(data,index) in teacherList" :key="index" :label="data.name" :value="data.id">
           </el-option>
         </el-select>
       </el-form-item>
@@ -64,286 +52,308 @@
       <el-form-item>
         <el-button type="primary" @click="getList">搜索</el-button>
         <el-button type="primary" plain @click="exportTable(list)">导出</el-button>
+        <el-button type="success" plain @click="classListOption()">班级分布</el-button>
       </el-form-item>
     </el-form>
-    <el-table
-      :data="list"
-      style="width: 100%">
-       <el-table-column
-        prop="order_id"
-        label="订单号">
+    <el-table :data="list" style="width: 100%">
+      <el-table-column prop="order_id" label="订单号">
       </el-table-column>
-      <el-table-column
-        prop="nickname"
-        label="购买人">
+      <el-table-column prop="nickname" label="购买人">
         <template slot-scope="scope">
           <div v-if='scope.row.user_id !== 0' style="display: flex">
-              <img class="avatar" :src="scope.row.avatar"/> <div>{{scope.row.nickname}}<br>(ID:{{scope.row.user_id}})</div>
+            <img class="avatar" :src="scope.row.avatar" />
+            <div>{{scope.row.nickname}}<br>(ID:{{scope.row.user_id}})</div>
           </div>
           <div v-if='scope.row.user_id === 0'>
             暂未绑定用户
           </div>
         </template>
       </el-table-column>
-        <el-table-column
-        prop="goods_name"
-        label="商品名称" >
+      <el-table-column prop="goods_name" label="商品名称">
       </el-table-column>
-       <el-table-column
-        prop="receiver_name"
-        label="姓名" >
+      <el-table-column prop="receiver_name" label="姓名">
       </el-table-column>
-       <el-table-column
-        prop="receiver_phone"
-        label="手机号" >
+      <el-table-column prop="receiver_phone" label="手机号">
       </el-table-column>
-       <el-table-column
-        label="收货地址" >
+      <el-table-column label="收货地址">
         <template slot-scope="scope">
           {{scope.row.receiver_province}} {{scope.row.receiver_city}} {{scope.row.receiver_area}} {{scope.row.receiver_address}}
         </template>
       </el-table-column>
-      <el-table-column
-        prop="teacher_name"
-        label="班级老师" >
+      <el-table-column prop="teacher_name" label="班级老师">
       </el-table-column>
-      <el-table-column
-        prop="create_time"
-        label="创建时间" sortable>
+      <el-table-column prop="create_time" label="创建时间" sortable>
       </el-table-column>
-      <el-table-column
-        prop="pay_time"
-        label="支付时间"  sortable>
+      <el-table-column prop="pay_time" label="支付时间" sortable>
       </el-table-column>
-       <el-table-column
-        prop="desc"
-        label="备注" >
+      <el-table-column prop="desc" label="备注">
       </el-table-column>
-       <el-table-column
-        label="操作"  v-if="!$store.state.readonly" width="220">
+      <el-table-column label="操作" v-if="!$store.state.readonly" width="220">
         <template slot-scope="scope">
           <!-- <el-button @click="bindTeacher(scope.row)" size="mini" plain type="success">绑定老师</el-button> -->
           <el-button @click="editNote(scope.row.id, scope.row.desc)" size="mini" plain type="primary">编辑备注</el-button>
         </template>
       </el-table-column>
     </el-table>
-    <page :nowPage="nowPage" :total="total" @pageChange="onPageChange" @sizeChange="onSizeChange"/>
+    <page :nowPage="nowPage" :total="total" @pageChange="onPageChange" @sizeChange="onSizeChange" />
+
+    <el-dialog :title="classObj.title" :visible.sync="classObj.show" center width="800px">
+    <el-table :data="classList" >
+      <el-table-column prop="teacher_name" label="班级老师">
+      </el-table-column>
+       <el-table-column prop="num" label="班级人数">
+      </el-table-column>
+    </el-table>
+      <div style="margin-top:20px;">
+        同步时间：{{last_pull_time}}
+      </div>
+      <span slot="footer" class="dialog-footer">
+      </span>
+    </el-dialog>
     <teacher-dialog :dialogObj="dialogObj"></teacher-dialog>
   </div>
 </template>
 
 <script>
-  import page from '../framework/page'
-  import teacherDialog from './dialog'
-  import {getyunjiApi,getGoodsListApi,exportExcelApi,getTeacherListApi,orderDescApi} from "../../service/api";
-  import {GOODSTYPE} from "../../util/wordbook";
-  export default {
+import page from "../framework/page";
+import teacherDialog from "./dialog";
+import {
+  getyunjiApi,
+  getGoodsListApi,
+  exportExcelApi,
+  getTeacherListApi,
+  orderDescApi
+} from "../../service/api";
+import { GOODSTYPE } from "../../util/wordbook";
+export default {
   name: "smsRecord",
-    components:{
+  components: {
     page,
     teacherDialog
   },
-    data(){
+  data() {
     return {
       nowPage: 1,
       total: 0,
       limit: 10,
-        useTypeList:[
+      useTypeList: [
         {
-            user_buy:0,
-            value:'未绑定'
+          user_buy: 0,
+          value: "未绑定"
         },
         {
-            user_buy:1,
-            value:'已绑定'
-          },
+          user_buy: 1,
+          value: "已绑定"
+        }
       ],
       searchFrom: {
-          goods_id: '',
-          mobile:'',
-          order_id:'',
-          teacher_id:'',
-          payTime:[],
-          syncTime:[],
+        goods_id: "",
+        mobile: "",
+        order_id: "",
+        teacher_id: "",
+        payTime: [],
+        syncTime: []
       },
       list: [],
-        teacherList:[],
-        goodList:[],
-         dialogObj:{
-          show:false,
-          title:'绑定老师',
-          order_id:0,
+      teacherList: [],
+      goodList: [],
+      dialogObj: {
+        show: false,
+        title: "绑定老师",
+        order_id: 0,
         teacher_id: 0
       },
-      }
+      classObj:{
+        show: false,
+        title: "班级分布",
+        order_id: 0,
+        teacher_id: 0
+      },
+      classList:[],
+      last_pull_time:"无",
+    };
   },
-    filters:{
-      filterStatus:function (value) {
-        let msg = '';
-        if(value === 0){
-          msg = '未绑定'
-        }else{
-          msg= "已绑定"
+  filters: {
+    filterStatus: function(value) {
+      let msg = "";
+      if (value === 0) {
+        msg = "未绑定";
+      } else {
+        msg = "已绑定";
       }
       return msg;
     },
-       filterGoods(val){
-          return '[' + GOODSTYPE[val.goods_type] + ']' + '[' +val.current_price / 100 + '元]' + val.name
+    filterGoods(val) {
+      return (
+        "[" +
+        GOODSTYPE[val.goods_type] +
+        "]" +
+        "[" +
+        val.current_price / 100 +
+        "元]" +
+        val.name
+      );
     }
   },
-    mounted(){
+  mounted() {
     this.getList();
     this.getGoodsOption();
     this.getTeacherList();
   },
   methods: {
-      onPageChange(val){
+    onPageChange(val) {
       this.nowPage = val;
-        this.getList()
+      this.getList();
     },
-      getTeacherList(){
-        let json ={
-          page:1,
-          limit:200
-        }
-        getTeacherListApi(json).then(res=>{
+    getTeacherList() {
+      let json = {
+        page: 1,
+        limit: 200
+      };
+      getTeacherListApi(json).then(res => {
         this.teacherList = res.list;
       });
     },
-      onSizeChange(val){
+    onSizeChange(val) {
       this.nowPage = 1;
       this.limit = val;
-        this.getList()
+      this.getList();
     },
-      getList(){
+    getList() {
       let json = {
         limit: this.limit,
-          page: this.nowPage,
+        page: this.nowPage
       };
-         if(this.searchFrom.mobile){
-          json.mobile = this.searchFrom.mobile
+      if (this.searchFrom.mobile) {
+        json.mobile = this.searchFrom.mobile;
       }
-        if(this.searchFrom.teacher_id){
-          json.teacher_id = this.searchFrom.teacher_id
+      if (this.searchFrom.teacher_id) {
+        json.teacher_id = this.searchFrom.teacher_id;
       }
-          if(this.searchFrom.goods_name){
-          json.goods_name = this.searchFrom.goods_name
+      if (this.searchFrom.goods_name) {
+        json.goods_name = this.searchFrom.goods_name;
       }
-         if(this.searchFrom.user_buy || this.searchFrom.user_buy == 0){
-           json.user_buy = this.searchFrom.user_buy
+      if (this.searchFrom.user_buy || this.searchFrom.user_buy == 0) {
+        json.user_buy = this.searchFrom.user_buy;
       }
-         if(this.searchFrom.order_id){
-           json.order_id = this.searchFrom.order_id
+      if (this.searchFrom.order_id) {
+        json.order_id = this.searchFrom.order_id;
       }
-         if(this.searchFrom.goods_id){
-           json.goods_id = this.searchFrom.goods_id
+      if (this.searchFrom.goods_id) {
+        json.goods_id = this.searchFrom.goods_id;
       }
-         if(this.searchFrom.payTime && this.searchFrom.payTime.length > 0){
-          json.start_at =this.searchFrom.payTime[0]
-          json.end_at = this.searchFrom.payTime[1]
+      if (this.searchFrom.payTime && this.searchFrom.payTime.length > 0) {
+        json.start_at = this.searchFrom.payTime[0];
+        json.end_at = this.searchFrom.payTime[1];
       }
-        if(this.searchFrom.syncTime && this.searchFrom.syncTime.length > 0){
-          json.pull_start_at = this.searchFrom.syncTime[0]
-          json.pull_end_at =this.searchFrom.syncTime[1]
+      if (this.searchFrom.syncTime && this.searchFrom.syncTime.length > 0) {
+        json.pull_start_at = this.searchFrom.syncTime[0];
+        json.pull_end_at = this.searchFrom.syncTime[1];
       }
-         getyunjiApi(json).then((res)=>{
-           console.log(res.list)
+      getyunjiApi(json).then(res => {
+        console.log(res.list);
         this.total = res.total;
-           this.list = res.list ? res.list : []
-         })
+        this.list = res.list ? res.list : [];
+        console.log(res)
+        this.classList=res.teacher;
+        if(res.last_pull_time){
+        this.last_pull_time=res.last_pull_time;
+        }
+      });
     },
-       getGoodsOption(){
+    getGoodsOption() {
       let json = {
         page: 1,
         limit: 100
       };
-        getGoodsListApi(json).then(res=>{
+      getGoodsListApi(json).then(res => {
         this.goodList = res.list;
-        })
+      });
     },
-       bindTeacher(data){
+    bindTeacher(data) {
       this.dialogObj = {
-          show:true,
-          title:'绑定老师',
-          id:data.id,
+        show: true,
+        title: "绑定老师",
+        id: data.id,
         teacher_id: data.teacher_id
-        }
+      };
     },
-      editNote(id,desc){
-         this.$prompt('', '编辑备注', {
-          confirmButtonText: '确定',
-          cancelButtonText: '取消',
-          inputType:'textarea',
-          inputValue: desc || ''
+    editNote(id, desc) {
+      this.$prompt("", "编辑备注", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        inputType: "textarea",
+        inputValue: desc || ""
       }).then(({ value }) => {
-            this.$confirm('确定保存?', '提示', {
-              confirmButtonText: '确定',
-              cancelButtonText: '取消',
-              type: 'warning'
-            }).then(()=>{
-              orderDescApi({desc: value},id).then(res=>{
+        this.$confirm("确定保存?", "提示", {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning"
+        }).then(() => {
+          orderDescApi({ desc: value }, id).then(res => {
             this.$message({
-                  type: 'success',
-                  message: '编辑备注成功'
+              type: "success",
+              message: "编辑备注成功"
             });
             this.getList();
           });
         });
-        })
+      });
     },
-        exportTable(data){
-        if(data.length>0){
+    exportTable(data) {
+      if (data.length > 0) {
         let json = {};
         if (this.searchFrom.order_id) {
-          json.order_id = this.searchFrom.order_id
+          json.order_id = this.searchFrom.order_id;
         }
         if (this.searchFrom.user_buy || this.searchFrom.user_buy == 0) {
-          json.user_buy = this.searchFrom.user_buy
+          json.user_buy = this.searchFrom.user_buy;
         }
         if (this.searchFrom.mobile) {
-          json.mobile = this.searchFrom.mobile
+          json.mobile = this.searchFrom.mobile;
         }
         if (this.searchFrom.goods_id) {
-          json.goods_id = this.searchFrom.goods_id
+          json.goods_id = this.searchFrom.goods_id;
         }
-         if(this.searchFrom.teacher_id){
-          json.teacher_id = this.searchFrom.teacher_id
+        if (this.searchFrom.teacher_id) {
+          json.teacher_id = this.searchFrom.teacher_id;
         }
 
-       if(this.searchFrom.payTime && this.searchFrom.payTime.length > 0){
-          json.start_at =this.searchFrom.payTime[0]
-          json.end_at = this.searchFrom.payTime[1]
+        if (this.searchFrom.payTime && this.searchFrom.payTime.length > 0) {
+          json.start_at = this.searchFrom.payTime[0];
+          json.end_at = this.searchFrom.payTime[1];
         }
-        if(this.searchFrom.syncTime && this.searchFrom.syncTime.length > 0){
-          json.pull_start_at = this.searchFrom.syncTime[0]
-          json.pull_end_at =this.searchFrom.syncTime[1]
+        if (this.searchFrom.syncTime && this.searchFrom.syncTime.length > 0) {
+          json.pull_start_at = this.searchFrom.syncTime[0];
+          json.pull_end_at = this.searchFrom.syncTime[1];
         }
-            exportExcelApi(`api/admin/yunji/order/export`,json);
+        exportExcelApi(`api/admin/yunji/order/export`, json);
       }
-
     },
+    classListOption() {
+      this.classObj.show=true;
     }
   }
-
+};
 </script>
 
 <style scoped>
-  .sms{
+.sms {
   padding: 20px 0;
-  }
-  .avatar {
-    width:50px;
+}
+.avatar {
+  width: 50px;
   min-width: 50px;
   margin-right: 10px;
   height: 50px;
   border-radius: 50%;
-  }
+}
 </style>
 <style>
-  .userInfo >div{
+.userInfo > div {
   display: flex;
   flex-flow: row nowrap;
   justify-content: flex-start;
   align-items: center;
-  }
+}
 </style>