|
@@ -1,192 +1,256 @@
|
|
<template>
|
|
<template>
|
|
- <section>
|
|
|
|
- <!--工具条-->
|
|
|
|
- <el-col :span="24" class="toolbar" style="padding-bottom: 0px;">
|
|
|
|
- <el-form :inline="true">
|
|
|
|
- <el-form-item>
|
|
|
|
- <el-date-picker v-model="date" :editable="false" format="yyyy-MM-dd" value-format="yyyy-MM-dd" @change='getList' :clearable="false" type="date" placeholder="选择日期"></el-date-picker>
|
|
|
|
- </el-form-item>
|
|
|
|
- <el-form-item style="float:right;">
|
|
|
|
- <el-link type="primary" :underline="false" @click="handleAdd">异常申请</el-link>
|
|
|
|
- </el-form-item>
|
|
|
|
- </el-form>
|
|
|
|
- </el-col>
|
|
|
|
|
|
+ <section>
|
|
|
|
+ <!--工具条-->
|
|
|
|
+ <el-col :span="24" class="toolbar" style="padding-bottom: 0px;">
|
|
|
|
+ <el-form :inline="true">
|
|
|
|
+ <el-form-item>
|
|
|
|
+ <el-date-picker
|
|
|
|
+ v-model="date"
|
|
|
|
+ :editable="false"
|
|
|
|
+ format="yyyy-MM-dd"
|
|
|
|
+ value-format="yyyy-MM-dd"
|
|
|
|
+ @change="getList"
|
|
|
|
+ :clearable="false"
|
|
|
|
+ type="date"
|
|
|
|
+ placeholder="选择日期"
|
|
|
|
+ ></el-date-picker>
|
|
|
|
+ </el-form-item>
|
|
|
|
+ <el-form-item style="float:right;">
|
|
|
|
+ <el-link type="primary" :underline="false" @click="handleAdd">异常申请</el-link>
|
|
|
|
+ </el-form-item>
|
|
|
|
+ </el-form>
|
|
|
|
+ </el-col>
|
|
|
|
|
|
- <!--列表-->
|
|
|
|
- <el-table :data="list" highlight-current-row v-loading="listLoading" :height="tableHeight" style="width: 100%;">
|
|
|
|
- <el-table-column type="index" width="60"></el-table-column>
|
|
|
|
- <el-table-column prop="projectName" label="姓名" width="140" sortable></el-table-column>
|
|
|
|
- <el-table-column prop="ownerCompanyName" label="手机" width="180"></el-table-column>
|
|
|
|
- <el-table-column prop="customCompaniesStr" label="编程"></el-table-column>
|
|
|
|
- <el-table-column prop="manager" label="设计" sortable></el-table-column>
|
|
|
|
- <el-table-column prop="manager" label="办公" sortable></el-table-column>
|
|
|
|
- <el-table-column prop="manager" label="娱乐" sortable></el-table-column>
|
|
|
|
- <el-table-column prop="manager" label="浏览" sortable></el-table-column>
|
|
|
|
- <el-table-column prop="indate" label="总时长" width="180" sortable></el-table-column>
|
|
|
|
- </el-table>
|
|
|
|
|
|
+ <!--列表-->
|
|
|
|
+ <el-table
|
|
|
|
+ :data="list"
|
|
|
|
+ highlight-current-row
|
|
|
|
+ v-loading="listLoading"
|
|
|
|
+ :height="tableHeight"
|
|
|
|
+ style="width: 100%;"
|
|
|
|
+ >
|
|
|
|
+ <el-table-column type="index" width="60"></el-table-column>
|
|
|
|
+ <el-table-column prop="projectName" label="姓名" width="140" sortable></el-table-column>
|
|
|
|
+ <el-table-column prop="ownerCompanyName" label="手机" width="180"></el-table-column>
|
|
|
|
+ <el-table-column prop="customCompaniesStr" label="编程"></el-table-column>
|
|
|
|
+ <el-table-column prop="manager" label="设计" sortable></el-table-column>
|
|
|
|
+ <el-table-column prop="manager" label="办公" sortable></el-table-column>
|
|
|
|
+ <el-table-column prop="manager" label="娱乐" sortable></el-table-column>
|
|
|
|
+ <el-table-column prop="manager" label="浏览" sortable></el-table-column>
|
|
|
|
+ <el-table-column prop="indate" label="总时长" width="180" sortable></el-table-column>
|
|
|
|
+ </el-table>
|
|
|
|
|
|
- <!--工具条-->
|
|
|
|
- <el-col :span="24" class="toolbar">
|
|
|
|
- <el-pagination
|
|
|
|
- @size-change="handleSizeChange"
|
|
|
|
- @current-change="handleCurrentChange"
|
|
|
|
- :page-sizes="[20 , 50 , 80 , 100]"
|
|
|
|
- :page-size="20"
|
|
|
|
- layout="total, sizes, prev, pager, next"
|
|
|
|
- :total="total"
|
|
|
|
- style="float:right;">
|
|
|
|
- </el-pagination>
|
|
|
|
- </el-col>
|
|
|
|
|
|
+ <!--工具条-->
|
|
|
|
+ <el-col :span="24" class="toolbar">
|
|
|
|
+ <el-pagination
|
|
|
|
+ @size-change="handleSizeChange"
|
|
|
|
+ @current-change="handleCurrentChange"
|
|
|
|
+ :page-sizes="[20 , 50 , 80 , 100]"
|
|
|
|
+ :page-size="20"
|
|
|
|
+ layout="total, sizes, prev, pager, next"
|
|
|
|
+ :total="total"
|
|
|
|
+ style="float:right;"
|
|
|
|
+ ></el-pagination>
|
|
|
|
+ </el-col>
|
|
|
|
|
|
- <!--新增界面-->
|
|
|
|
- <el-dialog title="异常申请列表" v-if="addFormVisible" :visible.sync="addFormVisible" :close-on-click-modal="false" customClass='customWidth'>
|
|
|
|
- <el-table :data="list" highlight-current-row v-loading="listLoading" height="400" style="width: 100%;">
|
|
|
|
- <el-table-column type="index" width="60"></el-table-column>
|
|
|
|
- <el-table-column prop="projectName" label="姓名" width="140" sortable></el-table-column>
|
|
|
|
- <el-table-column prop="indate" label="工作时长" width="100" sortable></el-table-column>
|
|
|
|
- <el-table-column prop="indate" label="异常原因" width="180" sortable></el-table-column>
|
|
|
|
- <el-table-column prop="indate" label="时间" sortable></el-table-column>
|
|
|
|
- </el-table>
|
|
|
|
- <div slot="footer" class="dialog-footer">
|
|
|
|
- <el-button @click.native="addFormVisible = false">取消</el-button>
|
|
|
|
- </div>
|
|
|
|
- </el-dialog>
|
|
|
|
- </section>
|
|
|
|
|
|
+ <!--新增界面-->
|
|
|
|
+ <el-dialog
|
|
|
|
+ title="异常申请列表"
|
|
|
|
+ v-if="addFormVisible"
|
|
|
|
+ :visible.sync="addFormVisible"
|
|
|
|
+ :close-on-click-modal="false"
|
|
|
|
+ customClass="customWidth"
|
|
|
|
+ >
|
|
|
|
+ <el-table
|
|
|
|
+ :data="list"
|
|
|
|
+ highlight-current-row
|
|
|
|
+ v-loading="listLoading"
|
|
|
|
+ height="400"
|
|
|
|
+ style="width: 100%;"
|
|
|
|
+ >
|
|
|
|
+ <el-table-column type="index" width="60"></el-table-column>
|
|
|
|
+ <el-table-column prop="projectName" label="姓名" width="140" sortable></el-table-column>
|
|
|
|
+ <el-table-column prop="indate" label="工作时长" width="100" sortable></el-table-column>
|
|
|
|
+ <el-table-column prop="indate" label="异常原因" width="180" sortable></el-table-column>
|
|
|
|
+ <el-table-column prop="indate" label="时间" sortable></el-table-column>
|
|
|
|
+ </el-table>
|
|
|
|
+ <div slot="footer" class="dialog-footer">
|
|
|
|
+ <el-button @click.native="addFormVisible = false">取消</el-button>
|
|
|
|
+ </div>
|
|
|
|
+ </el-dialog>
|
|
|
|
+ </section>
|
|
</template>
|
|
</template>
|
|
|
|
|
|
<script>
|
|
<script>
|
|
- import util from '../../common/js/util'
|
|
|
|
|
|
+import util from "../../common/js/util";
|
|
|
|
|
|
- export default {
|
|
|
|
- data() {
|
|
|
|
- return {
|
|
|
|
- user: JSON.parse(sessionStorage.getItem('user')),
|
|
|
|
|
|
+export default {
|
|
|
|
+ data() {
|
|
|
|
+ return {
|
|
|
|
+ user: JSON.parse(sessionStorage.getItem("user")),
|
|
|
|
|
|
- date: new Date(),
|
|
|
|
|
|
+ date: new Date(),
|
|
|
|
|
|
- tableHeight: 0,
|
|
|
|
- listLoading: false,
|
|
|
|
- total: 0,
|
|
|
|
- page: 1,
|
|
|
|
- size: 20,
|
|
|
|
- list: [],
|
|
|
|
-
|
|
|
|
- addFormVisible: false,
|
|
|
|
- addLoading: false,
|
|
|
|
- }
|
|
|
|
- },
|
|
|
|
- methods: {
|
|
|
|
- //分页
|
|
|
|
- handleCurrentChange(val) {
|
|
|
|
- this.page = val;
|
|
|
|
- this.getList();
|
|
|
|
- },
|
|
|
|
|
|
+ tableHeight: 0,
|
|
|
|
+ listLoading: false,
|
|
|
|
+ total: 0,
|
|
|
|
+ page: 1,
|
|
|
|
+ size: 20,
|
|
|
|
+ list: [],
|
|
|
|
|
|
- handleSizeChange(val) {
|
|
|
|
- this.size = val;
|
|
|
|
- this.getList();
|
|
|
|
- },
|
|
|
|
-
|
|
|
|
- //获取项目列表
|
|
|
|
- getList() {
|
|
|
|
- this.listLoading = true;
|
|
|
|
- this.http.post(this.port.project.projectList, {
|
|
|
|
- keyName: '',
|
|
|
|
- pageNum: this.page,
|
|
|
|
- pageSize: this.size,
|
|
|
|
- }, res => {
|
|
|
|
- this.listLoading = false;
|
|
|
|
- if (res.code == "ok") {
|
|
|
|
- var list = res.data.list;
|
|
|
|
- for(var i in list){
|
|
|
|
- var customCompaniesStr = "";
|
|
|
|
- for(var j in list[i].customCompanies){
|
|
|
|
- if(j == list[i].customCompanies.length -1){
|
|
|
|
- customCompaniesStr += list[i].customCompanies[j].companyName;
|
|
|
|
- } else {
|
|
|
|
- customCompaniesStr += list[i].customCompanies[j].companyName + "、";
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
- list[i].customCompaniesStr = customCompaniesStr;
|
|
|
|
- }
|
|
|
|
- this.list = list;
|
|
|
|
- this.total = res.data.total;
|
|
|
|
- } else {
|
|
|
|
- this.$message({
|
|
|
|
- message: res.msg,
|
|
|
|
- type: 'error'
|
|
|
|
- });
|
|
|
|
- }
|
|
|
|
- }, error => {
|
|
|
|
- this.listLoading = false;
|
|
|
|
- this.$message({
|
|
|
|
- message: error,
|
|
|
|
- type: 'error'
|
|
|
|
- });
|
|
|
|
- })
|
|
|
|
- },
|
|
|
|
|
|
+ addFormVisible: false,
|
|
|
|
+ addLoading: false
|
|
|
|
+ };
|
|
|
|
+ },
|
|
|
|
+ methods: {
|
|
|
|
+ //分页
|
|
|
|
+ handleCurrentChange(val) {
|
|
|
|
+ this.page = val;
|
|
|
|
+ this.getList();
|
|
|
|
+ },
|
|
|
|
|
|
- //显示新增界面
|
|
|
|
- handleAdd() {
|
|
|
|
- this.getUnusual();
|
|
|
|
- this.addFormVisible = true;
|
|
|
|
- },
|
|
|
|
-
|
|
|
|
- // 获取异常列表
|
|
|
|
- getUnusual() {
|
|
|
|
- this.listLoading = true;
|
|
|
|
- this.http.post(this.port.project.projectList, {
|
|
|
|
- keyName: '',
|
|
|
|
- pageNum: this.page,
|
|
|
|
- pageSize: this.size,
|
|
|
|
- }, res => {
|
|
|
|
- this.listLoading = false;
|
|
|
|
- if (res.code == "ok") {
|
|
|
|
- var list = res.data.list;
|
|
|
|
- for(var i in list){
|
|
|
|
- var customCompaniesStr = "";
|
|
|
|
- for(var j in list[i].customCompanies){
|
|
|
|
- if(j == list[i].customCompanies.length -1){
|
|
|
|
- customCompaniesStr += list[i].customCompanies[j].companyName;
|
|
|
|
- } else {
|
|
|
|
- customCompaniesStr += list[i].customCompanies[j].companyName + "、";
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
- list[i].customCompaniesStr = customCompaniesStr;
|
|
|
|
- }
|
|
|
|
- this.list = list;
|
|
|
|
- this.total = res.data.total;
|
|
|
|
- } else {
|
|
|
|
- this.$message({
|
|
|
|
- message: res.msg,
|
|
|
|
- type: 'error'
|
|
|
|
- });
|
|
|
|
- }
|
|
|
|
- }, error => {
|
|
|
|
- this.listLoading = false;
|
|
|
|
- this.$message({
|
|
|
|
- message: error,
|
|
|
|
- type: 'error'
|
|
|
|
- });
|
|
|
|
- })
|
|
|
|
- },
|
|
|
|
|
|
+ handleSizeChange(val) {
|
|
|
|
+ this.size = val;
|
|
|
|
+ this.getList();
|
|
|
|
+ },
|
|
|
|
|
|
|
|
+ //获取项目列表
|
|
|
|
+ getList() {
|
|
|
|
+ this.listLoading = true;
|
|
|
|
+ this.http.post(
|
|
|
|
+ this.port.project.projectList,
|
|
|
|
+ {
|
|
|
|
+ keyName: "",
|
|
|
|
+ pageNum: this.page,
|
|
|
|
+ pageSize: this.size
|
|
},
|
|
},
|
|
- created() {
|
|
|
|
- let height = window.innerHeight;
|
|
|
|
- this.tableHeight = height - 195;
|
|
|
|
- const that = this;
|
|
|
|
- window.onresize = function temp() {
|
|
|
|
- that.tableHeight = window.innerHeight - 195;
|
|
|
|
- };
|
|
|
|
|
|
+ res => {
|
|
|
|
+ this.listLoading = false;
|
|
|
|
+ if (res.code == "ok") {
|
|
|
|
+ var list = res.data.list;
|
|
|
|
+ for (var i in list) {
|
|
|
|
+ var customCompaniesStr = "";
|
|
|
|
+ for (var j in list[i].customCompanies) {
|
|
|
|
+ if (j == list[i].customCompanies.length - 1) {
|
|
|
|
+ customCompaniesStr += list[i].customCompanies[j].companyName;
|
|
|
|
+ } else {
|
|
|
|
+ customCompaniesStr +=
|
|
|
|
+ list[i].customCompanies[j].companyName + "、";
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ list[i].customCompaniesStr = customCompaniesStr;
|
|
|
|
+ }
|
|
|
|
+ this.list = list;
|
|
|
|
+ this.total = res.data.total;
|
|
|
|
+ } else {
|
|
|
|
+ this.$message({
|
|
|
|
+ message: res.msg,
|
|
|
|
+ type: "error"
|
|
|
|
+ });
|
|
|
|
+ }
|
|
},
|
|
},
|
|
- mounted() {
|
|
|
|
- // this.getList();
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
|
|
+ error => {
|
|
|
|
+ this.listLoading = false;
|
|
|
|
+ this.$message({
|
|
|
|
+ message: error,
|
|
|
|
+ type: "error"
|
|
|
|
+ });
|
|
|
|
+ }
|
|
|
|
+ );
|
|
|
|
+ },
|
|
|
|
+
|
|
|
|
+ //显示新增界面
|
|
|
|
+ handleAdd() {
|
|
|
|
+ this.getUnusual();
|
|
|
|
+ this.addFormVisible = true;
|
|
|
|
+ },
|
|
|
|
|
|
|
|
+ // 获取异常列表
|
|
|
|
+ getUnusual() {
|
|
|
|
+ this.listLoading = true;
|
|
|
|
+ this.http.post(
|
|
|
|
+ this.port.project.projectList,
|
|
|
|
+ {
|
|
|
|
+ keyName: "",
|
|
|
|
+ pageNum: this.page,
|
|
|
|
+ pageSize: this.size
|
|
|
|
+ },
|
|
|
|
+ res => {
|
|
|
|
+ this.listLoading = false;
|
|
|
|
+ if (res.code == "ok") {
|
|
|
|
+ var list = res.data.list;
|
|
|
|
+ for (var i in list) {
|
|
|
|
+ var customCompaniesStr = "";
|
|
|
|
+ for (var j in list[i].customCompanies) {
|
|
|
|
+ if (j == list[i].customCompanies.length - 1) {
|
|
|
|
+ customCompaniesStr += list[i].customCompanies[j].companyName;
|
|
|
|
+ } else {
|
|
|
|
+ customCompaniesStr +=
|
|
|
|
+ list[i].customCompanies[j].companyName + "、";
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ list[i].customCompaniesStr = customCompaniesStr;
|
|
|
|
+ }
|
|
|
|
+ this.list = list;
|
|
|
|
+ this.total = res.data.total;
|
|
|
|
+ } else {
|
|
|
|
+ this.$message({
|
|
|
|
+ message: res.msg,
|
|
|
|
+ type: "error"
|
|
|
|
+ });
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ error => {
|
|
|
|
+ this.listLoading = false;
|
|
|
|
+ this.$message({
|
|
|
|
+ message: error,
|
|
|
|
+ type: "error"
|
|
|
|
+ });
|
|
|
|
+ }
|
|
|
|
+ );
|
|
|
|
+ },
|
|
|
|
+ //测试用的 没事就删掉吧
|
|
|
|
+ getTest() {
|
|
|
|
+ this.listLoading = true;
|
|
|
|
+ this.http.post(
|
|
|
|
+ this.port.test.test1,
|
|
|
|
+ {
|
|
|
|
+ startDate: "2020-01-01",
|
|
|
|
+ endDate: "2020-01-15"
|
|
|
|
+ },
|
|
|
|
+ res => {
|
|
|
|
+ this.listLoading = false;
|
|
|
|
+ if (res.code == "ok") {
|
|
|
|
+ } else {
|
|
|
|
+ this.$message({
|
|
|
|
+ message: res.msg,
|
|
|
|
+ type: "error"
|
|
|
|
+ });
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ error => {
|
|
|
|
+ this.listLoading = false;
|
|
|
|
+ this.$message({
|
|
|
|
+ message: error,
|
|
|
|
+ type: "error"
|
|
|
|
+ });
|
|
|
|
+ }
|
|
|
|
+ );
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ created() {
|
|
|
|
+ let height = window.innerHeight;
|
|
|
|
+ this.tableHeight = height - 195;
|
|
|
|
+ const that = this;
|
|
|
|
+ window.onresize = function temp() {
|
|
|
|
+ that.tableHeight = window.innerHeight - 195;
|
|
|
|
+ };
|
|
|
|
+ },
|
|
|
|
+ mounted() {
|
|
|
|
+ this.getTest();
|
|
|
|
+ }
|
|
|
|
+};
|
|
</script>
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
<style lang="scss" scoped>
|
|
-
|
|
|
|
</style>
|
|
</style>
|