钉钉demo

src/api/test/dd/dd.js

@@ -16,18 +16,18 @@ export default {
 			params: params,
 		});
 	},
-	getWorkListCord(id) {
+	getWorkListCord(params) {
 		return request({
 			url: prefix + "/test/attendance/getWorkListCord",
 			method: "get",
-			params: { userId: id },
+			params: params,
 		});
 	},
-	getByUserId(id) {
+	getByUserId(params) {
 		return request({
 			url: prefix + "/test/attendance/getByUserId",
 			method: "get",
-			params: { userId: id },
+			params: params,
 		});
 	},
 	// 删除部门

src/views/dd/PunchCardListDia.vue

@@ -2,13 +2,29 @@
   <v-dialog
     :title="title"
     :close-on-click-modal="false"
-	width="900px"
+	width="1300px"
     v-model="visible">
+	  <el-form  :inline="true" class="query-form m-b-10"  v-if="searchVisible" ref="searchForm" :model="searchForm" @keyup.enter="refreshList()" @submit.prevent>
+		  <!-- 搜索框-->
+		  <el-form-item label="会议开始时间" prop="meetingDates">
+			  <el-date-picker
+				  style="width:50%;"
+				  v-model="searchForm.workDates"
+				  type="datetimerange"
+				  value-format="YYYY-MM-DD HH:mm:ss"
+				  placeholder="请选择日期"
+			  />
+		  </el-form-item>
+		  <el-form-item>
+			  <el-button type="primary" @click="refreshList()"  icon="search">查询</el-button>
+			  <el-button type="default" @click="resetSearch()"  icon="refresh-right">重置</el-button>
+		  </el-form-item>
+	  </el-form>
 	  <el-table :data="gridData">
-		  <el-table-column property="name" label="姓名" width="200"/>
-		  <el-table-column property="title" label="职位" width="200"/>
+		  <el-table-column property="name" label="姓名" width="150"/>
+		  <el-table-column property="title" label="职位" width="150"/>
 		  <el-table-column property="workDate" label="工作日" width="200"/>
-		  <el-table-column property="userCheckTime" label="打卡时间" width="150" />
+		  <el-table-column property="userCheckTime" label="打卡时间" width="200" />
 		  <el-table-column property="locationResult" label="考勤类型" width="200" >
 			  <template #default="scope">
 				  <span v-if="scope.row.locationResult === 'Normal'">范围内</span>
@@ -22,7 +38,7 @@
 				  <span v-else-if="scope.row.checkType === 'OffDuty'">下班</span>
 			  </template>
 		  </el-table-column>
-		  <el-table-column property="timeResult" label="打卡结果" width="200">
+		  <el-table-column property="timeResult" label="打卡结果" width="160">
 			  <template #default="scope">
 				  <span v-if="scope.row.timeResult === 'Normal'">正常</span>
 				  <span v-else-if="scope.row.timeResult === 'Early'">早退</span>
@@ -36,7 +52,7 @@
 
     <template #footer>
         <span class="dialog-footer">
-          <el-button @click="visible = false" icon="circle-close">关闭</el-button>
+          <el-button @click="close()" icon="circle-close">关闭</el-button>
         </span>
     </template>
   </v-dialog>
@@ -47,11 +63,18 @@
   export default {
     data () {
       return {
+      	userId:"",
+      	userName:"",
+      	userTitle:"",
         title: '',
         method: '',
         visible: false,
         loading: false,
-	    gridData:[]
+	    gridData:[],
+	    searchVisible: true,
+	    searchForm:{
+			workDates:[]
+	    },
       }
     },
     components: {
@@ -62,10 +85,13 @@
       init (id,name,title) {
 		  this.title = '考勤列表'
 		  this.visible = true
+		  this.userId = id
+		  this.userName = name
+		  this.userTitle = title
         this.loading = false
         this.$nextTick(() => {
 			this.loading = true
-			ddService.getWorkListCord(id).then((data) => {
+			ddService.getWorkListCord({userId:id,workDateForm:"",workDateTo:""}).then((data) => {
 				console.log('data',data)
 				this.gridData = data.recordresult
 				this.gridData.forEach((item)=>{
@@ -76,6 +102,27 @@
 			})
         })
       },
+		refreshList(){
+			this.loading = true
+			ddService.getWorkListCord({userId:this.userId,workDateFrom:this.searchForm.workDates[0],workDateTo:this.searchForm.workDates[1]}).then((data) => {
+				console.log('data',data)
+				this.gridData = data.recordresult
+				this.gridData.forEach((item)=>{
+					item.name = this.userName
+					item.title = this.userTitle
+				})
+				this.loading = false
+			})
+		},
+		resetSearch () {
+			this.$refs.searchForm.resetFields()
+			this.searchForm.workDates = [] // 重置时清空供应商筛选
+			this.refreshList()
+		},
+		close(){
+			this.visible = false
+			this.searchForm.workDates = []
+		}
     }
   }
 </script>

src/views/dd/UserList.vue

@@ -39,7 +39,8 @@
                     </vxe-column>
                     <vxe-column fixed="right" align="center" width="320" title="操作">
                         <template #default="scope">
-                            <el-button type="success" text @click="handleAdd(scope.row)">考勤</el-button>
+                            <el-button type="success" text @click="handleAdd(scope.row)">打卡</el-button>
+                            <el-button type="success" text @click="attendance(scope.row)">考勤统计</el-button>
                         </template>
                     </vxe-column>
                 </vxe-table>
@@ -143,6 +144,14 @@ export default {
             console.log('row', row)
             this.$refs.punchCardListDia.init(row.userid, row.name, row.title)
         },
+		//考勤统计
+		attendance(row){
+
+		},
+        handleClick(tab, event) {
+            console.log(tab.props.name);
+            this.getUserList(tab.props.name)
+        },
         // 关闭查看器
         closeViewer() {
             this.url = ''