diff --git a/src/page/jobSearch/searchList.vue b/src/page/jobSearch/searchList.vue
new file mode 100644
index 0000000..3751755
--- /dev/null
+++ b/src/page/jobSearch/searchList.vue
@@ -0,0 +1,357 @@
+<template>
+  <transition name="slide">
+    <div class="index-container">
+      <mt-header class="header" title="工单查询" fixed>
+        <div slot="left">
+          <mt-button icon="back" @click="$router.back(-1)"></mt-button>
+        </div>
+      </mt-header>
+      <div class="joblist" ref="wrapper">
+        <Loading v-show="isLoading"></Loading>
+        <mt-loadmore
+          :top-method="loadTop"
+          :topPullText="loadConf.loadTopConf.topPullText"
+          :topDropText="loadConf.loadTopConf.topDropText"
+          :topLoadingText="loadConf.loadTopConf.topLoadingText"
+          :bottom-method="loadBottom"
+          :bottomAllLoaded="loadConf.loadBottomConf.isFinish"
+          :bottomPullText="loadConf.loadBottomConf.bottomPullText"
+          :bottomDropText="loadConf.loadBottomConf.bottomDropText"
+          :bottomLoadingText="loadConf.loadBottomConf.bottomLoadingText"
+          ref="loadmore"
+          class="loadmore-content"
+        >
+          <ul class="list-ul">
+            <li class="list-li" v-for="item in list" @click="goJobDetail(item.id)">
+              <div v-if="item.jobStatus!='0'" class="job-card">
+                <div class="card-brief">
+                  <div class="card-left">
+                    <div>
+                      <span class="card-alarm">{{item.alarmContentName}}</span>
+                      <span class="card-createtime">{{item.createTime}}</span>
+                    </div>
+                    <div class="card-wellcode">
+                      <span>{{item.wellCode}}</span>
+                    </div>
+                    <div class="card-position">
+                      <span>{{item.position}}</span>
+                    </div>
+                  </div>
+                  <div class="clear-float"></div>
+                </div>
+                <div class="time-line">
+                  <timeline>
+                    <timeline-title v-if="item.jobStatus=='2'" bg-color="#26a2ff">{{item.jobBelongTo}}正在处理...
+                    </timeline-title>
+                    <timeline-title v-if="item.jobStatus=='1'" bg-color="#26a2ff">{{item.jobBelongTo}}正在确认...
+                    </timeline-title>
+                    <timeline-title v-if="item.jobStatus=='3'" bg-color="#26a2ff">{{item.jobBelongTo}}已完成
+                    </timeline-title>
+                    <timeline-title v-if="item.jobStatus=='4'" bg-color="#26a2ff">{{item.jobBelongTo}}已取消
+                    </timeline-title>
+                    <div v-if="item.showTimeline">
+                      <timeline-item>
+                        <span class="timeline-left">{{item.createTime}}</span> <span class="timeline-right">发起工单</span>
+                      </timeline-item>
+                      <timeline-item v-if="item.getJobTime!=''">
+                        <span class="timeline-left">{{item.getJobTime}}</span> <span class="timeline-right">{{item.getJobPerson}}接单</span>
+                      </timeline-item>
+                      <timeline-item v-if="item.confirmJobTime!=''">
+                        <span class="timeline-left">{{item.confirmJobTime}}</span> <span class="timeline-right">{{item.confirmJobPerson}}确认工单</span>
+                      </timeline-item>
+                      <timeline-item v-if="item.jobStatus=='3' && item.handleJobTime!=''">
+                        <span class="timeline-left">{{item.handleJobTime}}</span> <span class="timeline-right">{{item.handleJobPerson}}完成工单</span>
+                      </timeline-item>
+                      <timeline-item v-if="item.jobStatus=='4' && item.handleJobTime!=''">
+                        <span class="timeline-left">{{item.handleJobTime}}</span> <span class="timeline-right">{{item.handleJobPerson}}取消工单</span>
+                      </timeline-item>
+                      <div class="detail-btn" @click.stop="item.showTimeline=!item.showTimeline">
+                        <i class="iconfont icon-fanhui3"></i>
+                      </div>
+                    </div>
+                    <div class="detail-btn" v-else @click.stop="item.showTimeline=!item.showTimeline">
+                      <i class="iconfont icon-31xiala"></i>
+                    </div>
+                  </timeline>
+                </div>
+              </div>
+              <div v-else class="wait-job-card">
+                <div class="card-left">
+                  <div>
+                    <span class="card-alarm">{{item.alarmContentName}}</span>
+                    <span class="card-createtime">{{item.createTime}}</span>
+                  </div>
+                  <div class="card-wellcode">
+                    <span>{{item.wellCode}}</span>
+                  </div>
+                  <div class="card-info">
+                    <div class="card-position">
+                      <span>{{item.position}}</span>
+                    </div>
+                    <div class="card-right">
+                      <mt-button type="primary" size="small" @click.stop="getJob(item.id)">接单</mt-button>
+                    </div>
+                    <div class="clear-float"></div>
+                  </div>
+                </div>
+
+                <div class="clear-float"></div>
+              </div>
+            </li>
+          </ul>
+          <div class="no-content" v-show="list.length<1">无符合条件的工单</div>
+          <div class="no-content" v-show="list.length>10 && loadConf.loadBottomConf.isFinish">已经到底了</div>
+        </mt-loadmore>
+      </div>
+    </div>
+  </transition>
+</template>
+
+<script>
+  import {Timeline, TimelineItem, TimelineTitle} from 'vue-cute-timeline'
+  import {MessageBox, Indicator, Toast} from 'mint-ui'
+  import Loading from '@/components/Loading'
+  import {getJobSearchList, getJob} from '@/api/job'
+
+  let isFromDetail = false
+  export default {
+    name: "SearchList",
+    components: {
+      Timeline,
+      TimelineItem,
+      TimelineTitle,
+      Loading
+    },
+    data() {
+      return {
+        list: [],
+        isLoading: true,
+        total: 50,
+        listQuery: {},
+        loadConf: {
+          loadTopConf: {
+            isFinish: false,  // 是否完成下拉
+            topPullText: '下拉刷新',
+            topDropText: '松开刷新',
+            topLoadingText: '刷新中'
+          },
+          loadBottomConf: {
+            isFinish: false,  // 是否完成上拉
+            bottomPullText: '',
+            bottomDropText: '释放获取内容',
+            bottomLoadingText: '加载中',
+            count: 1, // 模拟次数
+          }
+        }
+      }
+    },
+    mounted() {
+      this.listQuery = this.$route.query.listQuery
+      this.list = []
+      this.isLoading = true
+      this.loadTop()
+    },
+    beforeRouteEnter(to, from, next) {
+      if (from.name) {
+        if (from.name.indexOf('jobDetail') === -1) {
+          isFromDetail = false
+        } else {
+          isFromDetail = true
+        }
+      } else {
+        isFromDetail = false
+      }
+      next()
+    },
+    activated() {
+      if (isFromDetail) { // 来自详情页面
+        this.$refs.wrapper.scrollTop = this.$store.getters.pageYOffset;
+      } else { // 滚动到最顶，数据初始化
+        this.list = []
+        this.listQuery = this.$route.query.listQuery
+        this.isLoading = true
+        this.loadTop()
+        this.$refs.wrapper.scrollTop = 0
+      }
+    },
+    methods: {
+      loadTop() {
+        this.list = []
+        console.log('inHandleJobList:loadTop')
+        this.isLoading = true
+        this.flag = 0
+        this.$refs.loadmore.onTopLoaded()
+        this.listQuery.offset = 1
+        this.loadConf.loadBottomConf.isFinish = false
+        getJobSearchList(this.listQuery).then(response => {
+          this.listQuery.offset += 1
+          this.list = []
+          this.isLoading = false
+          for (let item of response.data.rows) {
+            item.showTimeline = false
+            this.list.push(item)
+          }
+          if (this.list.length >= this.total) {
+            this.loadConf.loadBottomConf.isFinish = true
+            this.$refs.loadmore.onBottomLoaded();
+          }
+        })
+      },
+      loadBottom() {
+        console.log('loadbottom')
+        if (this.list.length >= this.total) {
+          this.loadConf.loadBottomConf.isFinish = true
+          this.$refs.loadmore.onBottomLoaded();
+        } else {
+          getJobSearchList(this.listQuery).then(response => {
+            console.log('getJobSearchList')
+            this.listQuery.offset += 1
+            for (let item of response.data.rows) {
+              item.showTimeline = false
+              this.list.push(item)
+              console.log(this.list.length)
+            }
+            this.total = parseInt(response.data.total)
+            this.$refs.loadmore.onBottomLoaded();
+            this.isLoading = false
+          })
+        }
+      },
+      goJobDetail(id) {
+        this.$router.push({
+          path: `/jobDetail/${id}`
+        })
+      },
+      getJob(id){
+        MessageBox.confirm('确定要接单吗?').then(action => {
+          if(action=='confirm'){
+            getJob(id).then(response => {
+              if(response.code==200){
+                Toast({
+                  message: '接单成功',
+                  position: 'bottom',
+                })
+                this.loadTop()
+              }
+            })
+          }
+        })
+      }
+    }
+  }
+</script>
+
+<style lang="stylus" rel="stylesheet/stylus" scoped>
+  .joblist {
+    margin-top 50px
+    padding 0px 2vw
+    overflow: scroll;
+    //height: calc(100vh - 135px)
+    height: calc(100vh - 40px);
+  }
+
+  .list-li {
+    margin-top 1vw;
+    border 1px solid #f0f0f0
+    background-color #ffffff
+    min-height 80px
+  }
+
+  .job-card {
+    .card-left {
+      width 90%
+      float left
+      padding 15px 15px
+      .card-alarm {
+        margin-top 5px
+        font-size: 1rem
+        font-weight 500
+        color #f7615a
+      }
+      .card-wellcode {
+        margin-top 12px
+        font-size: 0.8rem
+      }
+      .card-welltype {
+        margin-left 10px
+        font-size 0.8rem
+        color #13ad00
+      }
+      .card-createtime {
+        margin-top 5px
+        float right
+        font-size 0.8rem
+        color #bbbbbb
+      }
+      .card-position {
+        margin-top 18px
+        font-size 0.8rem
+        line-height 0.9rem
+        color #646464
+      }
+    }
+    .timeline-right {
+      float right
+    }
+    .detail-btn {
+      height 1rem
+      text-align center
+      i {
+        font-size: 1rem
+      }
+    }
+  }
+
+  .wait-job-card {
+    .card-left {
+      width 90%
+      float left
+      padding 15px 15px
+      .card-alarm {
+        margin-top 5px
+        font-size: 1rem
+        font-weight 500
+        color #f7615a
+      }
+      .card-wellcode {
+        margin-top 12px
+        font-size: 0.8rem
+      }
+      .card-createtime {
+        margin-top 5px
+        float right
+        font-size 0.8rem
+        color #bbbbbb
+      }
+      .card-welltype {
+        margin-left 10px
+        font-size 0.8rem
+        color #13ad00
+      }
+      .card-info {
+        .card-position {
+          margin-top 18px
+          font-size 0.8rem
+          line-height 0.9rem
+          color #646464
+          width 70%
+          float: left;
+        }
+        .card-right {
+          height: 100%
+          width 70px;
+          padding-top: 1px
+          float: right
+          text-align: right
+          .mint-button {
+            /*margin-top:7px*/
+            /*margin-top 20px*/
+            margin-left 10px
+          }
+        }
+      }
+
+    }
+
+  }
+</style>

