成长记录更新

src/components/growthRecord/index.vue

+<template>
+  <div class="putForward">
+    <el-form :model="search" class="demo-form-inline" inline label-width="80px">
+      <el-form-item label="昵称">
+        <el-input v-model="search.nickname" placeholder="昵称"></el-input>
+      </el-form-item>
+      <el-form-item label="用户ID">
+        <el-input v-model="search.user_id" placeholder="用户ID"></el-input>
+      </el-form-item>
+      <el-form-item label="手机号">
+        <el-input v-model="search.mobile" placeholder="手机号"></el-input>
+      </el-form-item>
+      <el-form-item label="提交时间">
+        <el-date-picker
+          type="daterange"
+          v-model="search.payTime"
+          range-separator="至"
+          value-format="yyyy-MM-dd"
+          start-placeholder="开始日期"
+          end-placeholder="结束日期"
+          :default-time="['00:00:00','23:59:59']">
+        </el-date-picker>
+      </el-form-item>
+
+      <el-form-item label="">
+        <el-button type="primary" @click="onSearch">查询</el-button>
+        <el-button type="success" @click="exportTable" v-if="$store.state.export">导出</el-button>
+      </el-form-item>
+    </el-form>
+
+    <el-table
+      :data="tableData"
+      border fixed
+      style="width: 100%">
+      <el-table-column
+        label="用户"
+        width="200"
+        className="f-c">
+        <template slot-scope="scope">
+          <img class="avatar" :src="scope.row.user_avatar"/> {{scope.row.user_nickname}}(ID:{{scope.row.user_id}})<br>手机：{{scope.row.user_mobile}}
+        </template>
+      </el-table-column>
+      <el-table-column
+        prop="element_title"
+        width="200"
+        label="歌曲名">
+      </el-table-column>
+      <el-table-column
+        prop="category_name"
+        width="200"
+        label="课程">
+      </el-table-column>
+      <el-table-column
+        prop="interest"
+        width="100"
+        label="兴趣度">
+      </el-table-column>
+      <el-table-column
+        prop="concent"
+        width="100"
+        label="专注度">
+      </el-table-column>
+      <el-table-column
+        prop="parent_child"
+        width="100"
+        label="亲子互动">
+      </el-table-column>
+      <el-table-column
+        prop="growth_record"
+        label="成长记录">
+        <template slot-scope="scope">
+          <el-popover
+            placement="top-start"
+            width="200"
+            trigger="hover"
+            :content="scope.row.growth_record">
+            <el-button slot="reference">{{scope.row.growth_record}}</el-button>
+          </el-popover>
+        </template>
+      </el-table-column>
+      <el-table-column
+        prop="created_at"
+        width="200"
+        label="提交时间">
+      </el-table-column>
+    </el-table>
+    <page :nowPage="nowPage" :total="total" :limit="limit" @pageChange="onPageChange" @sizeChange="onSizeChange"/>
+
+  </div>
+</template>
+
+<script>
+  import {getGrowthRecordApi} from "../../service/api";
+  import Cookie from '../../util/cookie'
+  import page from '../framework/page'
+  import CommonJs from '../../util/common';
+  import md5 from 'js-md5';
+  let singjson = {
+    sing: "singsingenglish21000"
+  };
+  export default {
+    name: "growthRecord",
+    data(){
+      return {
+        // today:{
+        //   text:'今天',
+        //   onClick:(vm)=>{
+        //     vm.$emit('pick', [this.formatTime(new Date())+' 00:00:00',this.formatTime(new Date())+' 23:59:59'])
+        //   }
+        // },
+        // yesterday:{
+        //   text:'昨天',
+        //   onClick:(vm)=>{
+        //     let preDate = this.formatTime(new Date(new Date().getTime() - 24*60*60*1000));
+        //     vm.$emit('pick', [preDate+' 00:00:00',preDate+' 23:59:59'])
+        //   }
+        // },
+        // last30Day:{
+        //   text:'过去30天',
+        //   onClick:(vm)=>{
+        //     let preDate = this.formatTime(new Date(new Date().getTime() - 30*24*60*60*1000));
+        //     vm.$emit('pick', [preDate+' 00:00:00',this.formatTime(new Date())+' 23:59:59']);
+        //   }
+        // },
+        // last7Day:{
+        //   text:'过去7天',
+        //   onClick:(vm)=>{
+        //     let preDate = this.formatTime(new Date(new Date().getTime() - 7*24*60*60*1000));
+        //     vm.$emit('pick', [preDate+' 00:00:00',this.formatTime(new Date())+' 23:59:59']);
+        //   }
+        // },
+        uploadHeader:{token:Cookie.get('cc_token')},
+        param_token:CommonJs.md5Code(),
+        nowPage: 1,
+        total: 0,
+        limit: 10,
+        search:{
+          key:'',
+          status:'1',
+          payTime:[]
+        },
+        liStatus:[
+          {
+            label: '全部',
+            status: ''
+          },
+          {
+            label: '申请中',
+            status: 0
+          },{
+            label: '提现成功',
+            status: 1
+          },{
+            label: '提现失败',
+            status: 2
+          }
+        ],
+        tableData:[],
+        showDialog:false,
+        showDesc:false,
+        dialogTitle:'审核',
+        nowObj:{
+          id:'',
+          status:1,
+          reason:'',
+          desc:""
+        },
+        page:{
+          current:1,
+          pageSize:100,
+          total:0
+        },
+        putForwardDialog: {
+          show: false,
+          user_id: '',
+          userLabel: '',
+          money: 0,
+          desc: ''
+        },
+        userList: [],
+        rules:{
+          userLabel:[
+            { required: true, message: '请选择用户', trigger: 'change' }
+          ],
+          money:[
+            { required: true, message: '请输入提现金额', trigger: 'change' }
+          ],
+          desc:[
+            { required: true, message: '请输入提现说明', trigger: 'change' }
+          ]
+        },
+        searchFrom:{},
+        selectUserList:[],
+        userDialog: {
+          show: false,
+          nowPage: 1,
+          total: 0,
+          limit: 5
+        }
+      }
+    },
+    components:{
+      page
+    },
+    filters:{
+      moneyYuan:function (value) {
+        if(!value){
+          return 0 + '元';
+        }
+        return value = (value/100).toFixed(2) + '元';
+      },
+      filterStatus:function (value) {
+        let msg = '';
+        if(value.status === 0){
+          msg = '审核中'
+        }else if(value.status === 1){
+          msg = '提现成功'
+        }else if(value.status === 2){
+          msg = '提现失败'+'('+value.reason+")"
+        }
+        return msg;
+      },
+      userLabel: function (val) {
+        return `${val.nickname}[${val.user_id}]`
+      }
+    },
+    mounted:function(){
+      this.getList()
+    },
+    methods:{
+      fileSuccess(){
+        this.$message({
+          message: '提交成功，请稍后刷新',
+          type: 'success'
+        });
+      },
+      /*formatTime(date){
+        let year = date.getFullYear();
+        let Month = date.getMonth()+1;
+        if(Month < 10){
+          Month = `0${Month}`
+        }
+        let Day = date.getDate();
+        if(Day<10)Day = `0${Day}`;
+        return `${year}-${Month}-${Day}`;
+      },*/
+      onSizeChange(val){
+        this.nowPage = 1;
+        this.limit = val;
+        this.getList()
+      },
+      exportTable(){
+        let json = {
+          limit: this.limit,
+          page: this.nowPage
+        };
+        if(this.search.user_id){
+          json.user_id = this.search.user_id
+        }
+        if(this.search.nickname){
+          json.nickname = this.search.nickname
+        }
+        if(this.search.mobile){
+          json.mobile = this.search.mobile
+        }
+        if (this.search.payTime && this.search.payTime.length > 0) {
+          json.start_at = this.search.payTime[0]
+          json.over_at = this.search.payTime[1]
+        }
+        exportExcelApi('/api/admin/user/growth/record/export', json, '成长记录')
+      },
+      //获取列表
+      getList:function () {
+        // console.log(this.limit)
+        let json = {
+          limit: this.limit,
+          page: this.nowPage
+        };
+        if(this.search.user_id){
+          json.user_id = this.search.user_id
+        }
+        if(this.search.nickname){
+          json.nickname = this.search.nickname
+        }
+        if(this.search.mobile){
+          json.mobile = this.search.mobile
+        }
+        if (this.search.payTime && this.search.payTime.length > 0) {
+          json.start_at = this.search.payTime[0]
+          json.over_at = this.search.payTime[1]
+        }
+        getGrowthRecordApi(json).then(res=>{
+          console.log(res)
+          this.tableData = res.list;
+          this.total = res.total;
+        })
+      },
+      // 查询按钮
+      onSearch(){
+        this.nowPage = 1;
+        //调用查询接口
+        this.getList();
+      },
+      //分页切换
+      onPageChange(current){
+        this.nowPage = current;
+        this.page.current=current;
+        this.getList();
+      },
+      // 弹框保存按钮
+      manualPutForward() {
+        this.putForwardDialog.show = true;
+        this.putForwardDialog.user_id = '';
+        this.putForwardDialog.userLabel = '';
+        this.putForwardDialog.money = 0;
+        this.putForwardDialog.desc = '';
+        this.getUserList();
+      },
+      getUserList(){
+        let json = {
+          limit: this.userDialog.limit,
+          page: this.userDialog.nowPage
+        }
+        if (this.searchFrom.userId) {
+          json.user_id = this.searchFrom.userId
+        }
+        if (this.searchFrom.nickName) {
+          json.nickname = this.searchFrom.nickName
+        }
+        if (this.searchFrom.mobile) {
+          json.mobile = this.searchFrom.mobile
+        }
+        getUserListApi(json).then(res=>{
+          this.userList = res.list;
+          this.userDialog.total = res.total;
+        })
+      },
+      confirmPutForward(){
+        let json = {
+          user_id: this.putForwardDialog.user_id,
+          money: this.putForwardDialog.money,
+          desc: this.putForwardDialog.desc
+        }
+        this.$refs["refPutForward"].validate((valid) => {
+          if (valid) {
+            this.$confirm('确定保存?', '提示', {
+              confirmButtonText: '确定',
+              cancelButtonText: '取消',
+              type: 'warning'
+            }).then(()=>{
+              payToUserApi(json).then(res=>{
+                this.$message({
+                  type: 'success',
+                  message: '保存成功'
+                });
+                this.getList();
+                this.putForwardDialog.show = false;
+              });
+            });
+          } else {
+            return false;
+          }
+        });
+      },
+      handleSelectionChange(a){
+        this.selectUserList = a
+      },
+      onUserPageChange(val){
+        this.userDialog.nowPage = val
+        this.getUserList()
+      },
+      onUserSizeChange(val){
+        this.userDialog.limit = val
+        this.userDialog.nowPage = 1;
+        this.getUserList()
+      },
+    }
+  }
+</script>
+
+<style scoped>
+  .putForward {
+    padding: 20px 0;
+  }
+  .status{
+    color: #e9a038;
+  }
+  .status.red{
+    color: #c30005;
+  }
+  .status.green{
+    color: #00ac00;
+  }
+  .avatar{
+    width: 50px;
+    margin-right: 5px;
+    border-radius: 50%;
+    height: 50px;
+  }
+  .el-popover__reference{
+    /* background: #c30005; */
+    max-width: 100%;
+  }
+</style>
+<style>
+  .el-popover__reference span{
+    display:-webkit-box;
+    -webkit-line-clamp:3;
+    -webkit-box-orient:vertical;
+    overflow:hidden;
+    white-space:normal;
+  }
+  .f-c > .cell {
+    display: flex !important;
+    flex-flow: row;
+    justify-content: flex-start;
+    align-items: center;
+  }
+</style>

