页面修改

src/components/schedul/audition-form.vue

@@ -7,19 +7,38 @@
       <q-card-section>
         <div class="row wrap">
           <div class="col-6 q-pb-lg q-pr-lg">
-            <q-field filled>
-               <template v-slot:control>
-                <el-date-picker v-model="msg.StartClassDate" value-format="yyyy-MM-dd" type="date" placeholder="开始时间"
-                  size="small" style="width:47%;" @change="resetSearch" clear-icon="iconfont icon-guanbi">
-                </el-date-picker>至
-                <el-date-picker v-model="msg.EndClassDate" value-format="yyyy-MM-dd" type="date" placeholder="结束时间"
-                  size="small" style="width:47%;" @change="resetSearch" clear-icon="iconfont icon-guanbi">
-                </el-date-picker>
+            <q-field borderless @input="resetSearch">
+               <template v-slot:prepend>
+                <q-input filled v-model="msg.StartClassDate" mask="date" label="开始日期" @input="resetSearch"
+                  @change="resetSearch">
+                  <template v-slot:append>
+                    <q-icon name="event" class="cursor-pointer">
+                      <q-popup-proxy ref="StartClassDate" transition-show="scale" transition-hide="scale">
+                        <q-date v-model="msg.StartClassDate" @input="() => $refs.StartClassDate.hide()"
+                          @change="resetSearch" />
+                      </q-popup-proxy>
+                    </q-icon>
+                  </template>
+                </q-input>
+              </template>
+
+              <template v-slot:append>
+                <q-input filled v-model="msg.EndClassDate" mask="date" label="结束日期" @input="resetSearch"
+                  @change="resetSearch">
+                  <template v-slot:append>
+                    <q-icon name="event" class="cursor-pointer">
+                      <q-popup-proxy ref="EndClassDate" transition-show="scale" transition-hide="scale">
+                        <q-date v-model="msg.EndClassDate" @input="() => $refs.EndClassDate.hide()"
+                          @change="resetSearch" />
+                      </q-popup-proxy>
+                    </q-icon>
+                  </template>
+                </q-input>
               </template>
             </q-field>
           </div>
           <div class="col-6 q-pr-lg q-pb-lg">
-            <q-select @input="resetSearch" filled  option-value="TId" option-label="TeacherName" v-model="msg.TeacherId"
+            <q-select @input="resetSearch" filled option-value="TId" option-label="TeacherName" v-model="msg.TeacherId"
               :options="TeacherList" emit-value map-options label="老师" clearable />
           </div>
         </div>
@@ -185,10 +204,10 @@
 </script>
 
 <style>
-<style>
-  .Sysuser_Date .el-input__inner {
+  <style>.Sysuser_Date .el-input__inner {
     background: transparent !important;
     border: 0 !important;
   }
+
 </style>
 </style>