2021-7-22 SDU暑期项目实训日志报告11

学习目标：

本篇博客记录7-21一天的学习工作。
工作目标：优化界面

---

学习内容：

（一）教室模板展示界面优化

<el-form-item label="行数：">
	  <el-input size="small" v-model="info.model_row"
			placeholder="输入行数 不可超过20"></el-input>
	</el-form-item>

	<el-form-item label="列数：">
	  <el-input size="small" v-model="info.model_col"
			placeholder="输入列数 不可超过20"></el-input>
	</el-form-item>

<el-form-item v-if="model_name==null">
	<el-alert
	    title="单击座位控制可用不可用,拖拽座位实现替换"
		class="alert"
	    type="info"
	    center
	    show-icon>
	  </el-alert>
	</el-form-item>

（二）教室编辑界面优化

<el-form-item label="教室名称：" v-if="room_name==null">
	  <el-input size="small" v-model="info.room_name"
			placeholder="输入名称"></el-input>
	</el-form-item>
	<el-form-item label="教室名称：" v-if="room_name!=null">
		<el-input size="small" v-model="info.room_name" 
		:disabled="true" placeholder="输入名称"></el-input>
	</el-form-item>

<el-form-item label="是否可用：" prop="isUse" >
	         <el-select size="small" v-model="info.room_status"
		 			  placeholder="请选择"   >
	           <el-option label="否" value="0"></el-option>
	           <el-option label="是" value="1"></el-option>
	         </el-select>
	 </el-form-item>

<el-form-item label="模板类型：" v-if="room_name==null" >
             <el-select size="small" v-model="info.model_name"
			  placeholder="请选择"    @change="selectModeLType">
               <el-option  v-for="(item,index) in modeList"   
			   :label="item.model_name" :value="index"></el-option>
             </el-select>
     </el-form-item>
	 <el-form-item label="模板类型：" v-if="room_name!=null" >
			 <el-select size="small" v-model="info.model_name" disabled
			  placeholder="请选择"    @change="selectModeLType">
			   <el-option  v-for="(item,index) in modeList"   
			   :label="item.model_name" :value="index"></el-option>
			 </el-select>
	 </el-form-item>

（三）教室列表展示界面优化

<el-button v-if="scope.row.room_status==1" size="mini" @click="handleEdit(scope.$index, scope.row)">编辑</el-button> 
		    <el-button   size="mini" type="primary"
			@click="updateStatus(scope.$index, scope.row)">修改状态</el-button>
           <el-button v-if="scope.row.room_status==1" size="mini" type="danger" @click="deleteInfo(scope.$index, scope.row)">删除</el-button>

（四）导航栏图标优化

学习过程：

这两天主要工作就是优化界面，改前端展示，工作量较小，比较轻松。

---

下一阶段学习计划：

1、做登录界面，并与后端对接。
2、与教学管理部分进行交互，进行系统整个流程的测试。