panzy
2022-05-19 0f5e1534e83fa99cac09f9a3430539d115ed0b59
src/views/chartAnalysis/index.vue
对比新文件
@@ -0,0 +1,170 @@
<template>
    <div>
        <div class="whole_top">
            <el-form ref="form" :inline="true" :model="form" label-width="100px">
                <div class="top">
                    <el-form-item>
                        <el-checkbox-group v-model="checkList">
                            <el-checkbox label="复选框 A"></el-checkbox>
                            <el-checkbox label="复选框 B"></el-checkbox>
                            <el-checkbox label="复选框 C"></el-checkbox>
                        </el-checkbox-group>
                    </el-form-item>
                    <el-form-item>
                      <el-checkbox-group v-model="checkList">
                          <el-checkbox label="复选框 A"></el-checkbox>
                          <el-checkbox label="复选框 B"></el-checkbox>
                          <el-checkbox label="复选框 C"></el-checkbox>
                      </el-checkbox-group>
                    </el-form-item>
                </div>
                <div class="center" style="text-align: center;padding-top: 10px;">
                    <el-form-item label="检查时间:">
                        <el-date-picker
                            v-model="form.time"
                            type="daterange"
                            range-separator="至"
                            start-placeholder="开始日期"
                            end-placeholder="结束日期">
                        </el-date-picker>
                    </el-form-item>
                    <el-form-item>
                        <el-button  class="btn" size="small" type="primary" @click="close()"
                        >汇总</el-button>
                        <el-button  class="btn" size="small" type="primary" @click="close()"
                        >导出Excel</el-button>
                    </el-form-item>
                </div>
            </el-form>
<!--            <el-table-->
<!--                :data="tableData"-->
<!--                style="width: 100%">-->
<!--                <el-table-column align="center" label="众泰煤焦化-安全隐患台帐">-->
<!--                    <el-table-column-->
<!--                        prop="name"-->
<!--                        label="隐患部门\隐患专业"-->
<!--                        align="center">-->
<!--                    </el-table-column>-->
<!--                    <el-table-column-->
<!--                        prop="province"-->
<!--                        label="采掘"-->
<!--                        align="center">-->
<!--                    </el-table-column>-->
<!--                    <el-table-column-->
<!--                        prop="city"-->
<!--                        label="生产"-->
<!--                        width="120"-->
<!--                        align="center">-->
<!--                    </el-table-column>-->
<!--                    <el-table-column-->
<!--                        prop="address"-->
<!--                        label="合计"-->
<!--                        width="300"-->
<!--                        align="center">-->
<!--                    </el-table-column>-->
<!--                </el-table-column>-->
<!--            </el-table>-->
            <div style="color: #c5021a;margin-top: 20px;">
                <div>温馨提示:</div>
                <div>点选可查询隐患详情。</div>
            </div>
        </div>
    </div>
</template>
<script>
export default {
    name: "index",
    data() {
        return {
            form: {
                time: '',
                region: '',
                date1: '',
                date2: '',
                delivery: false,
                type: [],
                resource: '',
                desc: ''
            },
            checkList: ['复选框 A'],
            tableData: [{
                name: '财务部',
                province: '1',
                city: '4',
                address: '1'
            }, {
                name: '党委副书记',
                province: '0',
                city: '2',
                address: '0'
            }, {
                name: '众泰煤焦化',
                province: '2',
                city: '3',
                address: '1'
            }, {
                name: '王小虎',
                province: '3',
                city: '9',
                address: '2'
            }]
        }
    }
}
</script>
<style scoped>
.top{
    padding: 10px 5px;
    background: #e4edf4;
}
/*下拉框图标隐藏*/
.whole_top .select /deep/ .el-input__suffix-inner .is-reverse{
    display: none;
}
.whole_top .select /deep/ .el-input__suffix-inner .el-icon-arrow-up{
    display: none;
}
/*设下拉框颜色*/
.select /deep/.el-input__inner {
    border: 1px solid #c5dbec;
    font-weight: bold;
    background: #dfeffc;
    /*.el-icon-circle-close*/
}
.whole_top .select /deep/.el-select .el-input__inner:focus {
    color: #e6860b;
}
.select /deep/ .is-focus .el-select__tags-text{
    color: #000000;
}
/*下拉框选值之后的样式*/
.select /deep/ .el-tag.el-tag--info {
    background-color: transparent;;
    border-color: transparent;
    font-weight: bold;
    color: #e6860b;
}
/*placeholder颜色修改*/
.whole_top ::-webkit-input-placeholder {
    color: #000000;
}
.whole_top :-moz-placeholder {
    color: #000000;
}
.whole_top ::-moz-placeholder{
    color: #000000;
}
.whole_top :-ms-input-placeholder {
    color: #000000;
}
/*日期*/
/deep/ .el-date-editor .el-range-separator{
    width: auto;
}
.btn{
    background-color: #034ea2;
    border: 1px solid #034ea2;
}
</style>