소스 검색

style: remove the maunal input of the time input box

Casper Dai 3 년 전
부모
커밋
df76899fa1

+ 1 - 1
.env.production

@@ -16,7 +16,7 @@ VUE_APP_MQTT_USER_NAME = 'frontend'
 VUE_APP_MQTT_PASSWORD = 'inspur-frontend'
 
 # keycloak
-VUE_APP_KEYCLOAK_OPTIONS_URL = '/auth'
+VUE_APP_KEYCLOAK_OPTIONS_URL = 'http://liangke00.home.langchao.com:18080/auth'
 VUE_APP_KEYCLOAK_OPTIONS_REALM = 'smsb'
 VUE_APP_KEYCLOAK_OPTIONS_CLIENTID = 'frontend-dev-api'
 VUE_APP_KEYCLOAK_OPTIONS_ONLOAD = 'login-required'

+ 3 - 2
mock/proxy.js

@@ -8,6 +8,7 @@ const thumbnailKey = process.env.VUE_APP_THUMBNAIL.replace(base_url, '')
 
 const ui = 'http://10.180.88.84:8093'
 const gate = 'http://10.180.88.84:8081'
+// const gate = 'http://liangke00.home.langchao.com:8081'
 
 module.exports = {
   register (router) {
@@ -34,11 +35,11 @@ module.exports = {
   }
 }
 
-function createProxy (to, replace = true) {
+function createProxy (to, replace = '') {
   return proxy(to, {
     parseReqBody: false,
     proxyReqPathResolver (req) {
-      const url = replace ? `${req.baseUrl.replace(base_url, '')}${req.url}` : req.url
+      const url = replace === false ? req.url : `${req.baseUrl.replace(base_url, replace)}${req.url}`
       console.log(`proxy ${url} to ${to}`)
       return url
     }

+ 0 - 235
src/components/Schedule/ScheduleCalendar/ScheduleEdit.bak.vue

@@ -1,235 +0,0 @@
-<template>
-  <div class="c-form">
-    <div class="c-form__section">
-      <span class="c-form__label">播放模式:</span>
-      <el-select
-        v-model="repeatType"
-        class="c-form__item"
-        placeholder="请选择"
-      >
-        <el-option
-          v-for="option in repeatTypeOptions"
-          :key="option.value"
-          :label="option.label"
-          :value="option.value"
-        />
-      </el-select>
-    </div>
-    <div
-      v-if="isSingle"
-      class="c-form__section"
-    >
-      <el-date-picker
-        v-model="range"
-        type="datetimerange"
-        start-placeholder="开始时间"
-        range-separator="至"
-        end-placeholder="结束时间"
-        :picker-options="pickerOptions"
-        :default-time="['00:00:00', '23:59:59']"
-        @change="onChange"
-      />
-    </div>
-    <template v-if="isWeekly">
-      <el-checkbox-group
-        v-model="week"
-        class="c-form__section wrap"
-        size="small"
-      >
-        <el-checkbox
-          v-for="option in weekOptions"
-          :key="option.value"
-          class="c-form__checkbox"
-          :label="option.value"
-          border
-        >
-          {{ option.label }}
-        </el-checkbox>
-      </el-checkbox-group>
-      <div class="c-form__section wrap">
-        <el-date-picker
-          v-model="startTimeDate"
-          type="date"
-          placeholder="开始日期"
-          :picker-options="pickerOptions"
-        />
-        <span class="has-padding">至</span>
-        <el-date-picker
-          v-model="endTimeDate"
-          type="date"
-          placeholder="结束日期"
-          :picker-options="pickerOptions"
-        />
-      </div>
-      <div class="c-form__section wrap">
-        <el-time-picker
-          v-model="startTime"
-          placeholder="开始时间"
-        />
-        <span class="has-padding">至</span>
-        <el-time-picker
-          v-model="endTime"
-          placeholder="结束时间"
-        />
-      </div>
-    </template>
-    <div class="c-form__section">
-      <div
-        class="o-program-name u-ellipsis u-pointer"
-        @click="toBind"
-      >
-        {{ programName }}
-      </div>
-    </div>
-    <el-dialog
-      :visible.sync="choosing"
-      title="选择节目"
-      custom-class="c-dialog hidden-footer"
-      append-to-body
-    >
-      <ProgramChoose
-        v-if="choosing"
-        v-bind="$attrs"
-        @choose="toChoose"
-      />
-    </el-dialog>
-  </div>
-</template>
-
-<script>
-import ProgramChoose from '../components/ProgramChoose'
-
-export default {
-  name: 'ScheduleEdit',
-  components: {
-    ProgramChoose
-  },
-  props: {
-    program: {
-      type: Object,
-      default () {
-        return {}
-      }
-    }
-  },
-  data () {
-    return {
-      choosing: false,
-      repeatTypeOptions: [
-        { value: 1, label: '单次' }/*,
-        { value: 2, label: '每周' }*/
-      ],
-      repeatType: '',
-      range: [],
-      weekOptions: [
-        { value: 1, label: '周一' },
-        { value: 2, label: '周二' },
-        { value: 3, label: '周三' },
-        { value: 4, label: '周四' },
-        { value: 5, label: '周五' },
-        { value: 6, label: '周六' },
-        { value: 7, label: '周日' }
-      ],
-      week: [],
-      startTimeDate: null,
-      endTimeDate: null,
-      startTime: null,
-      endTime: null,
-      bindTo: null
-    }
-  },
-  computed: {
-    isSingle () {
-      return this.repeatType === 1
-    },
-    isWeekly () {
-      return this.repeatType === 2
-    },
-    pickerOptions () {
-      return {
-        disabledDate: this.isDisableDate
-      }
-    },
-    programName () {
-      return this.bindTo ? this.bindTo.itemName : '点击选择节目'
-    }
-  },
-  watch: {
-    program: {
-      handler () {
-        const now = new Date()
-        this.$min = new Date(now.getFullYear(), now.getMonth(), now.getDate())
-        this.$max = new Date(now.getFullYear(), now.getMonth(), now.getDate() + 30)
-        this.init()
-      },
-      immediate: true
-    }
-  },
-  methods: {
-    onChange () {
-      if (this.range && this.range[0] < Date.now()) {
-        this.range[0] = new Date()
-      }
-    },
-    transform (date) {
-      return `${date.year}/${date.month + 1}/${date.day}`
-    },
-    init () {
-      const { repeatType, startTimeDate, endTimeDate, week, startTime, endTime, itemId, itemName } = this.program
-      this.repeatType = repeatType || 1
-      if (this.isSingle) {
-        this.range = startTimeDate ? [new Date(`${this.transform(startTimeDate)} ${startTime}`), new Date(`${this.transform(endTimeDate)} ${endTime}`)] : []
-        this.week = []
-        this.startTimeDate = null
-        this.endTimeDate = null
-        this.startTime = null
-        this.endTime = null
-      } else {
-        this.range = []
-        this.week = week || []
-        this.startTimeDate = startTimeDate ? new Date(this.transform(startTimeDate)) : null
-        this.endTimeDate = endTimeDate ? new Date(this.transform(endTimeDate)) : null
-        this.startTime = startTime ? new Date(startTime) : null
-        this.endTime = endTime ? new Date(endTime) : null
-      }
-      this.bindTo = itemId ? { itemId, itemName } : null
-    },
-    isDisableDate (date) {
-      return date < this.$min || date > this.$max
-    },
-    toBind () {
-      this.choosing = true
-    },
-    toChoose (program) {
-      this.choosing = false
-      this.bindTo = {
-        itemId: program.id,
-        itemName: program.name
-      }
-    },
-    getValue () {
-      return {
-        repeatType: this.repeatType,
-        range: this.range,
-        week: this.week,
-        startTime: this.startTime,
-        endTime: this.endTime,
-        ...this.bindTo
-      }
-    }
-  }
-}
-</script>
-
-<style lang="scss" scoped>
-.o-program-name {
-  width: 300px;
-  padding: $spacing;
-  color: $blue;
-  font-size: 16px;
-  line-height: 1;
-  text-align: center;
-  border-radius: 4px;
-  border: 1px solid $gray;
-}
-</style>

+ 11 - 2
src/components/Schedule/ScheduleCalendar/ScheduleEdit.vue

@@ -25,6 +25,7 @@
         value-format="yyyy-MM-dd HH:mm:ss"
         :default-time="['00:00:00', '23:59:59']"
         :picker-options="pickerOptions"
+        :editable="false"
         @change="onChange"
       />
     </div>
@@ -52,6 +53,7 @@
 </template>
 
 <script>
+import { parseTime } from '@/utils'
 import ProgramChoose from '../components/ProgramChoose'
 
 export default {
@@ -121,8 +123,15 @@ export default {
   },
   methods: {
     onChange () {
-      if (this.range && this.range[0] < Date.now()) {
-        this.range[0] = new Date()
+      if (this.range) {
+        const now = Date.now()
+        const nowDate = parseTime(now, '{y}-{m}-{d} {h}:{i}:{s}')
+        if (new Date(this.range[0]) < now) {
+          this.range[0] = nowDate
+        }
+        if (new Date(this.range[1]) < now) {
+          this.range[1] = nowDate
+        }
       }
     },
     init () {

+ 10 - 10
src/components/Schedule/ScheduleCalendar/index.vue

@@ -14,14 +14,14 @@
         class="l-flex__none c-sibling-item o-button"
         @click="today"
       >
-        此刻
+        本月
       </button>
       <i
         class="c-schedule-calendar__btn el-icon-arrow-left c-sibling-item u-pointer"
         :class="{ show: canToPresent }"
         @click="toPresent"
       />
-      <span class="c-schedule-calendar__time">{{ date }}</span>
+      <span class="c-schedule-calendar__time u-readonly">{{ date }}</span>
       <i
         class="c-schedule-calendar__btn el-icon-arrow-right u-pointer"
         :class="{ show: canToNext }"
@@ -30,13 +30,13 @@
     </template>
     <div class="l-flex__auto l-flex--col c-schedule-calendar__main">
       <div class="l-flex__none l-flex c-schedule-calendar__header">
-        <div class="l-flex__auto">周日</div>
-        <div class="l-flex__auto">周一</div>
-        <div class="l-flex__auto">周二</div>
-        <div class="l-flex__auto">周三</div>
-        <div class="l-flex__auto">周四</div>
-        <div class="l-flex__auto">周五</div>
-        <div class="l-flex__auto">周六</div>
+        <div class="l-flex__auto u-readonly">周日</div>
+        <div class="l-flex__auto u-readonly">周一</div>
+        <div class="l-flex__auto u-readonly">周二</div>
+        <div class="l-flex__auto u-readonly">周三</div>
+        <div class="l-flex__auto u-readonly">周四</div>
+        <div class="l-flex__auto u-readonly">周五</div>
+        <div class="l-flex__auto u-readonly">周六</div>
       </div>
       <div class="c-schedule-calendar__content">
         <div
@@ -541,7 +541,7 @@ export default {
     }
 
     &.invalid {
-      background-color: $gray--light;
+      background-color: lighten($gray--light, 4%);
       cursor: not-allowed;
     }
 

+ 1 - 1
src/scss/bem/_object.scss

@@ -196,7 +196,7 @@
 
 .o-date-picker {
   &.hide-footer {
-    .el-picker-panel__footer {
+    .el-picker-panel__footer .el-button--text {
       display: none;
     }
   }

+ 2 - 0
src/views/logger/index.vue

@@ -15,6 +15,7 @@
             default-time="00:00:00"
             format="yyyy-MM-dd HH:mm"
             value-format="yyyy-MM-dd HH:mm:ss"
+            :editable="false"
             @focus="onDateTimeFocus('beginTime')"
             @change="onDateTimeChange('beginTime')"
           />
@@ -26,6 +27,7 @@
             default-time="23:59:59"
             format="yyyy-MM-dd HH:mm"
             value-format="yyyy-MM-dd HH:mm:ss"
+            :editable="false"
             @focus="onDateTimeFocus('endTime')"
             @change="onDateTimeChange('endTime')"
           />

+ 7 - 3
src/views/schedule/deploy/index.vue

@@ -34,17 +34,21 @@
             v-model="startDateTime"
             type="datetime"
             placeholder="选择开始日期时间"
+            value-format="yyyy-MM-dd HH:mm:ss"
             :picker-options="pickerOptions"
+            :editable="false"
             @change="onDateTimeChange('startDateTime')"
           />
           <span class="o-separator">至</span>
           <el-date-picker
             v-model="endDateTime"
             type="datetime"
+            popper-class="o-date-picker hide-footer"
             placeholder="选择结束日期时间"
-            :picker-options="endDateTimePickerOptions"
             default-time="23:59:59"
-            popper-class="o-date-picker hide-footer"
+            value-format="yyyy-MM-dd HH:mm:ss"
+            :picker-options="endDateTimePickerOptions"
+            :editable="false"
             @change="onDateTimeChange('endDateTime')"
           />
         </div>
@@ -262,7 +266,7 @@ export default {
         if (this.endDateTime && this.startDateTime === this.endDateTime) {
           this.$message({
             type: 'warning',
-            message: '无效时间,请重新选择排期时间'
+            message: '开始时间与结束时间不能一样,请重新选择'
           })
           return
         }

+ 1 - 1
src/views/schedule/timeline/index.vue

@@ -35,9 +35,9 @@
           type="date"
           placeholder="选择日期"
           value-format="yyyy-MM-dd"
+          :picker-options="pickerOptions"
           :editable="false"
           :clearable="false"
-          :picker-options="pickerOptions"
           @change="search"
         />
         <search-input