删除 'src/ExamineContrast copy 2.vue'

src/ExamineContrast copy 2.vue

@@ -1,546 +0,0 @@
-<template>
-    <div class="contrast-container scroll-bar" style="padding-top: 10px;">
-
-        <div class="flex-box-ce title-box" style="" v-if="selectExamineList && selectExamineList.length > 0">
-            <div class="title">已选择的考核列表:</div>
-            <el-button size="mini" @click="dialogVisible = true">查看更多</el-button>
-        </div>
-
-
-        <div v-if="selectExamineList && selectExamineList.length > 0" class="template-list"
-            style="background: #f7f7f7; padding: 10px 10px 0 0; margin: 0 20px; border-radius: 4px;">
-            <template size="small" v-for="(item, index) in selectExamineList">
-                <el-tag :key="item.reviewPackageId" style="margin: 0 0 10px 10px;" closable
-                    @close="handleTagDelete(index)">
-                    {{ item.title }}
-                </el-tag>
-            </template>
-        </div>
-
-        <div v-else class="flex-box-ce" style="padding: 0 20px;">
-            <el-button size="mini" @click="dialogVisible = true" style="margin-left: auto;">查看更多</el-button>
-        </div>
-
-        <el-tabs v-model="activeName" @tab-click="handleClick"
-            style="width: 100%; padding: 0 20px; box-sizing: border-box;">
-            <el-tab-pane label="表格" name="0">
-                <el-table v-if="userList && userList.length > 0" ref="tableRef" custom-class="openAnimAbcd" id="mytable"
-                    :data="userList" style="width: 100%; " border stripe :header-cell-style="{ background: '#f5f7fa' }"
-                    v-loading="loading">
-                    <el-table-column prop="employeeName" label="姓名" align="center">
-                    </el-table-column>
-                    <el-table-column :label="item.title" v-for="(item, index) in selectExamineList"
-                        :key="item.reviewPackageId" align="center">
-                        <template slot-scope="scope">
-                            <div v-for="user in item.users">
-                                <span v-if="user.employeeId == scope.row.employeeId">{{ user.score }}</span>
-                            </div>
-                        </template>
-                    </el-table-column>
-                </el-table>
-            </el-tab-pane>
-            <el-tab-pane label="地图" name="1" style="width: 100%;">
-                <div v-if="treeData && JSON.stringify(treeData) !== '{}'" class="flex-box-ce scroll-bar"
-                    style="width: 100%; justify-content: center; overflow-x: auto;">
-                    <vue2-org-tree :data="treeData" style="width: 100%;" />
-                </div>
-            </el-tab-pane>
-        </el-tabs>
-
-        <el-dialog title="请选择需要对比的考核列表" center :visible.sync="dialogVisible" width="600px"
-            :before-close="dialogBeforeClose">
-            <div>
-                <div class="search-box">
-                    <el-select v-model="cycleType" placeholder="请选择周期类型" @change="changeCircle" style="width: 100px;"
-                        size="mini">
-                        <el-option v-for="item in cycleOptions" :key="item.value" :label="item.label"
-                            :value="item.value">
-                        </el-option>
-                    </el-select>
-
-                    <el-date-picker v-model="date" type="daterange" align="right" unlink-panels range-separator="至"
-                        start-placeholder="开始日期" end-placeholder="结束日期" value-format="yyyy-MM-dd"
-                        :picker-options="pickerOptions" @change="changeDate" style="width: 300px; margin: 0 10px;"
-                        size="mini">
-                    </el-date-picker>
-
-                    <el-select v-model="status" placeholder="请选择" style="width: 100px;" @change="changeStatus"
-                        size="mini">
-                        <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
-                        </el-option>
-                    </el-select>
-
-                    <el-button plain round size="mini" style="margin-left: 10px;" @click="reset">重 置</el-button>
-                </div>
-                <div class="package-list">
-                    <div class="template-list scroll-bar">
-                        <template v-if="examineList && examineList.length > 0">
-                            <el-checkbox :indeterminate="isIndeterminate" v-model="checkAll"
-                                @change="handleCheckAllChange" style="margin-bottom: 10px;">全选</el-checkbox>
-                            <el-checkbox-group v-model="selectExamineIds" size="small" @change="changeSelectExamineIds">
-                                <template v-for="item in examineList">
-                                    <el-checkbox :key="item.reviewPackageId" :label="item.reviewPackageId" border>
-                                        {{ item.title }}
-                                    </el-checkbox>
-                                </template>
-                            </el-checkbox-group>
-                        </template>
-                        <template v-else>
-                            <div class="flex-box-ce" style="justify-content: center;">
-                                <noData content="暂无数据" imgW="120px" imgH="80px"></noData>
-                            </div>
-                        </template>
-                    </div>
-                    <div class="choose-template scroll-bar">
-                        <el-button plain round size="mini" @click="clear">清 空</el-button>
-                        <div class="line"></div>
-                        <template v-for="(item, index) in chooseExamineList">
-                            <div class="flex-box-ce choose-template-item" style="justify-content: space-between;">
-                                <div>{{ item.title }}</div>
-                                <i class="el-icon-close" @click="deleteItem(index)"></i>
-                            </div>
-                        </template>
-                        <div ref="placeholder" style="height: 50px;"></div>
-                    </div>
-                </div>
-
-            </div>
-            <div slot="footer">
-                <el-button @click="dialogVisible = false">取 消</el-button>
-                <el-button type="primary" @click="confirm">确 定</el-button>
-            </div>
-        </el-dialog>
-
-        <div style="height: 50px;"></div>
-    </div>
-</template>
-
-<script>
-import { mapGetters } from 'vuex';
-import moment from 'moment';
-
-export default {
-    data() {
-        return {
-            checkAll: false,
-            isIndeterminate: true,
-            dialogVisible: false,
-            activeName: "0",
-            loading: false,
-            treeData: {},
-            // 周期类型 0-未定义 1-年度 2-半年度 3-季度 4-月度
-            cycleType: '-1',
-            cycleOptions: [
-                { label: "全部", value: '-1' },
-                { label: "未定义", value: '0' },
-                { label: "年度", value: '1' },
-                { label: "半年度", value: '2' },
-                { label: "季度", value: '3' },
-                { label: "月度", value: '4' },
-            ],
-            status: -1,
-            options: [{
-                value: -1,
-                label: '全部'
-            }, {
-                value: '0',
-                label: '未完成'
-            }, {
-                value: '1',
-                label: '已完成'
-            }],
-            params: {
-                startDate: '',
-                endDate: '',
-                status: -1, // 不传默认返回全部 0-未完成 1-已完成
-            },
-
-            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]);
-                    }
-                }]
-            },
-            date: [],
-            examineList: [], // 考核表列表
-            tableHeader: [],
-            tableData: [],
-            userList: [],
-            selectExamineIds: [],
-            selectExamineList: [],
-            chooseExamineList: []
-        }
-    },
-    // watch: {
-    //     chooseExamineList(v) {
-    //         this.selectExamineList = this.chooseExamineList
-    //     }
-    // },
-    filters: {
-        formatDate(val) {
-            if (val) return moment(val).format('YYYY-MM-DD')
-            else return "--"
-        }
-    },
-    computed: {
-        ...mapGetters(['user_info']),
-        // selectExamineList() {
-        //     return this.examineList.filter(item => this.selectExamineIds.includes(item.reviewPackageId))
-        // }
-    },
-    created() {
-        this.getRecords();
-        this.dialogVisible = true;
-    },
-    methods: {
-        deleteItem(index) {
-            let chooseIndex = this.selectExamineIds.findIndex(select => select == this.chooseExamineList[index].reviewPackageId)
-            this.selectExamineIds.splice(chooseIndex, 1)
-            this.chooseExamineList.splice(index, 1)
-        },
-
-        changeSelectExamineIds(v) {
-            console.log(this.selectExamineIds)
-            if (v && v.length > 0) {
-                this.examineList.forEach(examine => {
-                    this.selectExamineIds.forEach(val => {
-                        if (val == examine.reviewPackageId) this.chooseExamineList.push(examine)
-                    })
-                })
-                this.chooseExamineList = Array.from(new Set(this.chooseExamineList.map(JSON.stringify))).map(JSON.parse);
-            } else {
-                // this.selectExamineIds = []
-            }
-            
-        },
-        handleCheckAllChange(v) {
-
-            if (v) {
-                this.examineList.forEach(examine => {
-                    this.selectExamineIds.push(examine.reviewPackageId)
-                })
-                this.examineList.forEach(examine => {
-                    this.selectExamineIds.forEach(val => {
-                        if (val == examine.reviewPackageId) this.chooseExamineList.push(examine)
-                    })
-                })
-                this.isIndeterminate = true;
-                this.checkAll = true;
-                this.$nextTick(() => {
-                    if (this.$refs.placeholder) this.$refs.placeholder.scrollIntoView(false);
-                })
-            } else {
-                this.selectExamineIds = [];
-                this.isIndeterminate = false;
-                this.checkAll = false;
-                if (this.examineList && this.examineList.length > 0) {
-                    let examineIds = this.examineList.map(item => item.reviewPackageId)
-                    this.chooseExamineList = this.chooseExamineList.filter(choose => !examineIds.includes(choose.reviewPackageId))
-                }
-
-            }
-        },
-
-        chooseExamine(item) {
-            if (this.selectExamineIds.includes(item.reviewPackageId)) {
-                let index = this.selectExamineIds.findIndex(item => item.reviewPackageId);
-                this.selectExamineIds.splice(index, 1)
-            } else {
-                this.selectExamineIds.push(item.reviewPackageId);
-            }
-            if (this.selectExamineIds.length === this.examineList.length) {
-                this.isIndeterminate = true;
-                this.checkAll = true;
-            } else {
-                this.isIndeterminate = false;
-                this.checkAll = false;
-            }
-            if (this.activeName == '0') this.initTableData()
-            if (this.activeName == '1') this.initTreeData()
-        },
-
-        handleTagDelete(index) {
-            // 最后一个不能删除
-            if (this.selectExamineList && this.selectExamineList.length > 1)
-                this.selectExamineList.splice(index, 1)
-        },
-        getRecords() {
-            this.loading = true;
-
-            if (this.status === '-1') this.params.status = '' // 不传默认返回全部
-            else this.params.status = this.status
-            if (this.cycleType == '-1') this.params = { ...this.params }
-            else {
-                this.params = { ...this.params, cycleType: this.cycleType }
-            }
-            this.$axiosUser("get", `/performance/statistics/packages/${this.user_info.site_id}`, this.params).then(res => {
-                this.loading = false;
-                let { data: { data: { list, total }, code } } = res;
-                this.examineList = list;
-                if (this.examineList && this.examineList.length > 0) {
-                    this.examineList.map(item => {
-                        this.chooseExamineList.forEach(choose => {
-                            if (item.reviewPackageId == choose.reviewPackageId)
-                                this.selectExamineIds.push(item.reviewPackageId)
-                        })
-                    })
-                }
-
-                this.treeData = {
-                    id: 0,
-                    label: "考核对比",
-                    children: []
-                }
-                // this.selectExamineIds = [];
-            })
-        },
-        initTableData() {
-            let userList = [];
-            let selectExamineList = [];
-
-            this.examineList && this.examineList.forEach(item => {
-                this.selectExamineIds.forEach(selectExamineId => {
-                    if (item.reviewPackageId == selectExamineId) {
-                        selectExamineList.push(item)
-                    }
-                })
-
-            })
-
-            selectExamineList.forEach(item => {
-                let { reviewPackageId, title, users } = item;
-                if (users && users.length > 0) {
-                    users.forEach(user => {
-                        let { employeeName, employeeId } = user
-                        userList.push({ employeeName, employeeId })
-                    })
-                }
-            })
-            this.userList = userList.reduce((acc, obj) => {
-                // 检查当前对象是否已经存在于结果数组中
-                if (!acc.find(item => item.employeeId === obj.employeeId)) { // 假设我们通过id来判断唯一性
-                    acc.push(obj);
-                }
-                return acc;
-            }, []);
-
-        },
-        initTreeData() {
-            this.selectExamineList.forEach(item => {
-                item.id = Date.now() + Math.floor(Math.random() * 10000);
-                item.label = item.title;
-                item.children = item.users;
-                item.users.forEach(user => {
-                    user.id = Date.now() + Math.floor(Math.random() * 10000);
-                    user.label = user.employeeName + ", " + (user.score ? user.score : 0);
-                })
-            })
-            this.treeData = {
-                id: 0,
-                label: "考核对比",
-                children: this.selectExamineList
-            }
-        },
-        handleClick(tab, event) {
-            if (this.activeName == '0') this.initTableData()
-            if (this.activeName == '1') this.initTreeData()
-        },
-        // 日期选择时间
-        changeDate(v) {
-            if (v && v.length > 0) {
-                this.params.startDate = v[0] || ''
-                this.params.endDate = v[1] || ''
-                this.getRecords();
-            }
-
-        },
-        //选择周期
-        changeCircle(v) {
-            this.getRecords();
-        },
-        // 选择状态
-        changeStatus(v) {
-            this.getRecords();
-        },
-        // 重置搜索条件
-        reset() {
-            this.cycleType = '-1'
-            this.status = -1
-            this.date = []
-            this.params = {
-                startDate: '',
-                endDate: '',
-                status: -1, // 不传默认返回全部 0-未完成 1-已完成
-            }
-            this.getRecords();
-        },
-
-        // 清空选择的考核列表
-        clear() {
-            this.selectExamineIds = [];
-            this.chooseExamineList = [];
-        },
-        dialogBeforeClose() {
-            this.dialogVisible = false;
-        },
-        confirm() {
-            this.selectExamineList = this.chooseExamineList;
-            if (this.activeName == '0') this.initTableData()
-            if (this.activeName == '1') this.initTreeData()
-            this.dialogVisible = false;
-        }
-    },
-
-}
-
-</script>
-
-
-
-<style scoped="scoped" lang="scss">
-.contrast-container {
-    width: 100%;
-    height: 100%;
-    background-color: #fff;
-
-    .el-icon-close {
-        transition: all 0.2s;
-
-        &:hover {
-            font-size: 16px;
-        }
-    }
-
-    .search-box {
-        display: flex;
-        align-items: center;
-        justify-content: space-between;
-        box-sizing: border-box;
-    }
-
-    .title-box {
-        display: flex;
-        align-items: center;
-        justify-content: space-between;
-        margin-bottom: 10px;
-        padding: 0 20px;
-
-        .title {
-            color: #999;
-            font-size: 14px;
-            font-weight: bold;
-        }
-    }
-
-    .package-list {
-        width: 100%;
-        height: 400px;
-        display: flex;
-        margin-top: 10px;
-        border: 1px solid #f7f7f7;
-
-        .template-list {
-            width: 50%;
-            height: 400px;
-            overflow-y: auto;
-            display: flex;
-            flex-direction: column;
-            border-right: 1px solid #f7f7f7;
-            padding: 10px;
-            box-sizing: border-box;
-
-            .el-checkbox-group {
-                width: 100% !important;
-                height: 100% !important;
-
-                .el-checkbox {
-                    margin: 0;
-                    width: 200px;
-                    margin-bottom: 10px;
-                }
-
-            }
-        }
-
-        .choose-template {
-            width: 50%;
-            height: 400px;
-            overflow-y: auto;
-            padding: 10px;
-            box-sizing: border-box;
-
-            .line {
-                width: 90%;
-                height: 1px;
-                background-color: #f7f7f7;
-                margin: 10px auto;
-            }
-
-            &-item {
-                width: 90%;
-                height: 30px;
-                line-height: 30px;
-                padding-left: 10px;
-                border-bottom: 1px solid #f7f7f7;
-                margin: 0 auto 10px auto;
-                box-sizing: border-box;
-            }
-        }
-    }
-
-
-    .table-box {
-        width: 100%;
-        padding: 0 20px;
-        box-sizing: border-box;
-    }
-
-    /* 设置滚动条的宽度和背景色 */
-    ::v-deep .el-table__body-wrapper::-webkit-scrollbar {
-        width: 10px;
-        height: 10px;
-        background-color: #f9f9f9;
-    }
-
-    /* 设置滚动条滑块的样式 */
-    ::v-deep .el-table__body-wrapper::-webkit-scrollbar-thumb {
-        border-radius: 6px;
-        background-color: #c1c1c1;
-    }
-
-    /* 设置滚动条滑块hover样式 */
-    ::v-deep .el-table__body-wrapper::-webkit-scrollbar-thumb:hover {
-        background-color: #a8a8a8;
-    }
-
-    /* 设置滚动条轨道的样式 */
-    ::v-deep .el-table__body-wrapper::-webkit-scrollbar-track {
-        box-shadow: inset 0 0 5px rgba(87, 175, 187, 0.1);
-        border-radius: 6px;
-        background: #ededed;
-    }
-
-
-}
-</style>