Commit e823fb79c99b11a6553d65b8888a0db081411ec6
1 parent
aed43d3a
集团管理员
Showing
9 changed files
with
540 additions
and
6 deletions
src/assets/images/E/photo_cache/98d71c21c679eccd804eab61885fe378713eb851.dat
0 → 100644
No preview for this file type
src/assets/images/banji.png
0 → 100644
11.1 KB
src/assets/images/jianpan.png
0 → 100644
1.34 KB
src/assets/images/jizhan.png
0 → 100644
14 KB
src/assets/images/laoshi.png
0 → 100644
7.89 KB
src/assets/images/xuesheng.png
0 → 100644
16.7 KB
src/router/index.js
| ... | ... | @@ -69,6 +69,22 @@ let defaultRouter = [ |
| 69 | 69 | ] |
| 70 | 70 | }, |
| 71 | 71 | { |
| 72 | + path: "/setUpConglomerate", | |
| 73 | + iconCls: "fa fa-building", // 图标样式class | |
| 74 | + name: "学校管理", | |
| 75 | + component: Layout, | |
| 76 | + alone: true, | |
| 77 | + children: [ | |
| 78 | + { | |
| 79 | + path: "/setUpConglomerate", | |
| 80 | + iconCls: "fa fa-building", | |
| 81 | + name: '集团管理', | |
| 82 | + component: SetUpConglomerate, | |
| 83 | + children: [] | |
| 84 | + }, | |
| 85 | + ] | |
| 86 | + }, | |
| 87 | + { | |
| 72 | 88 | path: "/404", |
| 73 | 89 | component: NotFound, |
| 74 | 90 | name: "404", | ... | ... |
src/views/login/index.vue
| ... | ... | @@ -90,12 +90,12 @@ export default { |
| 90 | 90 | disableClick: true, |
| 91 | 91 | passwordType: "password", |
| 92 | 92 | loginForm: { |
| 93 | - // username: "13610050254", | |
| 94 | - // password: "Pw050254#", | |
| 93 | + username: "13610050254", | |
| 94 | + password: "Pw050254#", | |
| 95 | 95 | // username: "18946034886", |
| 96 | 96 | // password: "Pw034886#", |
| 97 | - username: "18332123505", | |
| 98 | - password: "Pw123505#", | |
| 97 | + // username: "18332123505", | |
| 98 | + // password: "Pw123505#", | |
| 99 | 99 | }, |
| 100 | 100 | loginRules: { |
| 101 | 101 | username: [ | ... | ... |
src/views/setUp/conglomerate.vue
| ... | ... | @@ -5,12 +5,530 @@ |
| 5 | 5 | <span>学校管理</span> |
| 6 | 6 | </template> |
| 7 | 7 | </back-box> |
| 8 | + <div class="page-content"> | |
| 9 | + <el-empty | |
| 10 | + :image-size="100" | |
| 11 | + v-if="!tableList.length && loading == false" | |
| 12 | + description="没有更多数据" | |
| 13 | + ></el-empty> | |
| 14 | + <div v-else class="content-box" v-loading="loading"> | |
| 15 | + <div class="left-box"> | |
| 16 | + <p class="h-title"> | |
| 17 | + <span class="tog-type" @click="setType">{{ | |
| 18 | + `${type == 1 ? "集团列表" : "区域列表"}` | |
| 19 | + }}</span> | |
| 20 | + <i class="icon el-icon-circle-plus-outline" @click="edit"></i> | |
| 21 | + </p> | |
| 22 | + <ul class="school-ul"> | |
| 23 | + <li | |
| 24 | + class="school-item" | |
| 25 | + v-for="item in tableList" | |
| 26 | + :key="item.id" | |
| 27 | + :class="showId == item.id ? 'active' : ''" | |
| 28 | + @click="showSchool(item)" | |
| 29 | + > | |
| 30 | + {{ item.name }}({{ item.num }}) | |
| 31 | + <!-- <i class="el-icon-edit-outline" @click.stop="setSchool(item)"></i> --> | |
| 32 | + </li> | |
| 33 | + </ul> | |
| 34 | + </div> | |
| 35 | + <div class="content-detail"> | |
| 36 | + <div class="title-box"> | |
| 37 | + <span>管辖的学校(5)</span> | |
| 38 | + <i class="icon el-icon-circle-plus-outline" @click="addSchool"></i> | |
| 39 | + </div> | |
| 40 | + <ul class="detail-list"> | |
| 41 | + <li | |
| 42 | + class="detail-item" | |
| 43 | + v-for="item in schoolData.list" | |
| 44 | + :key="item.id" | |
| 45 | + > | |
| 46 | + <p class="item-tit"> | |
| 47 | + <span class="name" :class="type == 1 ? 'active' : ''">{{ | |
| 48 | + item.name | |
| 49 | + }}</span> | |
| 50 | + <i | |
| 51 | + @click="addAdmin(item)" | |
| 52 | + v-if="type == 1" | |
| 53 | + class="icon el-icon-user-solid" | |
| 54 | + ></i> | |
| 55 | + <el-popconfirm | |
| 56 | + v-if="type == 2" | |
| 57 | + title="确定删除吗?" | |
| 58 | + @confirm="removeSchool(item)" | |
| 59 | + > | |
| 60 | + <i slot="reference" class="icon el-icon-delete"></i> | |
| 61 | + </el-popconfirm> | |
| 62 | + </p> | |
| 63 | + <div class="info"> | |
| 64 | + <p class="info-item"> | |
| 65 | + <span class="txt">基站</span> | |
| 66 | + <img class="pic" src="../../assets/images/jizhan.png" /> | |
| 67 | + <span>49</span> | |
| 68 | + </p> | |
| 69 | + <p class="info-item"> | |
| 70 | + <span class="txt">键盘</span> | |
| 71 | + <img class="pic" src="../../assets/images/jianpan.png" /> | |
| 72 | + <span>49</span> | |
| 73 | + </p> | |
| 74 | + <p class="info-item"> | |
| 75 | + <span class="txt">班级</span> | |
| 76 | + <img class="pic" src="../../assets/images/banji.png" /> | |
| 77 | + <span>49</span> | |
| 78 | + </p> | |
| 79 | + <p class="info-item"> | |
| 80 | + <span class="txt">学生</span> | |
| 81 | + <img class="pic" src="../../assets/images/xuesheng.png" /> | |
| 82 | + <span>49</span> | |
| 83 | + </p> | |
| 84 | + <p class="info-item"> | |
| 85 | + <span class="txt">老师</span> | |
| 86 | + <img class="pic" src="../../assets/images/laoshi.png" /> | |
| 87 | + <span>49</span> | |
| 88 | + </p> | |
| 89 | + </div> | |
| 90 | + </li> | |
| 91 | + </ul> | |
| 92 | + </div> | |
| 93 | + </div> | |
| 94 | + </div> | |
| 95 | + <el-dialog title="添加区域/集团" :visible.sync="diaCL" width="400"> | |
| 96 | + <el-form | |
| 97 | + class="form-box" | |
| 98 | + ref="formCL" | |
| 99 | + :model="formCL" | |
| 100 | + :rules="rulesCL" | |
| 101 | + label-width="160px" | |
| 102 | + > | |
| 103 | + <el-form-item label="区域/集团名称:" prop="name"> | |
| 104 | + <el-col :span="10"> | |
| 105 | + <el-input | |
| 106 | + maxlength="30" | |
| 107 | + v-model.trim="formCL.name" | |
| 108 | + placeholder="请输入区域/集团名称" | |
| 109 | + /> | |
| 110 | + </el-col> | |
| 111 | + </el-form-item> | |
| 112 | + </el-form> | |
| 113 | + <div class="dialog-footer" slot="footer"> | |
| 114 | + <el-button type="primary" round @click="saveFormCL">确 定</el-button> | |
| 115 | + <el-button round @click="diaCL = false">取 消</el-button> | |
| 116 | + </div> | |
| 117 | + </el-dialog> | |
| 118 | + <el-dialog title="添加管理员" :visible.sync="diaAdmin" width="400"> | |
| 119 | + <el-form | |
| 120 | + class="form-box" | |
| 121 | + ref="formAdmin" | |
| 122 | + :model="formAdmin" | |
| 123 | + :rules="rulesAdmin" | |
| 124 | + label-width="160px" | |
| 125 | + > | |
| 126 | + <el-form-item label="学校名称:"> | |
| 127 | + <span>{{ schoolData.name + formAdmin.name }}</span> | |
| 128 | + </el-form-item> | |
| 129 | + <el-form-item label="手机号码:" prop="phone"> | |
| 130 | + <el-col :span="10"> | |
| 131 | + <el-input | |
| 132 | + maxlength="11" | |
| 133 | + v-model.trim="formAdmin.phone" | |
| 134 | + placeholder="请输入手机号码" | |
| 135 | + /> | |
| 136 | + </el-col> | |
| 137 | + </el-form-item> | |
| 138 | + <el-form-item label="密码:" prop="password"> | |
| 139 | + <el-col :span="10"> | |
| 140 | + <el-input | |
| 141 | + maxlength="18" | |
| 142 | + v-model.trim="formAdmin.phone" | |
| 143 | + placeholder="请输入密码" | |
| 144 | + /> | |
| 145 | + </el-col> | |
| 146 | + </el-form-item> | |
| 147 | + <el-form-item label="姓名:" prop="realName"> | |
| 148 | + <el-col :span="10"> | |
| 149 | + <el-input | |
| 150 | + maxlength="30" | |
| 151 | + v-model.trim="formAdmin.realName" | |
| 152 | + placeholder="请输入姓名" | |
| 153 | + /> | |
| 154 | + </el-col> | |
| 155 | + </el-form-item> | |
| 156 | + </el-form> | |
| 157 | + <div class="dialog-footer" slot="footer"> | |
| 158 | + <el-button type="primary" round @click="saveFormAdmin">确 定</el-button> | |
| 159 | + <el-button round @click="diaAdmin = false">取 消</el-button> | |
| 160 | + </div> | |
| 161 | + </el-dialog> | |
| 162 | + <el-dialog title="添加学校" :visible.sync="diaSchool" width="400"> | |
| 163 | + <el-form | |
| 164 | + class="form-box" | |
| 165 | + ref="formSchool" | |
| 166 | + :model="formSchool" | |
| 167 | + :rules="rulesSchool" | |
| 168 | + label-width="160px" | |
| 169 | + > | |
| 170 | + <el-form-item label="学校名称:" prop="name"> | |
| 171 | + <el-col :span="10"> | |
| 172 | + <el-input | |
| 173 | + maxlength="11" | |
| 174 | + v-model.trim="formSchool.name" | |
| 175 | + placeholder="请输入学校名称" | |
| 176 | + /> | |
| 177 | + </el-col> | |
| 178 | + </el-form-item> | |
| 179 | + <el-form-item label="所属区域/集团:"> | |
| 180 | + <el-select | |
| 181 | + class="sel" | |
| 182 | + v-model="formSchool.quyu" | |
| 183 | + placeholder="选择所属区域/集团" | |
| 184 | + > | |
| 185 | + <el-option | |
| 186 | + v-for="item in tableList" | |
| 187 | + :key="item.id" | |
| 188 | + :label="item.name" | |
| 189 | + :value="item.id" | |
| 190 | + > | |
| 191 | + </el-option> | |
| 192 | + </el-select> | |
| 193 | + </el-form-item> | |
| 194 | + <el-form-item label="学段:" prop="grade"> | |
| 195 | + <el-checkbox-group v-model="formSchool.grade"> | |
| 196 | + <el-checkbox :label="1">小学</el-checkbox> | |
| 197 | + <el-checkbox :label="2">初中</el-checkbox> | |
| 198 | + <el-checkbox :label="3">高中</el-checkbox> | |
| 199 | + <el-checkbox :label="4">本科</el-checkbox> | |
| 200 | + </el-checkbox-group> | |
| 201 | + </el-form-item> | |
| 202 | + </el-form> | |
| 203 | + <div class="dialog-footer" slot="footer"> | |
| 204 | + <el-button type="primary" round @click="saveFormSchool" | |
| 205 | + >确 定</el-button | |
| 206 | + > | |
| 207 | + <el-button round @click="diaSchool = false">取 消</el-button> | |
| 208 | + </div> | |
| 209 | + </el-dialog> | |
| 8 | 210 | </div> |
| 9 | 211 | </template> |
| 10 | 212 | |
| 11 | 213 | <script> |
| 12 | -export default {}; | |
| 214 | +export default { | |
| 215 | + data() { | |
| 216 | + return { | |
| 217 | + diaCL: false, | |
| 218 | + diaAdmin: false, | |
| 219 | + diaSchool: false, | |
| 220 | + loading: false, | |
| 221 | + type: 1, //集团列表-1 区域列表-2 | |
| 222 | + showId: 1, //显示学校Id | |
| 223 | + tableList: [ | |
| 224 | + // 集团列表/区域列表 | |
| 225 | + { | |
| 226 | + id: 1, | |
| 227 | + name: "云南衡水实验中学", | |
| 228 | + num: 5, | |
| 229 | + }, | |
| 230 | + ], | |
| 231 | + schoolData: { | |
| 232 | + //学校信息 | |
| 233 | + num: 5, | |
| 234 | + name: "云南衡水实验中学", | |
| 235 | + list: [ | |
| 236 | + { id: 1, name: "曲靖校区" }, | |
| 237 | + { id: 2, name: "玉溪校区" }, | |
| 238 | + ], | |
| 239 | + }, | |
| 240 | + formCL: { | |
| 241 | + name: "", | |
| 242 | + }, | |
| 243 | + rulesCL: { | |
| 244 | + name: [ | |
| 245 | + { required: true, message: "请输入区域/集团名称", trigger: "blur" }, | |
| 246 | + ], | |
| 247 | + }, | |
| 248 | + formAdmin: { | |
| 249 | + id: "", | |
| 250 | + name: "", | |
| 251 | + phone: "", | |
| 252 | + password: "", | |
| 253 | + realName: "", | |
| 254 | + }, | |
| 255 | + rulesAdmin: { | |
| 256 | + phone: [{ required: true, message: "请输入手机号码", trigger: "blur" }], | |
| 257 | + password: [{ required: true, message: "请输入密码", trigger: "blur" }], | |
| 258 | + realName: [{ required: true, message: "请输入姓名", trigger: "blur" }], | |
| 259 | + }, | |
| 260 | + formSchool: { | |
| 261 | + name: "", | |
| 262 | + grade: [], | |
| 263 | + quyu: "", | |
| 264 | + }, | |
| 265 | + rulesSchool: { | |
| 266 | + name: [{ required: true, message: "请输入学校名称", trigger: "blur" }], | |
| 267 | + grade: [{ required: true, message: "请选择学段", trigger: "blur" }], | |
| 268 | + }, | |
| 269 | + }; | |
| 270 | + }, | |
| 271 | + methods: { | |
| 272 | + edit() { | |
| 273 | + //添加区域/集团 | |
| 274 | + this.formCL.name = ""; | |
| 275 | + this.diaCL = true; | |
| 276 | + }, | |
| 277 | + addAdmin(obj) { | |
| 278 | + //添加管理员 | |
| 279 | + this.formAdmin = { ...obj }; | |
| 280 | + this.diaAdmin = true; | |
| 281 | + }, | |
| 282 | + addSchool(obj) { | |
| 283 | + //添加学校 | |
| 284 | + this.formSchool = { | |
| 285 | + name: "", | |
| 286 | + grade: [], | |
| 287 | + quyu: "", | |
| 288 | + }; | |
| 289 | + this.diaSchool = true; | |
| 290 | + }, | |
| 291 | + setSchool() { | |
| 292 | + // | |
| 293 | + }, | |
| 294 | + setType() { | |
| 295 | + //集团列表、区域列表切换 | |
| 296 | + this.type = this.type == 1 ? 2 : 1; | |
| 297 | + this._QueryData(); | |
| 298 | + }, | |
| 299 | + removeSchool(obj) { | |
| 300 | + // const { data, status, info } = await this.$request.xxx({ | |
| 301 | + // id: obj.id, | |
| 302 | + // }); | |
| 303 | + // if (status === 0) { | |
| 304 | + // this.$message.success(info); | |
| 305 | + // } else { | |
| 306 | + // this.$message.error(info); | |
| 307 | + // } | |
| 308 | + }, | |
| 309 | + saveFormCL() { | |
| 310 | + //保存添加区域/集团 | |
| 311 | + // this.$refs["formCL"].validate(async (valid) => { | |
| 312 | + // // 验证通过:保存 | |
| 313 | + // if (valid) { | |
| 314 | + // const { data, status, info } = await this.$request.xxx({ | |
| 315 | + // name: this.formCL.name, | |
| 316 | + // }); | |
| 317 | + // if (status === 0) { | |
| 318 | + // this.$message.success(info); | |
| 319 | + this.diaCL = false; | |
| 320 | + // } else { | |
| 321 | + // this.$message.error(info); | |
| 322 | + // } | |
| 323 | + // } else { | |
| 324 | + // this.$message.error("区域/集团名称数据有误,请检查!"); | |
| 325 | + // return false; | |
| 326 | + // } | |
| 327 | + // }); | |
| 328 | + }, | |
| 329 | + saveFormAdmin() { | |
| 330 | + //保存管理员 | |
| 331 | + // this.$refs["formAdmin"].validate(async (valid) => { | |
| 332 | + // // 验证通过:保存 | |
| 333 | + // if (valid) { | |
| 334 | + // const { data, status, info } = await this.$request.xxx({...formAdmin}); | |
| 335 | + // if (status === 0) { | |
| 336 | + // this.$message.success(info); | |
| 337 | + this.diaAdmin = false; | |
| 338 | + // } else { | |
| 339 | + // this.$message.error(info); | |
| 340 | + // } | |
| 341 | + // } else { | |
| 342 | + // this.$message.error("区域/集团名称数据有误,请检查!"); | |
| 343 | + // return false; | |
| 344 | + // } | |
| 345 | + // }); | |
| 346 | + }, | |
| 347 | + saveFormSchool() { | |
| 348 | + //保存学校 | |
| 349 | + // this.$refs["formAdmin"].validate(async (valid) => { | |
| 350 | + // // 验证通过:保存 | |
| 351 | + // if (valid) { | |
| 352 | + // const { data, status, info } = await this.$request.xxx({...formAdmin}); | |
| 353 | + // if (status === 0) { | |
| 354 | + // this.$message.success(info); | |
| 355 | + this.diaSchool = false; | |
| 356 | + // } else { | |
| 357 | + // this.$message.error(info); | |
| 358 | + // } | |
| 359 | + // } else { | |
| 360 | + // this.$message.error("区域/集团名称数据有误,请检查!"); | |
| 361 | + // return false; | |
| 362 | + // } | |
| 363 | + // }); | |
| 364 | + }, | |
| 365 | + async showSchool(obj) { | |
| 366 | + // const { data, status, info } = await this.$request.xxx(); | |
| 367 | + // if (status === 0) { | |
| 368 | + // this.$message.success(info); | |
| 369 | + // } else { | |
| 370 | + // this.$message.error(info); | |
| 371 | + // } | |
| 372 | + }, | |
| 373 | + async _QueryData() { | |
| 374 | + // const { data, status, info } = await this.$request.xxx(); | |
| 375 | + // if (status === 0) { | |
| 376 | + // this.$message.success(info); | |
| 377 | + // } else { | |
| 378 | + // this.$message.error(info); | |
| 379 | + // } | |
| 380 | + }, | |
| 381 | + }, | |
| 382 | +}; | |
| 13 | 383 | </script> |
| 14 | 384 | |
| 15 | -<style> | |
| 385 | +<style lang="scss" scoped> | |
| 386 | +.page-content { | |
| 387 | + padding: 20px 30px; | |
| 388 | +} | |
| 389 | +.content-box { | |
| 390 | + display: flex; | |
| 391 | + background: #f8f8f8; | |
| 392 | + border-radius: 10px; | |
| 393 | + overflow: hidden; | |
| 394 | + min-height: 400px; | |
| 395 | + | |
| 396 | + .h-title { | |
| 397 | + height: 40px; | |
| 398 | + line-height: 40px; | |
| 399 | + background: #eee; | |
| 400 | + border-radius: 10px 10px 0 0; | |
| 401 | + } | |
| 402 | + .left-box { | |
| 403 | + width: 240px; | |
| 404 | + .h-title { | |
| 405 | + display: flex; | |
| 406 | + justify-content: space-between; | |
| 407 | + align-items: center; | |
| 408 | + padding-right: 16px; | |
| 409 | + box-sizing: border-box; | |
| 410 | + .tog-type { | |
| 411 | + cursor: pointer; | |
| 412 | + } | |
| 413 | + .icon { | |
| 414 | + font-size: 20px; | |
| 415 | + color: #7f7f7f; | |
| 416 | + cursor: pointer; | |
| 417 | + } | |
| 418 | + } | |
| 419 | + .school-ul { | |
| 420 | + max-height: 70vh; | |
| 421 | + overflow-y: scroll; | |
| 422 | + } | |
| 423 | + .school-item { | |
| 424 | + font-size: 16px; | |
| 425 | + color: #7f7f7f; | |
| 426 | + line-height: 36px; | |
| 427 | + cursor: pointer; | |
| 428 | + padding-left: 12px; | |
| 429 | + position: relative; | |
| 430 | + &:hover { | |
| 431 | + background: #eee; | |
| 432 | + } | |
| 433 | + &.active { | |
| 434 | + color: #667ffd; | |
| 435 | + } | |
| 436 | + .el-icon-edit-outline { | |
| 437 | + position: absolute; | |
| 438 | + top: 8px; | |
| 439 | + right: 12px; | |
| 440 | + font-size: 20px; | |
| 441 | + display: none; | |
| 442 | + &:hover { | |
| 443 | + color: #667ffd; | |
| 444 | + } | |
| 445 | + } | |
| 446 | + &:hover { | |
| 447 | + background: #eee; | |
| 448 | + .el-icon-edit-outline { | |
| 449 | + display: block; | |
| 450 | + } | |
| 451 | + } | |
| 452 | + } | |
| 453 | + } | |
| 454 | + .content-detail { | |
| 455 | + flex: 1; | |
| 456 | + position: relative; | |
| 457 | + border-left: 0.5px solid #eee; | |
| 458 | + .title-box { | |
| 459 | + display: flex; | |
| 460 | + justify-content: space-between; | |
| 461 | + padding: 10px 20px; | |
| 462 | + .icon { | |
| 463 | + font-size: 24px; | |
| 464 | + color: #7f7f7f; | |
| 465 | + cursor: pointer; | |
| 466 | + } | |
| 467 | + .el-icon-circle-plus-outline { | |
| 468 | + margin-left: 10px; | |
| 469 | + } | |
| 470 | + } | |
| 471 | + .detail-list { | |
| 472 | + padding-left: 20px; | |
| 473 | + display: flex; | |
| 474 | + flex-wrap: wrap; | |
| 475 | + } | |
| 476 | + .detail-item { | |
| 477 | + width: 320px; | |
| 478 | + padding: 12px 16px; | |
| 479 | + border-radius: 10px; | |
| 480 | + box-shadow: 1px 1px 3px #888; | |
| 481 | + box-sizing: border-box; | |
| 482 | + margin: 0 20px 20px 0; | |
| 483 | + .item-tit { | |
| 484 | + font-size: 16px; | |
| 485 | + position: relative; | |
| 486 | + padding-bottom: 10px; | |
| 487 | + .name { | |
| 488 | + cursor: pointer; | |
| 489 | + &.active { | |
| 490 | + color: #667ffd; | |
| 491 | + } | |
| 492 | + } | |
| 493 | + &:hover { | |
| 494 | + .icon { | |
| 495 | + display: block; | |
| 496 | + } | |
| 497 | + } | |
| 498 | + .icon { | |
| 499 | + display: none; | |
| 500 | + position: absolute; | |
| 501 | + right: -5px; | |
| 502 | + top: 0; | |
| 503 | + color: #7f7f7f; | |
| 504 | + cursor: pointer; | |
| 505 | + padding: 2px; | |
| 506 | + &:hover { | |
| 507 | + color: #667ffd; | |
| 508 | + } | |
| 509 | + } | |
| 510 | + } | |
| 511 | + .info { | |
| 512 | + width: 100%; | |
| 513 | + display: flex; | |
| 514 | + .info-item { | |
| 515 | + flex: 1; | |
| 516 | + display: flex; | |
| 517 | + flex-direction: column; | |
| 518 | + align-items: center; | |
| 519 | + } | |
| 520 | + .txt { | |
| 521 | + color: #7f7f7f; | |
| 522 | + } | |
| 523 | + .pic { | |
| 524 | + height: 28px; | |
| 525 | + margin: 2px 0 5px; | |
| 526 | + } | |
| 527 | + } | |
| 528 | + } | |
| 529 | + } | |
| 530 | +} | |
| 531 | +.dialog-footer { | |
| 532 | + text-align: center; | |
| 533 | +} | |
| 16 | 534 | </style> |
| 17 | 535 | \ No newline at end of file | ... | ... |