| | |
| | | <template> |
| | | <div> |
| | | <el-button type="text" @click="dialogVisible = true">点击打开 Dialog</el-button> |
| | | <el-dialog |
| | | title="督查督办" |
| | | :visible.sync="dialogVisible" |
| | | width="37%" |
| | | :before-close="handleClose"> |
| | | <el-checkbox-group v-model="checkList"> |
| | | <el-checkbox label="安全环保部"></el-checkbox> |
| | | <el-checkbox label="生产技术部 "></el-checkbox> |
| | | <el-checkbox label="机电部"></el-checkbox> |
| | | <el-checkbox label="企管部"></el-checkbox> |
| | | <el-checkbox label="消防保卫部"></el-checkbox> |
| | | |
| | | <el-checkbox label="质检中心"></el-checkbox> |
| | | <el-checkbox label="市场开发部"></el-checkbox> |
| | | <el-checkbox label="综合办公室"></el-checkbox> |
| | | <el-checkbox label="工程部 "></el-checkbox> |
| | | <el-checkbox label="财务部"></el-checkbox> |
| | | |
| | | <el-checkbox label="党群工作部"></el-checkbox> |
| | | <el-checkbox label="纪检监察部"></el-checkbox> |
| | | <el-checkbox label="化产一车间"></el-checkbox> |
| | | <el-checkbox label="炼焦一车间"></el-checkbox> |
| | | <el-checkbox label="原料一车间"></el-checkbox> |
| | | |
| | | <el-checkbox label="选煤厂"></el-checkbox> |
| | | <el-checkbox label="电仪车间"></el-checkbox> |
| | | <el-checkbox label="众和机电"></el-checkbox> |
| | | <el-checkbox label="原料二车间"></el-checkbox> |
| | | <el-checkbox label="化产二车间"></el-checkbox> |
| | | |
| | | <el-checkbox label="炼焦二车间"></el-checkbox> |
| | | <el-checkbox label="甲醇厂"></el-checkbox> |
| | | <el-checkbox label="干熄焦"></el-checkbox> |
| | | </el-checkbox-group> |
| | | <span slot="footer" class="dialog-footer"> |
| | | <el-button class="btn" type="primary" @click="dialogVisible = false">确 定</el-button> |
| | | </span> |
| | | </el-dialog> |
| | | </div> |
| | | </template> |
| | | |
| | | <script> |
| | | export default { |
| | | name: "supervision" |
| | | name: "supervision", |
| | | data() { |
| | | return { |
| | | dialogVisible: false, |
| | | checkList: [] |
| | | }; |
| | | }, |
| | | methods: { |
| | | handleClose(done) { |
| | | this.$confirm('确认关闭?') |
| | | .then(_ => { |
| | | done(); |
| | | }) |
| | | .catch(_ => {}); |
| | | } |
| | | } |
| | | } |
| | | </script> |
| | | |
| | | <style scoped> |
| | | |
| | | /deep/ .el-dialog__header{ |
| | | text-align: center; |
| | | padding: 50px 50px 20px 50px; |
| | | } |
| | | /deep/ .el-dialog__header .el-dialog__title { |
| | | font-size: 12px; |
| | | font-weight: bold; |
| | | } |
| | | /deep/ .el-dialog__body{ |
| | | text-align: center; |
| | | padding: 30px 50px 30px 50px; |
| | | } |
| | | /deep/ .el-checkbox-group{ |
| | | display: flex; |
| | | flex-direction: row; |
| | | flex-wrap: wrap; |
| | | align-items: center; |
| | | } |
| | | /deep/ .el-checkbox{ |
| | | width: 120px; |
| | | text-align: left; |
| | | line-height: 25px; |
| | | } |
| | | /deep/ .el-dialog__footer{ |
| | | text-align: center; |
| | | } |
| | | .btn{ |
| | | background: url(../../assets/btn.gif) no-repeat; |
| | | width: 76px; |
| | | height: 26px; |
| | | line-height: 26px; |
| | | font-size: 14px; |
| | | border: none; |
| | | color: #fff; |
| | | cursor: pointer; |
| | | overflow: visible; |
| | | padding: 0; |
| | | } |
| | | /deep/ .el-checkbox__inner{ |
| | | border: 1px solid #000000; |
| | | } |
| | | </style> |