|
|
@@ -0,0 +1,270 @@
|
|
|
+<template>
|
|
|
+ <div class="tabs-container">
|
|
|
+
|
|
|
+ <el-row :gutter="20">
|
|
|
+ <!--部门数据-->
|
|
|
+ <el-col :span="4" :xs="24">
|
|
|
+ <div class="head-container">
|
|
|
+ <el-input
|
|
|
+ v-model="deptName"
|
|
|
+ placeholder="请输入部门名称"
|
|
|
+ clearable
|
|
|
+ size="small"
|
|
|
+ prefix-icon="el-icon-search"
|
|
|
+ style="margin-bottom: 20px"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ <div class="tree-container">
|
|
|
+ <div style="margin-bottom: 10px;">
|
|
|
+ <el-checkbox v-model="queryParams.checkSub" @change="changeCheckBox">是否关联下级机构</el-checkbox>
|
|
|
+ </div>
|
|
|
+ <el-tree
|
|
|
+ :data="deptOptions"
|
|
|
+ :props="defaultProps"
|
|
|
+ :expand-on-click-node="false"
|
|
|
+ :filter-node-method="filterNode"
|
|
|
+ ref="tree"
|
|
|
+ node-key="id"
|
|
|
+ :default-expanded-keys="defaultKeys"
|
|
|
+ :default-checked-keys="defaultKeys"
|
|
|
+ @node-click="handleNodeClick"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ <!--用户数据-->
|
|
|
+ <el-col :span="20" :xs="24">
|
|
|
+
|
|
|
+ <!-- 搜索条件 -->
|
|
|
+ <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
|
|
|
+ <el-form-item label="生效日期">
|
|
|
+ <el-date-picker
|
|
|
+ v-model="queryParams.range"
|
|
|
+ style="width: 240px"
|
|
|
+ value-format="yyyy-MM-dd"
|
|
|
+ type="daterange"
|
|
|
+ range-separator="-"
|
|
|
+ start-placeholder="开始日期"
|
|
|
+ end-placeholder="结束日期"
|
|
|
+ ></el-date-picker>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="仅显示当前生效" label-width="120px">
|
|
|
+ <el-switch
|
|
|
+ v-model="queryParams.value"
|
|
|
+ active-color="#13ce66"
|
|
|
+ inactive-color="#ff4949">
|
|
|
+ </el-switch>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item>
|
|
|
+ <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
|
|
|
+ <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+
|
|
|
+ <!-- 按纽 -->
|
|
|
+ <el-row :gutter="10" class="mb8">
|
|
|
+ <el-col :span="1.5">
|
|
|
+ <el-button
|
|
|
+ type="primary"
|
|
|
+ plain
|
|
|
+ icon="el-icon-plus"
|
|
|
+ size="mini"
|
|
|
+ @click="addTemplate"
|
|
|
+ v-hasPermi="['system:user:add']"
|
|
|
+ >新增作息模板</el-button>
|
|
|
+ </el-col>
|
|
|
+ <right-toolbar :showSearch.sync="showSearch" @queryTable="getList" :columns="columns"></right-toolbar>
|
|
|
+ </el-row>
|
|
|
+
|
|
|
+ <el-table v-loading="loading" style="width: auto;" size="nimi" border :data="tableList">
|
|
|
+ <el-table-column v-if="columns[0].visible" prop="orgName" label="机构"></el-table-column>
|
|
|
+ <el-table-column v-if="columns[1].visible" label="日期" >
|
|
|
+ <span slot-scope="scope">{{parseTime(scope.row.ymdDate,"YYYY-MM-DD")}}</span>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column v-if="columns[2].visible" label="营业状态">
|
|
|
+ <template slot-scope="r">{{r.row.isEnable!=true?'歇业':'营业'}}</template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column v-if="columns[3].visible" label="上下班时间段">
|
|
|
+ <template slot-scope="r">
|
|
|
+ <span>{{r.row.workTime}}-{{r.row.workOffTime}}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column v-if="columns[4].visible" label="营业时间段">
|
|
|
+ <template slot-scope="r">
|
|
|
+ <span>{{r.row.openTime}}-{{r.row.closeTime}}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column v-if="columns[5].visible" label="午休时间段">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <span>{{scope.row.noonbreakStart}}-{{scope.row.noonbreakEnd}}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column v-if="columns[6].visible" prop="modifiedName" label="更新人"></el-table-column>
|
|
|
+ <el-table-column v-if="columns[7].visible" label="更新时间" >
|
|
|
+ <span slot-scope="scope">{{parseTime(scope.row.updateTime, "YYYY-MM-DD HH:mm:ss")}}</span>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column v-if="columns[8].visible" label="操作列表" width="100" >
|
|
|
+ <template slot-scope="r">
|
|
|
+ <el-button type="text" v-hasPermi="['system:user:edit']" @click="onEditTime(r.row)">编辑</el-button>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+
|
|
|
+ <pagination
|
|
|
+ v-show="pages.total>0"
|
|
|
+ :total="pages.total"
|
|
|
+ :page.sync="pages.page"
|
|
|
+ :limit.sync="pages.size"
|
|
|
+ @pagination="getList"
|
|
|
+ />
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+
|
|
|
+
|
|
|
+ <dialog-edit ref="modalEdit" ></dialog-edit>
|
|
|
+
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import tableList from '@/mixins/tableList'
|
|
|
+import DialogEdit from './dialog.edit'
|
|
|
+import {json} from'./json'
|
|
|
+/** 引入节点树接口*/
|
|
|
+import { deptTreeSelect } from "@/api/system/user";
|
|
|
+
|
|
|
+export default {
|
|
|
+ /** 得先引入字典才能使用 */
|
|
|
+ dicts: ['sys_business_type'],
|
|
|
+ mixins:[tableList],
|
|
|
+ components: {DialogEdit},
|
|
|
+ data() {
|
|
|
+ //初始化查询日期
|
|
|
+ let timea = new Date();
|
|
|
+ timea.setHours(0, 0, 0, 0);
|
|
|
+ let timeb = new Date(timea.getTime() - 3600 * 1000 * 24 * 30);
|
|
|
+ timeb.setHours(0, 0, 0, 0);
|
|
|
+ return {
|
|
|
+ //选中的行
|
|
|
+ selectRow:null,
|
|
|
+ // 显示搜索条件
|
|
|
+ showSearch: true,
|
|
|
+ // 用户表格数据
|
|
|
+ tableList: null,
|
|
|
+ // 部门树选项
|
|
|
+ deptOptions: undefined,
|
|
|
+ // 是否显示弹出层
|
|
|
+ open: false,
|
|
|
+ // 通过机构名称查询tree
|
|
|
+ deptName: undefined,
|
|
|
+ //是否关联下级
|
|
|
+ checked: false,
|
|
|
+ //自定义机构树数据
|
|
|
+ defaultProps: {
|
|
|
+ children: "children",
|
|
|
+ label: "name"
|
|
|
+ },
|
|
|
+ // 查询参数
|
|
|
+ queryParams: {
|
|
|
+ checkSub: false,
|
|
|
+ orgId: null,
|
|
|
+ orgType: null,
|
|
|
+ range: [timeb, timea],
|
|
|
+ },
|
|
|
+ // 列信息
|
|
|
+ columns: [
|
|
|
+ { key: 0, label: `机构`, visible: true },
|
|
|
+ { key: 1, label: `日期`, visible: true },
|
|
|
+ { key: 2, label: `营业状态`, visible: true },
|
|
|
+ { key: 3, label: `上下班时间段`, visible: true },
|
|
|
+ { key: 4, label: `营业时间段`, visible: true },
|
|
|
+ { key: 5, label: `午休时间段`, visible: true },
|
|
|
+ { key: 6, label: `更新人`, visible: true },
|
|
|
+ { key: 7, label: `更新时间`, visible: true },
|
|
|
+ { key: 8, label: `操作`, visible: true }
|
|
|
+ ],
|
|
|
+ //默认选中节点
|
|
|
+ defaultKeys:[],
|
|
|
+ pickerOptions:{
|
|
|
+ start: "00:00",
|
|
|
+ end: "24:00",
|
|
|
+ step: "00:10",
|
|
|
+ },
|
|
|
+ };
|
|
|
+ },
|
|
|
+ watch: {
|
|
|
+ // 根据名称筛选部门树
|
|
|
+ deptName(val) {
|
|
|
+ this.$refs.tree.filter(val);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ this.getDeptTree();
|
|
|
+ this.getConfigKey("sys.user.initPassword").then(response => {
|
|
|
+ this.initPassword = response.msg;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ addTemplate(){
|
|
|
+
|
|
|
+ },
|
|
|
+ /** 下穿状态改变*/
|
|
|
+ changeCheckBox(){
|
|
|
+ this.getList();
|
|
|
+ },
|
|
|
+ /** 查询列表 */
|
|
|
+ getList(id) {
|
|
|
+ //this.loading = true;
|
|
|
+ console.log(this.queryParams,111);
|
|
|
+ console.log(this.addDateRange(this.queryParams, this.dateRange),2222);
|
|
|
+ this.tableList = json.content;
|
|
|
+ // tableList(this.addDateRange(this.queryParams, this.dateRange)).then(response => {
|
|
|
+ // //兼容框架userId字段
|
|
|
+ // response.rows.forEach(v=>{v.userId = v.id});
|
|
|
+ // this.userList = response.rows;
|
|
|
+ // this.total = response.total;
|
|
|
+ // this.loading = false;
|
|
|
+ // }
|
|
|
+ // ).catch(err=>{
|
|
|
+ // this.loading = false;
|
|
|
+ // })
|
|
|
+ },
|
|
|
+ /** 查询机构树 */
|
|
|
+ getDeptTree() {
|
|
|
+ deptTreeSelect().then(response => {
|
|
|
+ this.deptOptions = response.data;
|
|
|
+ console.log( this.deptOptions,' this.deptOptions')
|
|
|
+ this.defaultKeys.push(response.data[0].id);
|
|
|
+ this.queryParams.orgId = response.data[0].id;
|
|
|
+ this.handleQuery();
|
|
|
+ });
|
|
|
+ },
|
|
|
+ // 筛选节点
|
|
|
+ filterNode(value, data) {
|
|
|
+ if (!value) return true;
|
|
|
+ return data.name.indexOf(value) !== -1;
|
|
|
+ },
|
|
|
+ // 节点单击事件
|
|
|
+ handleNodeClick(data) {
|
|
|
+ this.queryParams.orgId = data.id;
|
|
|
+ this.handleQuery();
|
|
|
+ },
|
|
|
+ /** 编辑按钮操作 */
|
|
|
+ onEditTime(row) {
|
|
|
+ this.selectRow = row;
|
|
|
+ this.$refs.modalEdit.edit(row);
|
|
|
+ console.log(this.$refs.modalEdit,'modalEdit');
|
|
|
+ },
|
|
|
+
|
|
|
+ /** 提交按钮 */
|
|
|
+ submitForm: function() {
|
|
|
+
|
|
|
+ },
|
|
|
+ /** 导出按钮操作 */
|
|
|
+ handleExport() {
|
|
|
+ this.download('system/time/export', {
|
|
|
+ ...this.queryParams
|
|
|
+ }, `user_${new Date().getTime()}.xlsx`)
|
|
|
+ },
|
|
|
+ }
|
|
|
+};
|
|
|
+</script>
|