02/23 12:14

111

src/api/generalSettings.js

@@ -19,3 +19,12 @@ export function sysConfigUpdate(data) {
     })
 }
 
+
+// 报表中心导出课酬
+export function exportTeacherSalary(data) {
+    return request({
+        url: api + '/export/teacherSalary',
+        method: 'post',
+        data: qs.stringify(data)
+    })
+}

src/api/systemManage.js

@@ -323,4 +323,6 @@ export function resetAppVersionInfo(data) {
     method: 'post',
     data: qs.stringify(data)
   })
-}
+}
+
+// 

src/views/reportForm/index.vue

@@ -1,108 +1,84 @@
 <template>
   <div class="m-container">
     <h2>
-      <div class="squrt"></div>
-      报表中心
+      <div class="squrt"></div>报表中心
     </h2>
     <div class="m-core">
-      <p class="subTitle">请设置数据范围，选择分部，时间范围</p>
-      <el-form :inline="true"
-               :model="searchList">
-        <el-form-item label="分部名称">
-          <el-select v-model.trim="searchList.section">
-            <el-option label="嘿嘿嘿"
-                       value="1"></el-option>
-          </el-select>
-        </el-form-item>
-        <el-form-item label="乐团名称">
-          <el-select v-model.trim="searchList.team">
-            <el-option label="嘿嘿嘿"
-                       value="1"></el-option>
-          </el-select>
-        </el-form-item>
-        <br />
-        <el-form-item label="选择时间">
-          <el-date-picker v-model.trim="searchList.time"
-                          type="daterange"
-                          align="right"
-                          unlink-panels
-                          range-separator="至"
-                          start-placeholder="开始日期"
-                          end-placeholder="结束日期"
-                          :picker-options="pickerOptions">
-          </el-date-picker>
-        </el-form-item>
-      </el-form>
-      <p class="subTitle">请选择报表查看内容</p>
-      <div class="formList">
-        <el-checkbox-group v-model.trim="checkList">
-          <el-checkbox label="复选框 A"></el-checkbox>
-          <el-checkbox label="复选框 B"></el-checkbox>
-        </el-checkbox-group>
+      <div class="m-wrap">
+        <el-date-picker v-model="mouth" type="month" placeholder="选择月"></el-date-picker>
+
+        <div class="newBand" @click="exportSalar">导出课酬</div>
+        <el-tooltip placement="top" popper-class="mTooltip">
+          <div slot="content">
+            将只导出当前选择月份已结算的课程课酬。
+          </div>
+          <img :src="imageIcon" class="micon el-tooltip" style="width:8px height:8px" alt />
+        </el-tooltip>
       </div>
     </div>
   </div>
 </template>
 <script>
+import {exportTeacherSalary} from '@/api/generalSettings'
 export default {
-  name: 'reportForm',
-  data () {
+  name: "reportForm",
+  data() {
     return {
-      searchList: {
-        section: '',
-        team: '',
-        time: ''
-      },
-      pickerOptions: {
-        shortcuts: [{
-          text: '最近一周',
-          onClick (picker) {
-            const end = new Date();
-            const start = new Date();
-            start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
-            picker.$emit('pick', [start, end]);
-          }
-        }, {
-          text: '最近一个月',
-          onClick (picker) {
-            const end = new Date();
-            const start = new Date();
-            start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
-            picker.$emit('pick', [start, end]);
-          }
-        }, {
-          text: '最近三个月',
-          onClick (picker) {
-            const end = new Date();
-            const start = new Date();
-            start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
-            picker.$emit('pick', [start, end]);
-          }
-        }]
-      },
-      checkList: []
-    }
+      mouth: "",
+      imageIcon: require("@/assets/images/base/warning.png")
+    };
+  },
+  methods:{
+    exportSalar(){
+      if(!this.mouth){
+        this.$message.error('请选择导出月份')
+        return
+      }
+      exportTeacherSalary({date:this.mouth}).then(res=>{
+        if(res.code == 200){
+           let blob = new Blob([res.data], {
+              // type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8'
+              type: 'application/vnd.ms-excel;charset=utf-8'
+              //word文档为application/msword,pdf文档为application/pdf,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8
+            })
+            let objectUrl = URL.createObjectURL(blob)
+            let link = document.createElement("a")
+            let nowTime = new Date()
+            let ymd = nowTime.getFullYear() + '' + (nowTime.getMonth() + 1) + '' + nowTime.getDate() + '' +
+              nowTime.getHours() +
+              '' + nowTime.getMinutes()
+            let fname = '课酬导出' + new Date().getTime() //下载文件的名字
+            link.href = objectUrl
+            link.setAttribute("download", fname)
+            document.body.appendChild(link)
+            link.click()
+        }
+      })
   }
-}
+  }
+  
+};
 </script>
-<style lang="scss" scope>
+<style lang="scss" scoped>
 .m-container {
-  .el-date-editor--daterange.el-input,
-  .el-date-editor--daterange.el-input__inner,
-  .el-date-editor--timerange.el-input,
-  .el-date-editor--timerange.el-input__inner {
-    width: 400px;
-  }
-  .subTitle {
-    width: 1203px;
-    height: 40px;
-    line-height: 40px;
-    background-color: #fefceb;
-    padding: 0 25px;
-    box-sizing: border-box;
-    font-size: 16px;
-    color: #474747;
-    margin-bottom: 20px;
+  .m-wrap {
+    display: flex;
+    flex-direction: row;
+    justify-content: flex-start;
+    width: 100%;
+    // align-items: center;
+    .newBand {
+      margin: 0 5px 0 50px;
+    }
+    .el-tooltip.micon {
+      width: 20px;
+      height: 20px;
+      position: relative;
+      top: 12px;
+    }
   }
 }
+/deep/.el-input__icon.el-icon-date {
+  height: 40px !important;
+}
 </style>