src/components/userDetail/index.vue

@@ -359,6 +359,54 @@
           </el-table-column> -->
         </el-table>
       </el-tab-pane>
+      <el-tab-pane label="成长记录" name="growthRecord">
+        <el-table :data="growthRecordList">
+          <el-table-column
+            prop="element_title"
+            width="200"
+            label="歌曲名">
+          </el-table-column>
+          <el-table-column
+            prop="category_name"
+            width="200"
+            label="课程">
+          </el-table-column>
+          <el-table-column
+            prop="interest"
+            width="100"
+            label="兴趣度">
+          </el-table-column>
+          <el-table-column
+            prop="concent"
+            width="100"
+            label="专注度">
+          </el-table-column>
+          <el-table-column
+            prop="parent_child"
+            width="100"
+            label="亲子互动">
+          </el-table-column>
+          <el-table-column
+            prop="growth_record"
+            label="成长记录">
+            <template slot-scope="scope">
+              <el-popover
+                placement="top-start"
+                width="200"
+                trigger="hover"
+                :content="scope.row.growth_record">
+                <el-button slot="reference">{{scope.row.growth_record}}</el-button>
+              </el-popover>
+            </template>
+          </el-table-column>
+          <el-table-column
+            prop="created_at"
+            width="200"
+            label="提交时间">
+          </el-table-column>
+        </el-table>
+        <page :total="total" :limit="limit" @pageChange="onRecordPageChange" @sizeChange="onRecordSizeChange"/>
+      </el-tab-pane>
     </el-tabs>
     <teacher-dialog :dialogObj="dialogObj" @reflash="getDetail"></teacher-dialog>
     <user-list :userObj="userObj"/>
