广场管理优化

src/views/plaza/plaza-list.vue

@@ -13,15 +13,16 @@
         <el-row :gutter="30" type="flex" style="margin-top: 10px">
           <el-col :span="9">
             <el-form-item label="专区名称">
-              <el-input v-model="searchForm.squareName" size="small" placeholder="请输入专区名称"></el-input>
+              <el-input v-model="searchForm.squareName" size="small" placeholder="请输入专区名称" style="margin-left:20px;height: 32px;line-height: 32px;"></el-input>
             </el-form-item>
           </el-col>
-          <el-col :span="9">
+          <el-col :span="9" style="padding-left: 0px;">
             <el-form-item label="疾病标签">
               <el-select multiple :multiple-limit="5"
                 v-model="searchForm.diseaseIdList"
                 id="statusSelector"
                 placeholder="请选择疾病标签"
+                filterable
                 clearable
                 style="margin-left:20px;height: 32px;line-height: 32px;"
               >
@@ -43,6 +44,7 @@
                 id="statusSelector"
                 placeholder="请选择科室标签"
                 clearable
+                filterable
                 style="margin-left:20px;height: 32px;line-height: 32px;"
               >
                 <el-option
@@ -60,6 +62,7 @@
                 v-model="searchForm.subjectIdList"
                 id="statusSelector"
                 placeholder="请选择学科标签"
+                filterable
                 clearable
                 style="margin-left:20px;height: 32px;line-height: 32px;"
               >
@@ -139,17 +142,18 @@
         center
       >
 
-        <el-form ref="plazaForm" :model="plazaForm">
+        <el-form ref="plazaForm" :model="plazaForm" :rules="rules" label-suffix=":">
 
 
-              <el-form-item label="专区名称">
+              <el-form-item label="专区名称"  class="required-label" prop="businessId">
                 <el-col :span="20">
                 <el-select
                   v-model="plazaForm.businessId"
                   id="statusSelector"
-                  placeholder="请选择发布状态"
+                  placeholder="请选择专区名称"
+                  filterable
                   clearable
-                  style="margin-left:20px;height: 32px;line-height: 32px;"
+                  style="margin-left:20px;height: 32px;line-height: 32px;width: 450px;"
                   :disabled="editFlag"
                 >
                   <el-option
@@ -164,14 +168,15 @@
 
 
 
-              <el-form-item label="疾病标签">
+              <el-form-item label="疾病标签" class="required-label">
                 <el-col :span="20">
                 <el-select multiple :multiple-limit="5"
                   v-model="plazaForm.diseaseIdList"
                   id="statusSelector"
-                  placeholder="请选择发布状态"
+                  placeholder="请选择疾病标签"
+                  filterable
                   clearable
-                  style="margin-left:20px;height: 32px;line-height: 32px;"
+                  style="margin-left:20px;height: 32px;line-height: 32px;width: 450px;"
                 >
                   <el-option
                     v-for="item in diseaseList"
@@ -185,14 +190,15 @@
 
 
 
-              <el-form-item label="科室标签">
+              <el-form-item label="科室标签" class="required-label">
                 <el-col :span="20">
                 <el-select multiple :multiple-limit="5"
                   v-model="plazaForm.deptIdList"
                   id="statusSelector"
-                  placeholder="请选择发布状态"
+                  placeholder="请选择科室标签"
+                  filterable
                   clearable
-                  style="margin-left:20px;height: 32px;line-height: 32px;"
+                  style="margin-left:20px;height: 32px;line-height: 32px;width: 450px;"
                 >
                   <el-option
                     v-for="item in deptList"
@@ -205,14 +211,15 @@
               </el-form-item>
 
 
-              <el-form-item label="学科标签">
+              <el-form-item label="学科标签" class="required-label">
                 <el-col :span="25">
                 <el-select multiple :multiple-limit="5"
                   v-model="plazaForm.subjectIdList"
                   id="statusSelector"
-                  placeholder="请选择发布状态"
+                  placeholder="请选择学科标签"
+                  filterable
                   clearable
-                  style="margin-left:20px;height: 32px;line-height: 32px;"
+                  style="margin-left:20px;height: 32px;line-height: 32px;width: 450px;"
                 >
                   <el-option
                     v-for="item in subjectList"
@@ -326,27 +333,17 @@
         dialogVisible: false,
         isSign: 0, // 是否签到
 
-        statusList: [
-          {
-            value: "1",
-            label: "预告"
-          },
-          {
-            value: "2",
-            label: "直播中"
-          },
-          {
-            value: "4",
-            label: "已结束"
-          }
-        ],
-
         diseaseList: [],
         deptList: [],
         subjectList: [],
         selectPlazaList: [],
         editFlag: false,
         title: "",
+        rules: {
+          businessId: [
+            {required: true, message: "请输入专区名称", trigger: "blur"}
+          ],
+        }
       };
     },
     props:{
@@ -426,10 +423,15 @@
         vm.dialogVisible = true;
         vm.title = "添加专区";
         vm.editFlag = false;
+        vm.plazaForm = {
+            id:'',
+            businessId: "",
+            diseaseTagIds: [],
+            deptTagIds: [],
+            subjectTagIds: []
+        },
         vm.getSelectPlazaList(0);
       },
-
-
       //弹出直播链接弹窗
       liveLink(row) {
         this.dialogLivelinkVisible = true;
@@ -1033,4 +1035,12 @@
     height: 32px;
     line-height: 32px;
   }
+  /*.el-select__tags {*/
+    /*margin-top: 15px;*/
+  /*}*/
+  .required-label .el-form-item__label::before {
+    content: '*';
+    color: #F56C6C;
+    margin-right: 4px;
+  }
 </style>