Skip to content

B
banManager
Commit 14f20e30 authored by 余苗苗's avatar 余苗苗
Browse files
Options

改为静态

parent 88f4bddf
Pipeline #144 canceled with stages
      Hide whitespace changes
      Inline Side-by-side
      Showing with 454 additions and 0 deletions
      new/message.html 0 → 100644
      View file @ 14f20e30
      message.html
      \ No newline at end of file
      new/order.html 0 → 100644
      View file @ 14f20e30
      <!DOCTYPE html>
      <html>
      <head>
      <meta charset="UTF-8">
      <!-- 引入样式 -->
      <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
      <link rel="stylesheet" href="./static/css/main.css">
      <link rel="stylesheet" href="./static/css/order.css">
      </head>
      <body>
      <div id='app'>
      <div class="header">
      <div class="header-content">
      <div class="header-logo">
      <img src="./static/images/dog.jpeg" alt="" width="42px" height="42px">
      <p class='header-title'>Hi!隔壁老王</p>
      </div>
      <div class="header-side">
      <el-menu mode="horizontal" :router="false" :unique-opened="true" @select='selectRoute' :default-active="onRoutes" background-color="#708DF1" text-color="#ffffff" active-text-color="#708DF1" class='mian_side'>
      <el-menu-item :index="item.value" :key='index' v-for='(item,index) in headmenus' >
      <i :class="item.icon"></i>{{item.name}}
      </el-menu-item>
      </el-menu>
      </div>
      </div>
      </div>
      <div class="content">
      <div class="order">
      <div class='order-left'>
      <div class="order-title">工单中心</div>
      <el-menu :default-active="activeIndex" :unique-opened="false" background-color="#ffffff" text-color="#666" class='order-menu'>
      <el-menu-item :index="item.value" :key='index' v-for='(item,index) in menus' >
      <i :class="item.icon"></i>
      {{item.name}}
      </el-menu-item>
      </el-menu>
      </div>
      <div class="order-right">
      <div class="all-order">
      <div class="all-order-serch">
      <el-select class="seach-select" v-model="search.time" @change='' placeholder="创建时间">
      <el-option :label="item.label" :value="item.value" :key='item.label' v-for='(item,index) in search.options1'></el-option>
      </el-select>
      <el-select class="seach-select" v-model="search.type" @change='' placeholder="选择品类">
      <el-option :label="item.label" :value="item.value" :key='item.label' v-for='(item,index) in search.options2'></el-option>
      </el-select>
      <el-input class="seach-input" v-model='search.name' prefix-icon="el-icon-search" placeholder='请输入项目名、合作商名查询'></el-input>
      <el-button type='primary' class='button-color'>搜索</el-button>
      <span class='button-icon'><i class='el-icon-d-caret'></i></span>
      <span class='button-icon'><i class='el-icon-d-caret'></i></span>
      <el-button type='primary' class='button-color addbutton' @click='$router.push({name:"addOrder"})'>新建工单</el-button>
      </div>
      <div class="all-orders-box">
      <div class="all-order-content">
      <div class="all-order-box" v-for='(item,index) in tableData' :key='index' @click='checkDetail(item)'>
      <div class="all-box-top">
      <span class='type'>保内</span>
      美的洗衣机--清理
      <div class="all-box-topright">
      <i class='el-icon-share' @click.stop=''></i>
      <i class='el-icon-star-on' @click.stop=''></i>
      <i class='el-icon-news' @click.stop=''></i>
      </div>
      </div>
      <div class="all-box-bottom">
      <el-row>
      <el-col :span="8">
      <div class="all-box-mess1">
      <p>张先生 15676758907</p>
      <span>广东 深圳 福田 深南大道1102号招商大厦1102房</span>
      </div>
      </el-col>
      <el-col :span="8">
      <div class="all-box-mess2">
      <p>
      机型：
      <span>KFR-35GW/NhEaB1W（2台）</span>
      </p>
      <p>授权点：<span>精诚美好生活维修</span></p>
      </div>
      </el-col>
      <el-col :span="6">
      <div class="all-box-mess3">
      <p>
      创建时间：<span>05-06 11:09</span>
      </p>
      <p>
      已 创 建：<span>23时18分</span>
      </p>
      </div>
      </el-col>
      <el-col :span="2">
      <span class='all-box-status'>{{item.statusText}}</span>
      </el-col>
      </el-row>
      </div>
      </div>
      </div>
      </div>
      <div class="table_bottm">
      <!-- <el-pagination @current-change="handleCurrentChange" background :current-page="table.current_page" layout="total, prev, pager, next" :page-size="15" :pager-count="table.page_count" :total="table.total">
      </el-pagination> -->
      </div>
      <!-- <component :is="modal" @close="closeChild" :modalData="modalData"></component> -->
      </div>
      </div>
      </div>
      </div>
      </div>
      </body>
      <!-- 先引入 Vue -->
      <script src="https://unpkg.com/vue/dist/vue.js"></script>
      <!-- 引入组件库 -->
      <script src="https://unpkg.com/element-ui/lib/index.js"></script>
      <script>
      new Vue({
      el: '#app',
      data: function() {
      return {
      onRoutes:'./order.html',
      headmenus:[
      {name:'首页',value:'./main.html',icon:'el-icon-menu'},
      {name:'工单',value:'./order.html',icon:'el-icon-tickets'},
      {name:'结算',value:'./settlement.html',icon:'el-icon-printer'},
      {name:'合作',value:'./cooperate.html',icon:'el-icon-refresh'},
      {name:'消息',value:'./message.html',icon:'el-icon-service'},
      {name:'设置',value:'./set.html',icon:'el-icon-setting'},
      ],
      activeIndex:'9',tabindex:'9',modal:null,
      menus:[
      {name:'待派单',value:'1',icon:'el-icon-upload2'},
      {name:'未分配',value:'2',icon:'el-icon-sort'},
      {name:'未预约',value:'3',icon:'el-icon-date'},
      {name:'未完工',value:'4',icon:'el-icon-warning'},
      {name:'超约未完工',value:'5',icon:'el-icon-upload'},
      {name:'未确认',value:'6',icon:'el-icon-question'},
      {name:'已退回',value:'7',icon:'el-icon-news'},
      {name:'取消工单',value:'8',icon:'el-icon-close'},
      {name:'所有工单',value:'9',icon:'el-icon-tickets'},
      ],
      search:{
      type:'',time:'',options1:[],options2:[],name:''
      },
      tableData:[
      {id:'1',statusText:'待派单'},
      {id:'2',statusText:'待分配'},
      {id:'3',statusText:'待完工'},
      {id:'4',statusText:'待确权'},
      {id:'5',statusText:'已完成'},
      {id:'6',statusText:'已退回'}
      ],
      table:{
      current_page:1,page_count:7,total:50,
      },
      modal:null,modalData:{},
      }
      },
      methods:{
      handleSelect:function(){
      },
      selectRoute:function(val){
      }
      }
      })
      </script>
      </html>
      \ No newline at end of file
      new/set.html 0 → 100644
      View file @ 14f20e30
      set.html
      \ No newline at end of file
      new/settlement.html 0 → 100644
      View file @ 14f20e30
      settlement.html
      \ No newline at end of file
      new/static/css/main.css 0 → 100644
      View file @ 14f20e30
      *{
      margin:0;
      padding:0;
      font-size: 14px;
      }
      html,body,#app,.wrapper{
      width:100%;
      height:100%;
      overflow: hidden;
      background: #F5F5F5;
      position: relative;
      }
      body{
      font-family: "microsoft yahei" !important;
      }
      a{
      text-decoration: none
      }
      button,.el-button{
      font-family: "microsoft yahei" !important;
      }
      .cursor{
      cursor: pointer;
      }
      .text_center{
      text-align: center;
      }
      .primary_btcolor{
      background: #5874D8;
      border: #5874D8;
      }
      .el-pagination.is-background .el-pager li:not(.disabled).active{
      background-color: #5874D8;
      }
      .background-blue{
      background: #5874D8;
      }
      .text-white{
      color: #ffffff;
      }
      .el-dialog__wrapper{
      overflow: hidden !important;
      }
      .el-dialog__body{
      padding:30px 0 !important;
      }
      .el-dialog__header{
      background: #6C8BF8 !important;
      }
      .el-dialog__header .el-dialog__title, .el-dialog__header .el-dialog__headerbtn i{
      color: #ffffff !important;
      }
      .header{
      height:60px;
      background:rgba(112,141,241,1);
      }
      .header-content{
      width: 1400px;
      height: 100%;
      margin: auto;
      }
      .header-logo{
      width: 198px;height: 100%;background:rgba(72,109,237,1);float: left;
      }
      .header-logo img{
      margin-top: 10px;
      margin-left: 10px;
      border-radius: 50%;
      float: left;
      }
      .header-title{
      height: 100%;
      color: rgba(255,255,255,1);
      float: left;
      line-height: 60px;
      margin-left: 10px;
      }
      .header-side{
      float: right;
      height: 100%;
      line-height: 60px;
      }
      .header .header-side .mian_side{
      height: 40px;
      overflow: hidden;
      margin-top: 20px;
      border-bottom: none;
      }
      .header .header-side .mian_side .el-menu-item{
      line-height: 3;
      height: 40px;
      border-top-left-radius: 5px;
      border-top-right-radius: 5px;
      color: #ffffff;
      }
      .header .header-side .mian_side .el-menu-item i{
      color: #ffffff
      }
      .header .header-side .mian_side .el-menu-item.is-active{
      border-bottom: 2px solid #F5F5F5;
      color: #708DF1;
      background-color: #F5F5F5 !important;
      border-bottom-color: #F5F5F5 !important;
      border-top-left-radius: 5px;
      border-top-right-radius: 5px;
      }
      .header .header-side .mian_side .el-menu-item.is-active i{
      color: #708DF1
      }
      .content{
      /*background: #ffffff;*/
      /*width: 1400px;*/
      margin: auto;
      position: absolute;
      top: 80px;
      bottom: 15px;
      left: 0;
      right: 0;
      /*overflow: auto;*/
      }
      \ No newline at end of file
      new/static/css/order.css 0 → 100644
      View file @ 14f20e30
      .order{
      width: 1400px;
      height: 100%;
      margin: auto;
      }
      .order-left{
      width: 198px;
      height: 100%;
      background: #ffffff;
      float: left;
      }
      .order-left .order-title{
      color: #5874D8;
      text-align: center;
      font-size: 18px;
      height: 64px;
      line-height: 64px;
      border-bottom: 1px solid #ececec;
      }
      .order-menu .el-menu-item.is-active{
      background-color: rgba(88,116,216,0.1) !important;
      position: relative;
      }
      .order-menu .el-menu-item.is-active:before{
      content: '';
      position: absolute;
      width: 3px;
      height: 20px;
      left: 0;
      top: 20px;
      background: #50B5FC
      }
      .order-right{
      /* float: right;
      width: 1180px;*/
      float: right;
      width: 1180px;
      height: 100%;
      position: relative;
      }
      .all-order .all-order-serch{
      background: #ffffff;
      padding: 10px;
      }
      .all-order .all-order-serch .seach-select{
      }
      .all-order .all-order-serch .seach-select .el-input__inner,.all-order .all-order-serch .seach-select .el-input{
      width: 120px !important;
      background: #F1F3F9;
      border: none;
      }
      .all-order .all-order-serch .seach-input .el-input__inner,.all-order .all-order-serch .seach-input {
      width: 298px;
      }
      .button-color{
      background: #5874D8;
      }
      .button-icon{
      background: rgba(88,116,216,0.1) ; padding: 10px 8px;
      border-radius: 4px;
      }
      .button-icon i {
      font-size: 22px;color: #5874D8;
      vertical-align:middle;
      }
      .addbutton{float: right;}
      .all-orders-box{
      position: absolute;
      left: 0;
      right: 0;
      bottom: 50px;
      top: 64px;
      overflow: auto;
      }
      .all-order-content{
      width: 1180px;
      /*height: 100%;*/
      position: relative;
      }
      .all-order-box{
      width: 100%;
      background: #EEF1FB;
      height: 104px;
      margin-top: 10px;
      box-shadow: 3px 0px 5px 0px rgba(43,67,153,0.2);
      }
      .all-box-top{
      height: 42px;
      line-height: 42px;
      }
      .all-box-top .type{
      background: #486DED;
      color: #ffffff;
      padding: 3px 6px;
      margin-right: 10px;
      }
      .all-box-topright{
      float: right;
      }
      .all-box-topright i {
      color: #5874D8;margin-right: 20px;
      font-size: 20px;
      }
      .all-box-bottom{
      background: #ffffff;
      height: 62px;
      }
      .all-box-bottom .all-box-mess1,.all-box-bottom .all-box-mess2,.all-box-bottom .all-box-mess3{
      height: 62px;
      line-height: 1.5;
      padding-left: 20px;
      }
      .all-box-bottom .all-box-mess1,.all-box-bottom .all-box-mess2{
      border-right: 1px solid #ececec;
      }
      .all-box-bottom .all-box-mess1 p{
      color: #5874D8;padding-top: 8px;
      }
      .all-box-bottom .all-box-mess1 span{
      font-size: 12px;
      }
      .all-box-bottom .all-box-mess2,.all-box-bottom .all-box-mess3{
      line-height: 1.8;
      }
      .all-box-bottom .all-box-mess2 p,.all-box-bottom .all-box-mess3 p{
      color: #999;
      font-size: 12px;
      }
      .all-box-bottom .all-box-mess2 p:nth-child(1),.all-box-bottom .all-box-mess3 p:nth-child(1){
      padding-top: 8px;
      }
      .all-box-bottom .all-box-mess2 p span,.all-box-bottom .all-box-mess3 p span{
      color: #333;
      font-size: 12px;
      }
      .all-box-bottom .all-box-status{
      text-align: right;
      line-height: 62px;
      padding-right:20px;
      cursor: pointer;
      font-size:16px;
      font-family:PingFangSC-Regular;
      font-weight:400;
      }
      .table_bottm{
      text-align: center;
      padding-top: 20px;
      position: absolute;
      bottom: 15px;
      left: 0;
      right: 0;
      }
      Markdown is supported
      0% or
      You are about to add 0 people to the discussion. Proceed with caution.
      Finish editing this message first!
      Please register or to comment