<template>
<div class="app-container">
<el-row :gutter="20">
<!--部门数据-->
<el-col :span="4" :xs="24">
<div class="head-container">
<!-- 使用searchDeptName作为搜索变量，避免与选中部门名称冲突 -->
<el-input v-model="searchDeptName" placeholder="请输入部门名称" clearable size="small" prefix-icon="el-icon-search" style="margin-bottom: 20px"/>
</div>
<div class="head-container">
<el-tree :data="deptOptions" :props="defaultProps" :expand-on-click-node="false" :filter-node-method="filterNode"
ref="tree" default-expand-all highlight-current @node-click="handleNodeClick" node-key="id"/>
</div>
</el-col>
<!--考勤配置信息-->
<el-col :span="20" :xs="24">
<el-row class="mb8">
<el-alert title="考勤规则优先用自己单位设置的规则，如自己组织没有设置，则使用父级最近的组织所设置的规则。" type="success" :closable="false" style="padding: 20px"></el-alert>
</el-row>
<TableCard>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button type="danger" plain icon="el-icon-delete" size="mini" @click="handleDelete(form.id)" v-hasPermi="['hrm:workAttendancesConfig:remove']" v-if="form.ifExtends=='N'">
删除配置
</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="submitForm" v-hasPermi="['hrm:workAttendancesConfig:add']">
保存
</el-button>
</el-col>
</el-row>
<el-form ref="form" :model="form" :rules="rules" label-width="120px">
<el-row>
<el-col :xs="8" :sm="8" :md="8" :lg="8" :xl="8">
<el-form-item label="部门名称" prop="deptName">
<el-input v-model="form.deptName" placeholder="请点击左侧结构树" disabled/>
</el-form-item>
</el-col>
<el-col :xs="8" :sm="8" :md="8" :lg="8" :xl="8">
<el-form-item label="是否考核" prop="ifExamine">
<el-select v-model="form.ifExamine" placeholder="请选择是否考核">
<el-option v-for="dict in dict.type.sys_yes_no" :key="dict.value" :label="dict.label" :value="dict.value"></el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :xs="8" :sm="8" :md="8" :lg="8" :xl="8">
<el-form-item label="上班打卡时间" prop="startWorkTime">
<el-time-picker
placeholder="请选择上班打卡时间"
clearable
:picker-options="{format:'HH:mm'}"
value-format = "HH:mm"
v-model="form.startWorkTime">
</el-time-picker>
</el-form-item>
</el-col>
<el-col :xs="8" :sm="8" :md="8" :lg="8" :xl="8">
<el-form-item label="下班打卡时间" prop="finishWorkTime">
<el-time-picker
placeholder="请选择下班打卡时间"
clearable
:picker-options="{format:'HH:mm'}"
value-format = "HH:mm"
v-model="form.finishWorkTime">
</el-time-picker>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :xs="8" :sm="8" :md="8" :lg="8" :xl="8" v-if="form.ifExamine=='Y'">
<el-form-item label="允许迟到天数/月" prop="minLateDays">
<el-input v-model="form.minLateDays" placeholder="请输入每月允许迟到天数"/>
</el-form-item>
</el-col>
<el-col :xs="8" :sm="8" :md="8" :lg="8" :xl="8" v-if="form.ifExamine=='Y'">
<el-form-item label="允许早退天/月" prop="minLeaveEarlyDays">
<el-input v-model="form.minLeaveEarlyDays" placeholder="请输入每月允许早退天数"/>
</el-form-item>
</el-col>
<el-col :xs="8" :sm="8" :md="8" :lg="8" :xl="8" v-if="form.ifExamine=='Y'">
<el-form-item label="允许缺卡次数/月" prop="minLackTimes">
<el-input v-model="form.minLackTimes" placeholder="请输入每月允许缺卡次数"/>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :xs="8" :sm="8" :md="8" :lg="8" :xl="8" v-if="form.ifExamine=='Y'">
<el-form-item label="迟到罚款金额/天" prop="lateFine">
<el-input v-model="form.lateFine" placeholder="请输入迟到罚款金额/天"/>
</el-form-item>
</el-col>
<el-col :xs="8" :sm="8" :md="8" :lg="8" :xl="8" v-if="form.ifExamine=='Y'">
<el-form-item label="早退罚款金额/天" prop="leaveEarlyFine">
<el-input v-model="form.leaveEarlyFine" placeholder="请输入早退罚款金额/天"/>
</el-form-item>
</el-col>
<el-col :xs="8" :sm="8" :md="8" :lg="8" :xl="8" v-if="form.ifExamine=='Y'">
<el-form-item label="缺卡罚款金额/次" prop="lackFine">
<el-input v-model="form.lackFine" placeholder="请输入每月允许迟到天数/次"/>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-form-item label="备注" prop="remark">
<el-input v-model="form.remark" type="textarea" :rows="5" placeholder="请输入内容"/>
</el-form-item>
</el-row>
<!-- 打卡地点表格 -->
<el-row class="mb8">
<el-col :span="1.5">
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAddLocation">
添加打卡地
</el-button>
</el-col>
</el-row>
<!-- 打卡地点表格 -->
<el-table :data="locationList" style="width: 100%">
<el-table-column type="index" label="序号" width="60" align="center"/>
<el-table-column prop="location" label="打卡地点" align="center"/>
<el-table-column prop="coordinateX" label="经度" align="center"/>
<el-table-column prop="coordinateY" label="纬度" align="center"/>
<el-table-column prop="radius" label="打卡半径" align="center"/>
<el-table-column label="操作" align="center" width="150">
<template slot-scope="scope">
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleEditLocation(scope.row)">修改</el-button>
<el-button size="mini" type="text" icon="el-icon-delete" @click="handleDeleteLocation(scope.row)">删除</el-button>
</template>
</el-table-column>
</el-table>
</el-form>
</TableCard>
</el-col>
</el-row>
<!-- 添加打卡地对话框 -->
<el-dialog :title="locationDialogTitle" :visible.sync="locationDialogOpen" width="900px" append-to-body>
<el-form ref="locationForm" :model="locationForm" :rules="locationRules" label-width="100px">
<el-row>
<el-col :span="24">
<el-form-item label="打卡地点" prop="location">
<el-input v-model="locationForm.location" placeholder="请输入打卡地点名称"/>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item label="打卡半径" prop="radius">
<el-input v-model="locationForm.radius" placeholder="请输入打卡半径" @input="handleRadiusChange"/>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item label="经 度" prop="coordinateX">
<el-input v-model="locationForm.coordinateX" placeholder="请点击地图选择" disabled/>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item label="纬 度" prop="coordinateY">
<el-input v-model="locationForm.coordinateY" placeholder="请点击地图选择" disabled/>
</el-form-item>
</el-col>
</el-row>
<!-- 表单中的地图组件 -->
<el-form-item label="地图选点">
<div class="mapRow">
<div id="locationMapContainer" style="width: 100%; height: 400px;"></div>
<!-- 搜索输入条 -->
<el-row class="seachAddress">
<el-input id="locationTipInput" v-model="locationMapAddress" placeholder="请输入地址进行搜索" @input="searchLocationKeyWord"/>
</el-row>
<!-- 搜索结果 -->
<div class="map_search_result" v-show="showLocationSearchResult">
<div class="row" @click="markerLocationResult(item)" v-for="(item,index) in locationPoiList" :key="index">{{item.name}}</div>
</div>
</div>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitLocationForm">保存</el-button>
<el-button @click="cancelLocationForm">关闭</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import {
addWorkAttendancesConfig,
delWorkAttendancesConfig,
selectHrmWorkAttendancesConfigByDeptId,
updateWorkAttendancesConfig,
listWorkAttendancesConfig
} from "@/api/hrm/workAttendancesConfig";
import {treeselect} from "@/api/system/dept";
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
import AMapLoader from '@amap/amap-jsapi-loader';
window._AMapSecurityConfig = {
securityJsCode: '7a2fbce5a795a9a2f9215c3c2ddb4d1b',//你的秘钥
}
export default {
name: "WorkAttendancesConfig",
dicts: ['sys_yes_no'],
data() {
return {
// 修改：将写死的数据改为空数组，从接口获取
locationList: [],
locationDialogOpen: false,
locationDialogTitle: "",
locationForm: {
id: null,
location: "",
radius: "300",
coordinateX: "", // 修改：改为coordinateX
coordinateY: "" // 修改：改为coordinateY
},
locationRules: {
location: [
{ required: true, message: "打卡地点不能为空", trigger: "blur" }
],
radius: [
{ required: true, message: "打卡半径不能为空", trigger: "blur" }
],
coordinateX: [ // 修改：改为coordinateX
{ required: true, message: "请选择经度", trigger: "blur" }
],
coordinateY: [ // 修改：改为coordinateY
{ required: true, message: "请选择纬度", trigger: "blur" }
]
},
// 地点选择地图相关数据
locationMap: null,
locationMapAddress: "",
locationPoiList: [],
showLocationSearchResult: false,
locationGeocoder: null,
locationPlaceSearchComponent: null,
locationAutoCompleteComponent: null,
// 地图覆盖物
locationMarker: null,
locationCircle: null,
// 地图初始化状态标志
isLocationMapReady: false,
deptId:"",
deptName: "",
// 添加搜索专用变量，避免与选中的部门名称冲突
searchDeptName: "",
attendanceType: "",
deptOptions: [],
defaultProps: {
children: "children",
label: "label"
},
form: {
radius:300
},
rules: {
attendanceType: [
{required: true, message: "考勤类型不能为空", trigger: "blur"}
],
coordinateX: [
{required: true, message: "经度不能为空", trigger: "blur"}
],
coordinateY: [
{required: true, message: "纬度不能为空", trigger: "blur"}
],
location: [
{required: true, message: "打卡地点不能为空", trigger: "blur"}
],
radius:[
{required: true, message: "打卡半径不能为空", trigger: "blur"}
],
ifExamine:[
{required: true, message: "是否需要考核不能为空", trigger: "blur"}
],
finishWorkTime:[
{required: true, message: "下班打卡时间不能为空", trigger: "blur"}
],
startWorkTime:[
{required: true, message: "上班打卡时间不能为空", trigger: "blur"}
]
}
};
},
created() {
this.getTreeselect();
},
mounted() {
// 组件挂载后，当部门树数据加载完成，自动选中第一个部门节点
this.$nextTick(() => {
setTimeout(() => {
if (this.deptOptions && this.deptOptions.length > 0) {
const firstNode = this.deptOptions[0];
// 如果树组件已经渲染完成，直接调用点击事件处理函数
if (this.$refs.tree) {
this.handleNodeClick(firstNode);
// 高亮显示选中的节点
this.$refs.tree.setCurrentKey(firstNode.id);
}
}
}, 500);
});
},
// 监听搜索框变化，触发部门树筛选
watch: {
searchDeptName(val) {
this.$refs.tree.filter(val);
}
},
unmounted() {
this.locationMap?.destroy();
},
methods: {
// 添加打卡地点
handleAddLocation() {
this.resetLocationForm();
this.locationDialogTitle = "添加打卡地";
this.locationDialogOpen = true;
this.$nextTick(() => {
this.initLocationMap();
});
},
// 编辑打卡地点
handleEditLocation(row) {
this.resetLocationForm();
this.locationDialogTitle = "修改打卡地";
this.locationDialogOpen = true;
// 修改：字段映射
this.locationForm = {
id: row.id,
location: row.location,
radius: row.radius,
coordinateX: row.coordinateX, // 修改：改为coordinateX
coordinateY: row.coordinateY // 修改：改为coordinateY
};
this.$nextTick(() => {
this.initLocationMap().then(() => {
if (this.locationForm.coordinateX && this.locationForm.coordinateY) {
this.showLocationMarker(this.locationForm.coordinateX, this.locationForm.coordinateY);
this.showLocationCircle(this.locationForm.coordinateX, this.locationForm.coordinateY, this.locationForm.radius);
}
});
});
},
// 删除打卡地点
handleDeleteLocation(row) {
this.$modal.confirm('是否确认删除该打卡地点？').then(() => {
// 修改：调用删除接口
delWorkAttendancesConfig(row.id).then(response => {
if (response.code === 200) {
this.$modal.msgSuccess("删除成功");
// 重新加载数据
this.loadLocationList();
} else {
this.$modal.msgError(response.msg || "删除失败");
}
}).catch(error => {
console.error("删除失败:", error);
this.$modal.msgError("删除失败");
});
});
},
// 加载打卡地点列表
loadLocationList() {
if (!this.deptId) return;
const params = {
deptId: this.deptId,
attendanceType: 1
};
listWorkAttendancesConfig(params).then(response => {
if (response.code === 200) {
// ✅ 映射字段：locationName -> location
this.locationList = (response.rows || []).map(item => ({
...item,
location: item.location || item.locationName || '未知地点' // 兜底
}));
} else {
this.$modal.msgError("获取打卡地点列表失败");
this.locationList = [];
}
}).catch(error => {
console.error("获取打卡地点列表失败:", error);
this.locationList = [];
});
},
// 初始化地图
async initLocationMap() {
return new Promise((resolve, reject) => {
if (this.locationMap) {
this.locationMap.destroy();
}
AMapLoader.load({
key: "653c4c81c212e962e26cc788725c6794",
version: "2.0",
plugins: ['AMap.PlaceSearch', 'AMap.AutoComplete', 'AMap.Geocoder', 'AMap.ToolBar', 'AMap.Scale'],
}).then((AMap) => {
this.locationMap = new AMap.Map("locationMapContainer", {
viewMode: "3D",
zoom: 12,
});
// 添加地图控件
this.locationMap.addControl(new AMap.Scale());
this.locationMap.addControl(new AMap.ToolBar());
this.locationMap.on('click', (e) => {
const lng = e.lnglat.lng;
const lat = e.lnglat.lat;
this.locationForm.coordinateX = lng; // 修改：改为coordinateX
this.locationForm.coordinateY = lat; // 修改：改为coordinateY
this.showLocationMarker(lng, lat);
this.showLocationCircle(lng, lat, this.locationForm.radius);
});
this.locationMapSearchInit(AMap);
this.isLocationMapReady = true;
resolve(this.locationMap);
}).catch((error) => {
console.error('地图初始化失败:', error);
this.$message.error('地图初始化失败，请刷新页面重试');
reject(error);
});
});
},
// 显示地点标记
showLocationMarker(lng, lat) {
if (!this.locationMap || !this.isLocationMapReady) {
console.warn('地图尚未就绪，无法添加标记');
return;
}
// 清除之前的标记
if (this.locationMarker) {
this.locationMap.remove(this.locationMarker);
}
this.locationMarker = new AMap.Marker({
position: new AMap.LngLat(lng, lat)
});
this.locationMap.add(this.locationMarker);
this.locationMap.setCenter([lng, lat]);
},
// 显示范围圆圈
showLocationCircle(lng, lat, radius) {
if (!this.locationMap || !this.isLocationMapReady) {
console.warn('地图尚未就绪，无法添加圆圈');
return;
}
// 清除之前的圆圈
if (this.locationCircle) {
this.locationMap.remove(this.locationCircle);
}
// 如果半径有效且大于0，显示圆圈
if (radius && radius > 0 && lng && lat) {
const lnglat = [lng, lat];
this.locationCircle = new AMap.Circle({
center: lnglat,
radius: parseInt(radius),
borderWeight: 3,
strokeColor: "#FF33FF",
strokeWeight: 2,
strokeOpacity: 0.8,
fillOpacity: 0.2,
strokeStyle: 'dashed',
strokeDasharray: [5, 5],
fillColor: '#1791fc',
zIndex: 50,
});
this.locationMap.add(this.locationCircle);
// 调整地图视野以包含圆圈
this.locationMap.setFitView([this.locationCircle]);
}
},
// 半径变化处理
handleRadiusChange() {
// 延迟处理，避免频繁重绘
clearTimeout(this.radiusTimer);
this.radiusTimer = setTimeout(() => {
if (this.locationForm.coordinateX && this.locationForm.coordinateY && this.locationForm.radius) {
this.showLocationCircle(
this.locationForm.coordinateX,
this.locationForm.coordinateY,
this.locationForm.radius
);
}
}, 300);
},
// 地点搜索初始化
locationMapSearchInit(AMap) {
const autoOptions = {
input: "locationTipInput",
};
this.locationAutoCompleteComponent = new AMap.Autocomplete(autoOptions);
const placeSearchOptions = {
city: "",
type: "",
pageSize: 10,
pageIndex: 1,
extensions: "base"
};
this.locationPlaceSearchComponent = new AMap.PlaceSearch(placeSearchOptions);
},
// 搜索地点关键词
searchLocationKeyWord() {
if (!this.locationMap || !this.isLocationMapReady) {
console.warn('地图尚未就绪，无法搜索');
return;
}
this.locationPlaceSearchComponent.search(this.locationMapAddress, (status, result) => {
if (status === 'complete' && result.info === "OK") {
this.showLocationSearchResult = true;
this.locationPoiList = result.poiList.pois;
} else {
this.showLocationSearchResult = true;
this.locationPoiList = [];
}
});
},
// 选择搜索结果
markerLocationResult(data) {
this.locationPoiList = [];
this.showLocationSearchResult = false;
this.locationMapAddress = data.name;
// 将选中的地址自动带入到打卡地点输入框
this.locationForm.location = data.name;
this.locationForm.coordinateX = data.location.lng; // 修改：改为coordinateX
this.locationForm.coordinateY = data.location.lat; // 修改：改为coordinateY
this.showLocationMarker(data.location.lng, data.location.lat);
this.showLocationCircle(data.location.lng, data.location.lat, this.locationForm.radius);
},
// 提交地点表单
submitLocationForm() {
this.$refs["locationForm"].validate(valid => {
if (valid) {
const locationData = {
deptId: this.deptId,
location: this.locationForm.location,
coordinateX: this.locationForm.coordinateX,
coordinateY: this.locationForm.coordinateY,
radius: parseInt(this.locationForm.radius),
attendanceType: 1
};
const apiCall = this.locationForm.id
? updateWorkAttendancesConfig({ ...locationData, id: this.locationForm.id })
: addWorkAttendancesConfig(locationData);
apiCall.then(response => {
if (response.code === 200) {
this.$modal.msgSuccess("操作成功");
this.locationDialogOpen = false;
// 无论新增还是修改成功，都直接刷新列表，确保数据与后端保持同步
this.loadLocationList();
} else {
this.$modal.msgError(response.msg || "操作失败");
}
}).catch(error => {
console.error("保存失败:", error);
this.$modal.msgError("保存失败");
});
}
});
},
// 取消地点表单
cancelLocationForm() {
this.locationDialogOpen = false;
this.locationMarker = null;
this.locationCircle = null;
this.isLocationMapReady = false;
},
// 重置地点表单
resetLocationForm() {
this.locationForm = {
id: null,
location: "",
radius: "300",
coordinateX: "", // 修改：改为coordinateX
coordinateY: "" // 修改：改为coordinateY
};
this.locationMapAddress = "";
this.locationPoiList = [];
this.showLocationSearchResult = false;
this.locationMarker = null;
this.locationCircle = null;
this.isLocationMapReady = false;
},
/** 查询部门下拉树结构 */
getTreeselect() {
treeselect().then(response => {
this.deptOptions = response.data;
});
},
// 筛选节点
filterNode(value, data) {
// 使用searchDeptName作为筛选值，而不是默认的value参数
const searchValue = this.searchDeptName;
if (!searchValue) return true;
return data.label.indexOf(searchValue) !== -1;
},
// 节点单击事件 - 修改：点击部门节点时加载数据
handleNodeClick(data) {
this.reset();
this.deptId = data.id;
this.deptName = data.label;
// 直接设置表单中的部门名称和部门ID，确保测试环境下也能正确显示和保存
this.form.deptName = data.label;
this.form.deptId = data.id;
// 加载考勤配置
const params = {
deptId: this.deptId,
attendanceType: 1
};
this.getConfigByDeptId(params);
// 加载打卡地点列表
this.loadLocationList();
},
// 表单重置
reset() {
this.form = {
id: null,
deptId: this.deptId || null,
deptName: this.deptName || null,
attendanceType: 1,
// 恢复必填字段的默认值，避免验证错误
location: null,
coordinateX: null,
coordinateY: null,
radius: null,
ifExamine: "N",
minLateDays: null,
minLeaveEarlyDays: null,
minAbsenteeismDays: null,
startWorkTime: null,
finishWorkTime: null,
absenteeismHours: null,
lateFine: null,
leaveEarlyFine: null,
absenteeismFine: null,
createBy: null,
createTime: null,
updateBy: null,
updateTime: null,
remark: null,
tenantId: null
};
this.resetForm("form");
},
/** 根据部门ID查询考勤配置 */
getConfigByDeptId(params) {
selectHrmWorkAttendancesConfigByDeptId(params).then(response => {
if (response.code === 200) {
if (!response.data) {
this.reset();
this.form.deptId = params.deptId;
this.form.attendanceType = 1;
// 恢复默认打卡地点设置，避免验证错误
this.form.location = null;
this.form.coordinateX = null;
this.form.coordinateY = null;
this.form.radius = null;
this.form.startWorkTime = null;
this.form.finishWorkTime = null;
this.form.ifExamine = "N";
// 确保设置部门名称
this.form.deptName = this.deptName;
} else {
this.form = { ...response.data }; // 其他字段正常赋值
// 保存部门ID和部门名称，确保不会被覆盖
this.form.deptId = this.deptId;
this.form.deptName = this.deptName;
// 确保关键必填字段存在默认值
if (!this.form.attendanceType) {
this.form.attendanceType = 1;
}
// 确保必填字段有值，避免验证错误
if (!this.form.location) {
this.form.location = "吉视传媒信息枢纽中心";
}
if (!this.form.coordinateX || !this.form.coordinateY) {
this.form.coordinateX = "125.3821989999999";
this.form.coordinateY = "43.815085";
}
if (!this.form.radius) {
this.form.radius = 300;
}
if (!this.form.startWorkTime) {
this.form.startWorkTime = null;
}
if (!this.form.finishWorkTime) {
this.form.finishWorkTime = null;
}
if (!this.form.ifExamine) {
this.form.ifExamine = "N";
}
// 强制使用 $set 更新 remark，确保响应式生效（Vue 2 必须这样做才能动态添加属性）
this.$set(this.form, 'remark', response.data.remark || '');
if (response.data.ifExtends === "Y") {
this.form.attendanceType = `
1（继承自：${response.data.extendsDeptName}）`;
}
}
}
}).catch(error => {
console.error("获取考勤配置失败:", error);
this.$modal.msgError("请求失败，请稍后重试");
});
},
/** 保存按钮 */
submitForm() {
if (!this.form.deptId) {
this.$modal.msgError("请选择需要配置的部门");
return;
}
if(this.form.ifExtends=="Y"){
this.$modal.confirm('该部门目前的配置为继承自父级单位，您是否想将该配置保存为该单位自身的配置？').then( ()=> {
this.form.id = null;
this.form.deptId = this.deptId;
this.doSubmit();
})
}else{
this.doSubmit();
}
},
doSubmit(){
this.$refs["form"].validate(valid => {
if (valid) {
// 处理attendanceType字段，提取数字部分并转换为整数
if (typeof this.form.attendanceType === 'string') {
// 使用正则表达式提取字符串中的数字部分
const numMatch = this.form.attendanceType.match(/\d+/);
if (numMatch && numMatch[0]) {
this.form.attendanceType = parseInt(numMatch[0], 10);
} else {
// 如果无法提取数字，默认为1
this.form.attendanceType = 1;
}
}
let apiCall;
if (this.form.id != null) {
apiCall = updateWorkAttendancesConfig(this.form);
} else {
apiCall = addWorkAttendancesConfig(this.form);
}
apiCall.then(response => {
this.$modal.msgSuccess(this.form.id != null ? "修改成功" : "新增成功");
// 保存成功后，重新加载考勤配置和打卡地点列表，确保删除按钮能立即刷新
const params = {
deptId: this.deptId,
attendanceType: 1
};
// 重新加载考勤配置
this.getConfigByDeptId(params);
// 重新加载打卡地点列表
this.loadLocationList();
}).catch(error => {
console.error("保存失败:", error);
this.$modal.msgError("保存失败，请稍后重试");
});
}
});
},
/** 删除按钮操作 - 修改为删除全部列表数据 */
handleDelete() {
if (this.locationList.length === 0) {
this.$modal.msgInfo("当前没有需要删除的配置数据");
return;
}
this.$modal.confirm('是否确认删除全部考勤配置的数据项？').then(() => {
// 创建所有删除操作的Promise数组
const deletePromises = this.locationList.map(item =>
delWorkAttendancesConfig(item.id)
);
// 并行执行所有删除操作
return Promise.all(deletePromises);
}).then(() => {
// 传递正确的参数以刷新考勤配置
const params = {
deptId: this.deptId,
attendanceType: 1
};
this.getConfigByDeptId(params);
// 同时刷新打卡地点列表
this.loadLocationList();
this.$modal.msgSuccess("全部配置数据删除成功");
}).catch(error => {
console.error("删除失败:", error);
this.$modal.msgError("删除失败，请稍后重试");
});
}
}
};
</script>
<style scoped lang="scss">
#locationMapContainer {
width: 100%;
height: 400px;
border: 1px solid #dcdfe6;
border-radius: 4px;
}
.map_search_result {
max-height: 200px;
overflow-y: auto;
}
.mapRow{
position: relative;
.seachAddress{
position: absolute;
top: 10px;
left: 10px;
width: 450px;
z-index: 999;
}
.map_search_result{
display: flex;
flex-direction: column;
border: 1px solid #dddddd;
width: 450px;
margin-top: 10px;
background-color: #FFFFFF;
position: absolute;
top: 46px;
left: 10px;
z-index: 999;
.row{
padding: 10px;
border-top: 1px solid #dddddd;
font-size: 14px;
cursor: pointer;
}
.row:hover{
background-color: #eeeeee;
}
.row:first-child{
border-top: none;
}
}
}
</style>
考勤配置信息点击保存, 不要新增添加打卡地对话框的列表数据
最新发布
@Id用于标识自增主键，并在插入后更新对象ID；@Name指示字段具有唯一性约束并支持实例检索。
扫一扫
209
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