@@ -515,7 +563,8 @@
     getyunjiApi,
     fetchAddressListApi,
     getSubAccountInfoApi,
-    getUserSubAccountListApi
+    getUserSubAccountListApi,
+    getGrowthRecordApi
   } from "../../service/api";
   import page from '../framework/page'
   import sourceDialog from '../order/sourceDialog'
@@ -644,7 +693,8 @@
           }
         ],
         sourceByDateDialogJson: {},
-        deliverRecordList: []
+        deliverRecordList: [],
+        growthRecordList:[]
       }
     },
     created() {
@@ -675,6 +725,10 @@
         if (value === 'deliverRecord') {
           this.getDeliverRecordList()
         }
+        if (value === 'growthRecord') {
+          this.getGrowthRecordList()
+        }
+
 
       }
     },
@@ -713,6 +767,13 @@
           console.log(this.deliverRecordList)
         })
       },
+      getGrowthRecordList() {
+        getGrowthRecordApi({user_id: this.id, page: this.recordPage, limit: this.limit}).then(res => {
+          this.growthRecordList = res.list
+          this.total = res.total
+          console.log(this.growthRecordList)
+        })
+      },
       onUpdateAddress() {
         this.dialogObj.show = false;
         this.getAddressList();
@@ -857,6 +918,15 @@
         this.limit = val;
         this.getUser();
       },
