| | |
| | | <template> |
| | | <div class="screening"> |
| | | |
| | | <div class="title">设备编码 : </div> |
| | | <div class="input_code"> |
| | | <el-input |
| | | placeholder="请输入内容" |
| | | v-model="code" |
| | | clearable> |
| | | </el-input> |
| | | <el-input placeholder="请输入内容" v-model="code" clearable> </el-input> |
| | | </div> |
| | | |
| | | |
| | | <div class="title electric">电量区间 : </div> |
| | | |
| | | <div class="input_elec"> |
| | | <el-input |
| | | placeholder="请输入" |
| | | v-model="lowerElec" |
| | | clearable> |
| | | </el-input> |
| | | <el-input placeholder="请输入" v-model="lowerElec" clearable> </el-input> |
| | | </div> |
| | | <div class="font-weight: 700;font-size: 25px;">-</div> |
| | | <div class="input_elec"> |
| | | <el-input |
| | | placeholder="请输入" |
| | | v-model="UpperElec" |
| | | clearable> |
| | | </el-input> |
| | | <el-input placeholder="请输入" v-model="UpperElec" clearable> </el-input> |
| | | </div> |
| | | |
| | | <div class="save">查询</div> |
| | | <div class="reset">清空</div> |
| | | |
| | | |
| | | <div class="save" @click="searchHelmet">查询</div> |
| | | <div class="reset" @click="resetHelmet">清空</div> |
| | | </div> |
| | | </template> |
| | | |
| | |
| | | export default { |
| | | data() { |
| | | return { |
| | | code:'', |
| | | lowerElec: '', |
| | | UpperElec: '' |
| | | } |
| | | } |
| | | } |
| | | code: "", |
| | | lowerElec: "", |
| | | UpperElec: "", |
| | | }; |
| | | }, |
| | | methods: { |
| | | searchHelmet() { |
| | | this.$emit("searchHelmet", { |
| | | sn: this.code, |
| | | batteryStart: this.lowerElec, |
| | | batteryEnd: this.UpperElec, |
| | | }); |
| | | }, |
| | | resetHelmet() { |
| | | this.code = ""; |
| | | this.lowerElec = ""; |
| | | this.UpperElec = ""; |
| | | this.$emit("resetHelmet"); |
| | | }, |
| | | }, |
| | | }; |
| | | </script> |
| | | |
| | | <style scoped lang="scss"> |
| | |
| | | padding: 0 20px; |
| | | height: 70px; |
| | | border-radius: 15px; |
| | | background-color: #F2F2F7; |
| | | background-color: #f2f2f7; |
| | | |
| | | .title { |
| | | font-size: 14px; |
| | | color: #4F4F4F; |
| | | color: #4f4f4f; |
| | | } |
| | | |
| | | .input_code { |
| | |
| | | cursor: pointer; |
| | | |
| | | &:hover { |
| | | background: #11AA66; |
| | | background: #11aa66; |
| | | color: #fff; |
| | | } |
| | | } |
| | |
| | | cursor: pointer; |
| | | |
| | | &:hover { |
| | | background: #11AA66; |
| | | background: #11aa66; |
| | | color: #fff; |
| | | } |
| | | } |
| | |
| | | border-radius: 10px; |
| | | |
| | | &:focus { |
| | | border: 1px solid #11AA66; |
| | | border: 1px solid #11aa66; |
| | | } |
| | | } |
| | | |
| | | } |
| | | </style> |