diff --git a/src/page/jobSearch/searchList.vue b/src/page/jobSearch/searchList.vue
new file mode 100644
index 0000000..3751755
--- /dev/null
+++ b/src/page/jobSearch/searchList.vue
@@ -0,0 +1,357 @@
+<template>
+  <transition name="slide">
+    <div class="index-container">
+      <mt-header class="header" title="工单查询" fixed>
+        <div slot="left">
+          <mt-button icon="back" @click="$router.back(-1)"></mt-button>
+        </div>
+      </mt-header>
+      <div class="joblist" ref="wrapper">
+        <Loading v-show="isLoading"></Loading>
+        <mt-loadmore
+          :top-method="loadTop"
+          :topPullText="loadConf.loadTopConf.topPullText"
+          :topDropText="loadConf.loadTopConf.topDropText"
+          :topLoadingText="loadConf.loadTopConf.topLoadingText"
+          :bottom-method="loadBottom"
+          :bottomAllLoaded="loadConf.loadBottomConf.isFinish"
+          :bottomPullText="loadConf.loadBottomConf.bottomPullText"
+          :bottomDropText="loadConf.loadBottomConf.bottomDropText"
+          :bottomLoadingText="loadConf.loadBottomConf.bottomLoadingText"
+          ref="loadmore"
+          class="loadmore-content"
+        >
+          <ul class="list-ul">
+            <li class="list-li" v-for="item in list" @click="goJobDetail(item.id)">
+              <div v-if="item.jobStatus!='0'" class="job-card">
+                <div class="card-brief">
+                  <div class="card-left">
+                    <div>
+                      <span class="card-alarm">{{item.alarmContentName}}</span>
+                      <span class="card-createtime">{{item.createTime}}</span>
+                    </div>
+                    <div class="card-wellcode">
+                      <span>{{item.wellCode}}</span>
+                    </div>
+                    <div class="card-position">
+                      <span>{{item.position}}</span>
+                    </div>
+                  </div>
+                  <div class="clear-float"></div>
+                </div>
+                <div class="time-line">
+                  <timeline>
+                    <timeline-title v-if="item.jobStatus=='2'" bg-color="#26a2ff">{{item.jobBelongTo}}正在处理...
+                    </timeline-title>
+                    <timeline-title v-if="item.jobStatus=='1'" bg-color="#26a2ff">{{item.jobBelongTo}}正在确认...
+                    </timeline-title>
+                    <timeline-title v-if="item.jobStatus=='3'" bg-color="#26a2ff">{{item.jobBelongTo}}已完成
+                    </timeline-title>
+                    <timeline-title v-if="item.jobStatus=='4'" bg-color="#26a2ff">{{item.jobBelongTo}}已取消
+                    </timeline-title>
+                    <div v-if="item.showTimeline">
+                      <timeline-item>
+                        <span class="timeline-left">{{item.createTime}}</span> <span class="timeline-right">发起工单</span>
+                      </timeline-item>
+                      <timeline-item v-if="item.getJobTime!=''">
+                        <span class="timeline-left">{{item.getJobTime}}</span> <span class="timeline-right">{{item.getJobPerson}}接单</span>
+                      </timeline-item>
+                      <timeline-item v-if="item.confirmJobTime!=''">
+                        <span class="timeline-left">{{item.confirmJobTime}}</span> <span class="timeline-right">{{item.confirmJobPerson}}确认工单</span>
+                      </timeline-item>
+                      <timeline-item v-if="item.jobStatus=='3' && item.handleJobTime!=''">
+                        <span class="timeline-left">{{item.handleJobTime}}</span> <span class="timeline-right">{{item.handleJobPerson}}完成工单</span>
+                      </timeline-item>
+                      <timeline-item v-if="item.jobStatus=='4' && item.handleJobTime!=''">
+                        <span class="timeline-left">{{item.handleJobTime}}</span> <span class="timeline-right">{{item.handleJobPerson}}取消工单</span>
+                      </timeline-item>
+                      <div class="detail-btn" @click.stop="item.showTimeline=!item.showTimeline">
+                        <i class="iconfont icon-fanhui3"></i>
+                      </div>
+                    </div>
+                    <div class="detail-btn" v-else @click.stop="item.showTimeline=!item.showTimeline">
+                      <i class="iconfont icon-31xiala"></i>
+                    </div>
+                  </timeline>
+                </div>
+              </div>
+              <div v-else class="wait-job-card">
+                <div class="card-left">
+                  <div>
+                    <span class="card-alarm">{{item.alarmContentName}}</span>
+                    <span class="card-createtime">{{item.createTime}}</span>
+                  </div>
+                  <div class="card-wellcode">
+                    <span>{{item.wellCode}}</span>
+                  </div>
+                  <div class="card-info">
+                    <div class="card-position">
+                      <span>{{item.position}}</span>
+                    </div>
+                    <div class="card-right">
+                      <mt-button type="primary" size="small" @click.stop="getJob(item.id)">接单</mt-button>
+                    </div>
+                    <div class="clear-float"></div>
+                  </div>
+                </div>
+
+                <div class="clear-float"></div>
+              </div>
+            </li>
+          </ul>
+          <div class="no-content" v-show="list.length<1">无符合条件的工单</div>
+          <div class="no-content" v-show="list.length>10 && loadConf.loadBottomConf.isFinish">已经到底了</div>
+        </mt-loadmore>
+      </div>
+    </div>
+  </transition>
+</template>
+
+<script>
+  import {Timeline, TimelineItem, TimelineTitle} from 'vue-cute-timeline'
+  import {MessageBox, Indicator, Toast} from 'mint-ui'
+  import Loading from '@/components/Loading'
+  import {getJobSearchList, getJob} from '@/api/job'
+
+  let isFromDetail = false
+  export default {
+    name: "SearchList",
+    components: {
+      Timeline,
+      TimelineItem,
+      TimelineTitle,
+      Loading
+    },
+    data() {
+      return {
+        list: [],
+        isLoading: true,
+        total: 50,
+        listQuery: {},
+        loadConf: {
+          loadTopConf: {
+            isFinish: false,  // 是否完成下拉
+            topPullText: '下拉刷新',
+            topDropText: '松开刷新',
+            topLoadingText: '刷新中'
+          },
+          loadBottomConf: {
+            isFinish: false,  // 是否完成上拉
+            bottomPullText: '',
+            bottomDropText: '释放获取内容',
+            bottomLoadingText: '加载中',
+            count: 1, // 模拟次数
+          }
+        }
+      }
+    },
+    mounted() {
+      this.listQuery = this.$route.query.listQuery
+      this.list = []
+      this.isLoading = true
+      this.loadTop()
+    },
+    beforeRouteEnter(to, from, next) {
+      if (from.name) {
+        if (from.name.indexOf('jobDetail') === -1) {
+          isFromDetail = false
+        } else {
+          isFromDetail = true
+        }
+      } else {
+        isFromDetail = false
+      }
+      next()
+    },
+    activated() {
+      if (isFromDetail) { // 来自详情页面
+        this.$refs.wrapper.scrollTop = this.$store.getters.pageYOffset;
+      } else { // 滚动到最顶，数据初始化
+        this.list = []
+        this.listQuery = this.$route.query.listQuery
+        this.isLoading = true
+        this.loadTop()
+        this.$refs.wrapper.scrollTop = 0
+      }
+    },
+    methods: {
+      loadTop() {
+        this.list = []
+        console.log('inHandleJobList:loadTop')
+        this.isLoading = true
+        this.flag = 0
+        this.$refs.loadmore.onTopLoaded()
+        this.listQuery.offset = 1
+        this.loadConf.loadBottomConf.isFinish = false
+        getJobSearchList(this.listQuery).then(response => {
+          this.listQuery.offset += 1
+          this.list = []
+          this.isLoading = false
+          for (let item of response.data.rows) {
+            item.showTimeline = false
+            this.list.push(item)
+          }
+          if (this.list.length >= this.total) {
+            this.loadConf.loadBottomConf.isFinish = true
+            this.$refs.loadmore.onBottomLoaded();
+          }
+        })
+      },
+      loadBottom() {
+        console.log('loadbottom')
+        if (this.list.length >= this.total) {
+          this.loadConf.loadBottomConf.isFinish = true
+          this.$refs.loadmore.onBottomLoaded();
+        } else {
+          getJobSearchList(this.listQuery).then(response => {
+            console.log('getJobSearchList')
+            this.listQuery.offset += 1
+            for (let item of response.data.rows) {
+              item.showTimeline = false
+              this.list.push(item)
+              console.log(this.list.length)
+            }
+            this.total = parseInt(response.data.total)
+            this.$refs.loadmore.onBottomLoaded();
+            this.isLoading = false
+          })
+        }
+      },
+      goJobDetail(id) {
+        this.$router.push({
+          path: `/jobDetail/${id}`
+        })
+      },
+      getJob(id){
+        MessageBox.confirm('确定要接单吗?').then(action => {
+          if(action=='confirm'){
+            getJob(id).then(response => {
+              if(response.code==200){
+                Toast({
+                  message: '接单成功',
+                  position: 'bottom',
+                })
+                this.loadTop()
+              }
+            })
+          }
+        })
+      }
+    }
+  }
+</script>
+
+<style lang="stylus" rel="stylesheet/stylus" scoped>
+  .joblist {
+    margin-top 50px
+    padding 0px 2vw
+    overflow: scroll;
+    //height: calc(100vh - 135px)
+    height: calc(100vh - 40px);
+  }
+
+  .list-li {
+    margin-top 1vw;
+    border 1px solid #f0f0f0
+    background-color #ffffff
+    min-height 80px
+  }
+
+  .job-card {
+    .card-left {
+      width 90%
+      float left
+      padding 15px 15px
+      .card-alarm {
+        margin-top 5px
+        font-size: 1rem
+        font-weight 500
+        color #f7615a
+      }
+      .card-wellcode {
+        margin-top 12px
+        font-size: 0.8rem
+      }
+      .card-welltype {
+        margin-left 10px
+        font-size 0.8rem
+        color #13ad00
+      }
+      .card-createtime {
+        margin-top 5px
+        float right
+        font-size 0.8rem
+        color #bbbbbb
+      }
+      .card-position {
+        margin-top 18px
+        font-size 0.8rem
+        line-height 0.9rem
+        color #646464
+      }
+    }
+    .timeline-right {
+      float right
+    }
+    .detail-btn {
+      height 1rem
+      text-align center
+      i {
+        font-size: 1rem
+      }
+    }
+  }
+
+  .wait-job-card {
+    .card-left {
+      width 90%
+      float left
+      padding 15px 15px
+      .card-alarm {
+        margin-top 5px
+        font-size: 1rem
+        font-weight 500
+        color #f7615a
+      }
+      .card-wellcode {
+        margin-top 12px
+        font-size: 0.8rem
+      }
+      .card-createtime {
+        margin-top 5px
+        float right
+        font-size 0.8rem
+        color #bbbbbb
+      }
+      .card-welltype {
+        margin-left 10px
+        font-size 0.8rem
+        color #13ad00
+      }
+      .card-info {
+        .card-position {
+          margin-top 18px
+          font-size 0.8rem
+          line-height 0.9rem
+          color #646464
+          width 70%
+          float: left;
+        }
+        .card-right {
+          height: 100%
+          width 70px;
+          padding-top: 1px
+          float: right
+          text-align: right
+          .mint-button {
+            /*margin-top:7px*/
+            /*margin-top 20px*/
+            margin-left 10px
+          }
+        }
+      }
+
+    }
+
+  }
+</style>
diff --git a/src/page/jobSearch/searchPage.vue b/src/page/jobSearch/searchPage.vue
new file mode 100644
index 0000000..30b124c
--- /dev/null
+++ b/src/page/jobSearch/searchPage.vue
@@ -0,0 +1,517 @@
+<template>
+  <transition name="slide">
+    <div class="index-container">
+      <Loading v-show="isLoading"/>
+      <!--标题-->
+      <mt-header class="header" title="工单查询" fixed>
+        <div slot="left">
+          <mt-button icon="back" @click="$router.back(-1)"></mt-button>
+        </div>
+      </mt-header>
+      <div class="listbody">
+        <div class="well-info-card">
+          <!--<div class="well-title">-->
+          <mt-field label="井编号" placeholder="请输入井编号" v-model="listQuery.keywords"></mt-field>
+          <div class="well-info">
+            <div class="search-name">告警内容</div>
+            <div class="search-value">
+              <span class="search-btn" v-for="item of alarmContentList">
+                <div class="select-item" :class="listQuery.alarmContent==item.value?'selected-item':''"
+                     @click="selectAlarmContentType(item.value)">{{item.name}}</div>
+              </span>
+            </div>
+          </div>
+          <div class="well-info">
+            <div class="search-name">告警等级</div>
+            <div class="search-value">
+              <span class="search-btn" v-for="item of levelList">
+                <div class="select-item" :class="listQuery.alarmLevel==item.value?'selected-item':''"
+                     @click="selectAlarmLevel(item.value)">{{item.name}}</div>
+              </span>
+            </div>
+          </div>
+          <div class="well-info">
+            <div class="search-name">工单状态</div>
+            <div class="search-value">
+              <span class="search-btn" v-for="item of jobStatusList">
+                <div class="select-item" :class="listQuery.jobStatus==item.value?'selected-item':''"
+                     @click="selectJobStatus(item.value)">{{item.name}}</div>
+              </span>
+            </div>
+          </div>
+          <!--<mt-field label="接单开始时间" placeholder="" v-model="listQuery."></mt-field>-->
+          <mt-cell title="创建开始时间" :value="listQuery.beginTime"
+                   @click.native="openTimeSelectWindow('beginTimePicker')"></mt-cell>
+          <mt-cell title="创建结束时间" :value="listQuery.endTime"
+                   @click.native="openTimeSelectWindow('endTimePicker')"></mt-cell>
+          <!--<mt-cell title="接单时间" :value="listQuery.getJobBeginTime" @click.native="openTimeSelectWindow('getBeginTimePicker')"></mt-cell>-->
+          <!--<mt-cell title="" :value="listQuery.getJobEndTime" @click.native="openTimeSelectWindow('getEndTimePicker')"></mt-cell>-->
+          <!--<mt-cell title="应接单开始时间" :value="listQuery.shouldGetBeginTime" @click.native="openTimeSelectWindow('shouldGetBeginTimePicker')"></mt-cell>-->
+          <!--<mt-cell title="应接单结束时间" :value="listQuery.shouldGetEndTime" @click.native="openTimeSelectWindow('shouldGetEndTimePicker')"></mt-cell>-->
+          <!--<mt-cell title="处理开始时间" :value="listQuery.handleJobBeginTime" @click.native="openTimeSelectWindow('handleBeginTimePicker')"></mt-cell>-->
+          <!--<mt-cell title="处理结束时间" :value="listQuery.handleJobEndTime" @click.native="openTimeSelectWindow('handleEndTimePicker')"></mt-cell>-->
+          <!--<mt-cell title="应处理开始时间" :value="listQuery.shouldHandleBeginTime" @click.native="openTimeSelectWindow('shouldHandleBeginTimePicker')"></mt-cell>-->
+          <!--<mt-cell title="应处理结束时间" :value="listQuery.shouldHandleEndTime" @click.native="openTimeSelectWindow('shouldHandleEndTimePicker')"></mt-cell>-->
+          <!--<div class="well-info">-->
+          <!--<div class="search-name">接单开始时间</div>-->
+          <!--<div class="search-value">-->
+
+          <!--</div>-->
+          <!--</div>-->
+          <div class="row-block">
+            <mt-button class="search-btn" type="primary" @click="beginSearch()">查询</mt-button>
+            <mt-button class="clear-btn" type="default" @click="cleanSearch()">清空</mt-button>
+          </div>
+
+        </div>
+      </div>
+      <!--<mt-popup-->
+      <!--v-model="popupVisible"-->
+      <!--position="bottom">-->
+      <!--<mt-picker :slots="levelList" @change="onValuesChange"></mt-picker>-->
+      <!--</mt-popup>-->
+      <!--时间选择器-->
+      <div>
+        <!--创建开始时间-->
+        <mt-datetime-picker
+          ref="beginTimePicker"
+          type="date"
+          year-format="{value} 年"
+          month-format="{value} 月"
+          date-format="{value} 日"
+          v-model="dateForm.beginTime"
+          @confirm="handleConfirm('beginTime')">
+        </mt-datetime-picker>
+        <!--创建结束时间-->
+        <mt-datetime-picker
+          ref="endTimePicker"
+          type="date"
+          year-format="{value} 年"
+          month-format="{value} 月"
+          date-format="{value} 日"
+          v-model="dateForm.endTime"
+          @confirm="handleConfirm('endTime')">
+        </mt-datetime-picker>
+        <!--接单开始时间-->
+        <mt-datetime-picker
+          ref="getBeginTimePicker"
+          type="date"
+          year-format="{value} 年"
+          month-format="{value} 月"
+          date-format="{value} 日"
+          v-model="dateForm.getJobBeginTime"
+          @confirm="handleConfirm('getJobBeginTime')">
+        </mt-datetime-picker>
+        <!--接单结束时间-->
+        <mt-datetime-picker
+          ref="getEndTimePicker"
+          type="date"
+          year-format="{value} 年"
+          month-format="{value} 月"
+          date-format="{value} 日"
+          v-model="dateForm.getJobEndTime"
+          @confirm="handleConfirm('getJobEndTime')">
+        </mt-datetime-picker>
+        <!--应接单开始时间-->
+        <mt-datetime-picker
+          ref="shouldGetBeginTimePicker"
+          type="date"
+          year-format="{value} 年"
+          month-format="{value} 月"
+          date-format="{value} 日"
+          v-model="dateForm.shouldGetBeginTime"
+          @confirm="handleConfirm('shouldGetBeginTime')">
+        </mt-datetime-picker>
+        <!--应接单结束时间-->
+        <mt-datetime-picker
+          ref="shouldGetEndTimePicker"
+          type="date"
+          year-format="{value} 年"
+          month-format="{value} 月"
+          date-format="{value} 日"
+          v-model="dateForm.shouldGetEndTime"
+          @confirm="handleConfirm('shouldGetEndTime')">
+        </mt-datetime-picker>
+        <!--处理开始时间-->
+        <mt-datetime-picker
+          ref="handleBeginTimePicker"
+          type="date"
+          year-format="{value} 年"
+          month-format="{value} 月"
+          date-format="{value} 日"
+          v-model="dateForm.handleJobBeginTime"
+          @confirm="handleConfirm('handleJobBeginTime')">
+        </mt-datetime-picker>
+        <!--处理结束时间-->
+        <mt-datetime-picker
+          ref="handleEndTimePicker"
+          type="date"
+          year-format="{value} 年"
+          month-format="{value} 月"
+          date-format="{value} 日"
+          v-model="dateForm.handleJobEndTime"
+          @confirm="handleConfirm('handleJobEndTime')">
+        </mt-datetime-picker>
+        <!--处理开始时间-->
+        <mt-datetime-picker
+          ref="shouldHandleBeginTimePicker"
+          type="date"
+          year-format="{value} 年"
+          month-format="{value} 月"
+          date-format="{value} 日"
+          v-model="dateForm.shouldHandleBeginTime"
+          @confirm="handleConfirm('shouldHandleBeginTime')">
+        </mt-datetime-picker>
+        <!--处理结束时间-->
+        <mt-datetime-picker
+          ref="shouldHandleEndTimePicker"
+          type="date"
+          year-format="{value} 年"
+          month-format="{value} 月"
+          date-format="{value} 日"
+          v-model="dateForm.shouldHandleEndTime"
+          @confirm="handleConfirm('shouldHandleEndTime')">
+        </mt-datetime-picker>
+      </div>
+    </div>
+  </transition>
+</template>
+
+<script>
+  import {getAlarmContentType, getJobStatus} from '@/api/job'
+  import {formatDate} from '@/utils/dateutils'
+  import Loading from '@/components/Loading'
+  let isFromDetail = false // 是否来自SearchList
+  export default {
+    name: "searchPage",
+    components: {
+      Loading
+    },
+    data() {
+      return {
+        listQuery: {
+          keywords: '', // 关键字
+          alarmLevel: '', // 告警等级
+          alarmType: '1', // 告警类型
+          alarmContent: '', // 告警内容
+          jobStatus: '', // 工单状态
+          beginTime: '点击选择开始时间', // 工单开始时间
+          endTime: '点击选择结束时间', // 工单结束时间
+          getJobBeginTime: '',// 接单开始时间
+          getJobEndTime: '',// 接单结束时间
+          shouldGetBeginTime: '',// 应接单开始时间
+          shouldGetEndTime: '',// 应接单结束时间
+          handleJobBeginTime: '',// 处理开始时间
+          handleJobEndTime: '',// 接单结束时间
+          shouldHandleBeginTime: '',// 应处理开始时间
+          shouldHandleEndTime: '',// 应处理结束时间
+          offset: 1,
+          limit: 20,
+          sort: '',
+          order: ''
+        }, // 筛选条件表单
+        dateForm: {
+          beginTime: new Date(),// 接单开始时间
+          endTime: new Date(),// 接单结束时间
+          etJobBeginTime: new Date(),// 接单开始时间
+          getJobEndTime: new Date(),// 接单结束时间
+          shouldGetBeginTime: '',// 应接单开始时间
+          shouldGetEndTime: '',// 应接单结束时间
+          handleJobBeginTime: '',// 处理开始时间
+          handleJobEndTime: '',// 接单结束时间
+          shouldHandleBeginTime: '',// 应处理开始时间
+          shouldHandleEndTime: '',// 应处理结束时间
+        },
+        levelList: [
+          {name: '全部', value: ''},
+          {name: '一级', value: 1},
+          {name: '二级', value: 2},
+          {name: '三级', value: 3}
+        ],// 告警等级列表
+        isLoading: true, //加载动画
+        alarmContentList: [], // 告警内容类型列表
+        jobStatusList: [] // 工单状态列表
+      }
+    },
+    beforeRouteEnter(to, from, next) {
+      if (from.name) {
+        if (from.name.indexOf('searchList') === -1) {
+          isFromDetail = false
+        } else {
+          isFromDetail = true
+        }
+      } else {
+        isFromDetail = false
+      }
+      next()
+    },
+    mounted() {
+      this.isLoading = true
+      this.fetchJobStatus()
+      this.fetchAlarmContentType()
+    },
+    methods: {
+      // 获取工单状态列表
+      fetchJobStatus() {
+        const jobStatusList = [{
+          name: '全部',
+          value: ''
+        }]
+        getJobStatus().then(response => {
+          this.jobStatusList = [...jobStatusList, ...response.data]
+        })
+      },
+      fetchAlarmContentType() {
+        this.alarmContentList = [{
+          name: '全部',
+          value: ''
+        }]
+        getAlarmContentType('1').then(response => {
+          // const supportDeviceTypes = this.$store.getters.deviceTypes
+          for (const item of response.data.list) {
+            // if (supportDeviceTypes.indexOf(item.deviceType) !== -1) {
+            this.alarmContentList.push(item)
+            this.isLoading = false
+            // }
+          }
+        })
+      },
+      // 打开选择时间弹窗
+      openTimeSelectWindow(timePicker) {
+        this.$refs[timePicker].open()
+      },
+      // 时间选择确定后，格式化
+      handleConfirm(item) {
+        console.log(this.dateForm[item])
+        this.listQuery[item] = formatDate(this.dateForm[item])
+      },
+      selectAlarmContentType(value) {
+        this.listQuery.alarmContent = value
+      },
+      selectAlarmLevel(value) {
+        this.listQuery.alarmLevel = value
+      },
+      selectJobStatus(value) {
+        this.listQuery.jobStatus = value
+      },
+      beginSearch() {
+        const listQuery = this.listQuery
+        if (listQuery.beginTime === '点击选择开始时间') {
+          listQuery.beginTime = ''
+        }
+        if (listQuery.endTime === '点击选择结束时间') {
+          listQuery.endTime = ''
+        }
+        this.$router.push({name: 'searchList', query: {listQuery}})
+      },
+      cleanSearch() {
+        this.listQuery = {
+          keywords: '', // 关键字
+          alarmLevel: '', // 告警等级
+          alarmType: '', // 告警类型
+          alarmContent: '', // 告警内容
+          jobStatus: '', // 工单状态
+          beginTime: '点击选择开始时间', // 工单开始时间
+          endTime: '点击选择结束时间', // 工单结束时间
+          getJobBeginTime: '',// 接单开始时间
+          getJobEndTime: '',// 接单结束时间
+          shouldGetBeginTime: '',// 应接单开始时间
+          shouldGetEndTime: '',// 应接单结束时间
+          handleJobBeginTime: '',// 处理开始时间
+          handleJobEndTime: '',// 接单结束时间
+          shouldHandleBeginTime: '',// 应处理开始时间
+          shouldHandleEndTime: '',// 应处理结束时间
+          offset: 1,
+          limit: 20,
+          sort: '',
+          order: ''
+        }
+      }
+    }
+  }
+</script>
+
+<style lang="stylus" rel="stylesheet/stylus" scoped>
+  .listbody {
+    margin-top 40px
+    padding 0.4rem 0
+    .well-info-card {
+      margin 5px 1vw 0px 1vw
+      background-color #ffffff
+      border 1px solid #f0f0f0
+      border-radius 4px
+      padding 1rem 1rem
+      .well-title {
+        padding-left 1rem
+        line-height 2rem
+        margin-bottom 0.6rem
+        .title-left {
+          font-size 1.2rem
+          font-weight 600
+          color: #000
+        }
+        .title-right {
+          font-size 0.8rem
+          float right
+          margin-right 1rem
+          color: #a7a7a7
+        }
+      }
+      .well-info {
+        overflow auto
+        /*border-bottom 1px solid #f0f0f0*/
+        padding 0.5rem 1rem 0rem 0rem
+        line-height: 1.5rem
+        /*font-size: 1rem*/
+        .search-btn {
+          margin: 5px
+          line-height 40px
+          font-size:16px
+          float left
+        }
+        .search-name {
+          line-height 30px
+          font-size 16px
+          font-weight 400
+          margin-left 15px
+        }
+        .search-value {
+          margin-left 10px
+        }
+        .select-item {
+          display inline-block
+          float: left
+          width: auto
+          background-color #f6f6f6
+          padding 5px 10px
+          line-height 20px
+          border-radius 3px
+          font-size: 15px
+        }
+        .selected-item {
+          background-color #246af7
+          color: #ffffff
+        }
+        .info-name {
+          float left
+        }
+        .info-value {
+          float right
+          color #4b4b4b
+          max-width 70%
+          text-align right
+        }
+        .text-red {
+          color: red
+        }
+        .text-blue {
+          color: #1d55c6
+        }
+      }
+    }
+    .well-info-button {
+      overflow auto
+      padding 0.2rem 1rem 0.2rem 1rem
+      line-height: 1.2rem
+      font-size: 0.9rem
+      .info-name {
+        float left
+      }
+      .info-value {
+        float right
+        color #4b4b4b
+        max-width 60%
+        text-align right
+      }
+    }
+    .mint-cell .mint-cell-wrapper .mint-cell-title .mint-cell-text{
+      font-size: 10px !important
+    }
+    .mint-cell {
+      font-size: 10px !important
+      .mint-cell-wrapper .mint-cell-title {
+        font-size: 10px !important
+        .mint-cell-text {
+          font-size: 10px !important
+        }
+      }
+    }
+    .well-info:last-child {
+      border-bottom none
+    }
+    textarea {
+      width: 80vw
+      margin-left 5px
+    }
+    .img-area {
+      padding 0.5rem 0.5rem
+    }
+    .imgzip {
+      height 20vw
+      margin 0.2rem
+    }
+    .firststate {
+      padding-top 0.4rem
+    }
+    .button-div {
+      text-align center
+      padding 0px 15vw
+      .mint-button {
+        width 30vw
+        margin 10px 2vw
+      }
+      .mint-button--primary {
+        background-color #1d55c6
+      }
+      .mint-button--default {
+        background-color #ffffff
+      }
+    }
+    .mint-popup {
+      width: 50vw
+    }
+    .mint-cell {
+      diaplay: inline
+    }
+    .mint-cell-wrapper {
+      float left
+      width 30%
+    }
+    .mint-radiolist-label {
+      font-size: 0.8rem
+    }
+    .grey {
+      color: #7c7c7c
+      font-size 0.8rem
+    }
+    .img-show {
+      width: 50px
+      height: 50px
+      margin: 10px
+    }
+    .imageShowPopup {
+      width: 80%
+    }
+  }
+
+  .row-block {
+    margin-top 20px 0
+    padding-top 15px
+    .mint-button--primary {
+      background-color #1d55c6
+    }
+    .search-btn{
+      width:60%
+      margin:10px
+    }
+    .clear-btn{
+      width:30%
+    }
+    button {
+      /*display block*/
+      /*width 90%*/
+      /*margin 10px 5px*/
+    }
+  }
+</style>
+