+      onRecordPageChange(val) {
+        this.recordPage = val;
+        this.getGrowthRecordList();
+      },
+      onRecordSizeChange(val) {
+        this.recordPage = 1;
+        this.limit = val;
+        this.getGrowthRecordList();
+      },
       getUser() {
         let json = {
           user_id: this.id,

src/service/api.js

@@ -1497,3 +1497,9 @@ export const getHourSingleApi = function (json) {
 export const getHourTimeApi = function (json) {
   return Vue.prototype.$fetch(`${_baseUrl}api/admin/teacher/timeslotrecordlist`, json)
 };
+
+// 成长记录
+export const getGrowthRecordApi = function (json) {
+  return Vue.prototype.$fetch(`${_baseUrl}api/admin/user/growth/list`,json)
+};
+

src/util/menuList.js

@@ -233,6 +233,17 @@ export default [
     value: '用户管理',
     icon: 'icon-yonghu',
     list: [
+      {
+        value: '成长记录',
+        routerName: 'growthRecord',
+        path: '/growthRecord',
+        cover: '3-8',
+        router: {
+          path: '/growthRecord',
+          name: 'growthRecord',
+          component: e => require(['@/components/growthRecord'], e),
+        }
+      },
       {
         value: '用户列表',
         routerName: 'user',