diff --git a/fe/PC/public/config.js b/fe/PC/public/config.js
index c0c0b4ef2..ece3e7f3f 100644
--- a/fe/PC/public/config.js
+++ b/fe/PC/public/config.js
@@ -22,6 +22,8 @@ window.SITE_CONFIG['client_secret'] = '1q2w3E*'
 window.SITE_CONFIG['reportsUrl'] = 'http://dev.ccwin-in.com:60074/#/reports/'
 window.SITE_CONFIG['versionUrl'] = 'http://dev.ccwin-in.com:60070'
 window.SITE_CONFIG['companyName'] = '长春一汽富维东阳汽车塑料零部件（安徽）有限公司'
+//pad-kitting组包页面刷新时间（毫秒）
+window.SITE_CONFIG['padKittingPackUpdate'] = 180000 
 // 接口看板地址
 window.SITE_CONFIG['interfaceBoardUrl'] = 'http://dev.ccwin-in.com:60090/'
 // 主子表
diff --git a/fe/PC/src/App.vue b/fe/PC/src/App.vue
index eb3d10113..e6ba7733b 100644
--- a/fe/PC/src/App.vue
+++ b/fe/PC/src/App.vue
@@ -22,6 +22,7 @@ localStorage.setItem('print',window.SITE_CONFIG['print'])
 localStorage.setItem('warehouseCode',window.SITE_CONFIG['warehouseCode'])
 localStorage.setItem('company',window.SITE_CONFIG['company'])
 localStorage.setItem('largeScreen',window.SITE_CONFIG['largeScreen'])
+localStorage.setItem('padKittingPackUpdate',window.SITE_CONFIG['padKittingPackUpdate'])
 localStorage.setItem('apifoxToken',window.SITE_CONFIG['apifoxToken'])
 localStorage.setItem('reportsUrl',window.SITE_CONFIG['reportsUrl'])
 localStorage.setItem('companyName',window.SITE_CONFIG['companyName'])
diff --git a/fe/PC/src/api/wms-pad.js b/fe/PC/src/api/wms-pad.js
new file mode 100644
index 000000000..fbf6bf35c
--- /dev/null
+++ b/fe/PC/src/api/wms-pad.js
@@ -0,0 +1,11 @@
+import request from '@/utils/request'
+let baseURL = localStorage.getItem('base') + '/api/'
+
+// 【pad】 Kitting组包 - 获取中间底盘数据
+export function ChassisGetListWithNextCount(params) {
+  return request({
+    url: baseURL + 'wms/store/ChassisOperationSequence/get-list-with-next-count',
+    method: 'post',
+    params: params,
+  })
+}
diff --git a/fe/PC/src/styles/index.scss b/fe/PC/src/styles/index.scss
index 82769eb18..3f8d03dcf 100644
--- a/fe/PC/src/styles/index.scss
+++ b/fe/PC/src/styles/index.scss
@@ -254,4 +254,8 @@ aside {
   .el-table__fixed-right-patch{
     background: #f6f7fb !important;
   }
+}
+
+.el-message-box__message p {
+  word-break: break-all;
 }
\ No newline at end of file
diff --git a/fe/PC/src/views/login/index.vue b/fe/PC/src/views/login/index.vue
index 9a79767cb..fa9e183db 100644
--- a/fe/PC/src/views/login/index.vue
+++ b/fe/PC/src/views/login/index.vue
@@ -137,7 +137,7 @@ export default {
     });
   },
   mounted () {
-    window.showInfoFromJava = this.showInfoFromJava(111)
+    window.showInfoFromJava = this.showInfoFromJava
     if (this.loginForm.username === '') {
       this.$refs.username.focus()
     } else if (this.loginForm.password === '') {
diff --git a/fe/PC/src/views/padManage/padKittingPack.vue b/fe/PC/src/views/padManage/padKittingPack.vue
index fb6859f12..8a0112481 100644
--- a/fe/PC/src/views/padManage/padKittingPack.vue
+++ b/fe/PC/src/views/padManage/padKittingPack.vue
@@ -1,156 +1,388 @@
 <template>
-  <div class="page-box padKittingPackPage" v-loading="loading">
-    <!-- 左侧按钮 -->
-    <div class="leftBtns">
-      <div 
-        v-for="(item,index) of leftButtons" 
-        :key="index"
-        class="left-button"
-      >{{ item.name }}</div>
-    </div>
-    <!-- 中间底盘号 -->
-    <div class="centerChassisContain">
-      <div class="title">底盘号</div>
-      <ul class="chassisList">
-        <li
-          v-for="(item,index) of centerChassisList" 
-          :style="{color:(item.canSelect?'#000':'#ddd'),cursor:(item.canSelect?'pointer':'no-drop'),background:(item.isSelect?'green':'#fff')}"
+  <div class="page-box" v-loading="loading">
+    <div class="padKittingPackPage">
+      <!-- 左侧按钮 -->
+      <div class="leftBtns">
+        <div 
+          v-for="(item,index) of leftButtons" 
           :key="index"
-          @click="selectCenterChassis(item,index)"
-        >{{ item.number }}{{item.canSelect}}{{item.isSelect}}</li>
-      </ul>
-      <div class="footer-button">创建底盘组</div>
-    </div>
-    <!-- 右侧底盘组 -->
-    <div class="rightChassisGroup">
-      <!-- 右上组 -->
-      <div class="rightTopTable">
-        <el-table
-          :data="rightTopChassisGroup"
-          style="width: 100%">
-          <el-table-column
-            prop="number"
-            label="组"
-          ></el-table-column>
-          <el-table-column
-            prop="time"
-            label="时间"
-          ></el-table-column>
-        </el-table>
+          class="left-button"
+          @click="letButtonClick(item)"
+          :style="{
+            background:(currentKittingInfo && (item.code==currentKittingInfo.code)?'#ff9000':'#409EFF'),
+          }"
+        >
+          <p class="code">{{ item.code }}</p>
+          <p class="name">{{ item.name }}</p>
+        </div>
+      </div>
+      <!-- 中间底盘号 -->
+      <div class="centerChassisContain">
+        <div class="title">底盘号</div>
+        <ul class="chassisList" v-if="centerChassisList.length > 0">
+          <li
+            v-for="(item,index) of centerChassisList" 
+            :style="{
+              color:(item.canSelect?'#000':'#aaa'),
+              cursor:(item.canSelect?'pointer':'no-drop'),
+              background:(item.isSelect?'#bdddfd':'#fff'),
+            }"
+            :key="index"
+            @click="selectCenterChassis(item,index)"
+          >{{ item.chassisNumber }}</li>
+        </ul>
+        <div class="noDataTipper" v-if="centerChassisList.length <= 0">暂无数据</div>
+        <div class="footer-button"><el-button type="primary" @click="createChassisHandle()">创建底盘组</el-button></div>
       </div>
-      <!-- 右下bom -->
-      <div class="rightBottomBomData">
-        <el-table
-          :data="rightBottomBomData"
-          style="width: 100%">
-          <el-table-column
-            prop="name"
-            label="Kitting组别Bom"
-          ></el-table-column>
-          <el-table-column
-            prop="qty"
-            label="底盘组物品数量"
-          ></el-table-column>
-          <el-table-column
-            prop="qty1"
-            label="Kiting组数量"
-          ></el-table-column>
-        </el-table>
+      <!-- 右侧底盘组 -->
+      <div class="rightChassisGroup">
+        <!-- 右上组 -->
+        <div class="rightTopTable">
+          <el-table
+            :border="true"
+            :data="rightTopChassisGroup"
+            :height="'100%'"
+            :header-cell-style="{ background: '#e3f0ff',color:'#333'}"
+            style="width: 100%">
+            <el-table-column
+              prop="chassisNumber"
+              label="底盘组"
+            ></el-table-column>
+            <el-table-column
+              prop="creationTime"
+              label="时间"
+            >
+              <template slot-scope="scope">
+                {{ formatDate(scope.row.creationTime) }}
+              </template>
+            </el-table-column>
+          </el-table>
+        </div>
+        <!-- 右下bom -->
+        <div class="rightBottomBomData">
+          <el-table
+            :border="true"
+            :data="rightBottomBomData"
+            :header-cell-style="{ background: '#e3f0ff',color:'#333'}"
+            style="width: 100%">
+            <el-table-column
+              prop="itemCode"
+              label="Kitting组别Bom"
+            ></el-table-column>
+            <el-table-column
+              prop="qty"
+              label="底盘组物品数量"
+            ></el-table-column>
+            <!-- todo: Kiting组数量字段确定-->
+            <el-table-column
+              prop="qty1"
+              label="Kiting组数量"
+            ></el-table-column>
+          </el-table>
+        </div>
+        <div class="footer-button"><el-button type="success">完成该组底盘</el-button></div>
       </div>
-      <div class="footer-button">完成该组底盘</div>
     </div>
   </div>
 </template>
 <script>
+import { getPageList } from '@/api/wms-api'
+import { ChassisGetListWithNextCount } from '@/api/wms-pad'
+import { formatTimeStrToStr } from "@/utils/formatTime"
 export default {
   name: "padKittingPack",
   data() {
     return {
       loading:false,
-      // 默认一次打包数量
-      packGroupNumber:3,
+      // 循环数据定时器
+      intervalId:false,
+      // 当前左侧按钮选择信息
+      currentKittingInfo:null,
       // 左侧按钮
-      leftButtons:[
-        {name:'K1',id:'1'},
-        {name:'K2',id:'2'},
-        {name:'K3',id:'3'},
-        {name:'K4',id:'4'},
-        {name:'K5',id:'5'},
-      ],
+      leftButtons:[],
       // 中间底盘号
-      centerChassisList:[
-        {number:'BC0000004',id:'4',time:'09:00:00',canSelect:true,isSelect:false},
-        {number:'BC0000005',id:'5',time:'09:00:00',canSelect:false,isSelect:false},
-        {number:'BC0000006',id:'6',time:'09:00:00',canSelect:false,isSelect:false},
-        {number:'BC0000007',id:'7',time:'09:00:00',canSelect:false,isSelect:false},
-      ],
+      centerChassisList:[],
       // 右上方组数据
-      rightTopChassisGroup:[
-        {number:'BC0000001',id:'1',time:'09:00:00'},
-        {number:'BC0000002',id:'2',time:'09:00:00'},
-        {number:'BC0000003',id:'3',time:'09:00:00'},
-      ],
+      rightTopChassisGroup:[],
       // 右下方组bom数据
-      rightBottomBomData:[
-        {name:'SE370E01B01A',qty:'1',qty2:'1'},
-        {name:'SE370Q41B10AG',qty:'2',qty2:'2'},
-        {name:'THILDD0A510AA',qty:'3',qty2:'3'},
-      ],
+      rightBottomBomData:[],
     };
   },
+  mounted(){
+    this.initData()
+    clearInterval(this.intervalId)
+    //刷新数据
+    this.intervalId = setInterval(() => {
+      this.initData()
+    }, localStorage.getItem('padKittingPackUpdate') || 180000)
+  },
+  destroyed() {
+      clearInterval(this.intervalId)
+  },
   methods:{
+    initData(){
+      this.getKittingList()
+      if(this.currentKittingInfo){
+        this.letButtonClick(this.currentKittingInfo)
+      }
+    },
+    // 格式化时间
+    formatDate (time) {
+      if (time == null) {
+        return '-'
+      }
+      return formatTimeStrToStr(time)
+    },
+    // 获取kitting
+    getKittingList(){
+      let _data = {
+        condition: {
+          filters: []
+        },
+        Sorting: "code ASC",
+        SkipCount: 0,
+        MaxResultCount: 9999,
+      }
+      this.loading = true
+      getPageList(_data, 'basedata/kitting',true).then(res => {
+        this.leftButtons = res.items
+        this.loading = false
+      }).catch(err => {
+        this.loading = false
+      })
+    },
+    // 左侧按钮点击事件
+    letButtonClick(selectItem){
+      this.currentKittingInfo = selectItem;
+      let _data = {
+        count:30,
+        kittingCode:selectItem.code
+      }
+      this.loading = true
+      // 获取中间数据
+      ChassisGetListWithNextCount(_data).then(res => {
+        this.centerChassisList = []
+        this.rightTopChassisGroup = []
+        // 初始化中间和右侧数据数据：
+        // 如果不够chassisQty条，则不分开
+        if(res.items.length<Number(selectItem.chassisQty)){
+          this.centerChassisList = res.items
+        }
+        // 如果够chassisQty条:前三条数据，放到右上方，第四条数据开始显示在中间位置
+        else{
+          res.items.forEach((item,index)=>{
+            if(index < Number(selectItem.chassisQty)){
+              this.rightTopChassisGroup.push(item)
+            }else{
+              item.isSelect = false
+              item.canSelect = false
+              this.centerChassisList.push(item)
+            }
+          })
+        }
+        this.centerChassisList[0].canSelect = true
+        this.rightBottomBomData = selectItem.details
+        this.loading = false
+      }).catch(err => {
+        this.loading = false
+      })
+    },
     // 点击选中中间数据
     selectCenterChassis(selectItem,selectIndex){
-      this.centerChassisList.forEach((item,index)=>{
-        // 如果当前项为第一个 或者 前一个已经选中
-        if(Number(selectIndex) == 0 || this.centerChassisList[Number(selectIndex)-1].isSelect){
-          // // 选中
-          if(selectItem.isSelect == false){
-            console.log(109,this.centerChassisList[Number(selectIndex)].isSelect)
-            this.centerChassisList[Number(selectIndex)].isSelect = true
-            this.centerChassisList[Number(selectIndex)].canSelect = true
-            if(this.centerChassisList[Number(selectIndex + 1)]){
-              this.centerChassisList[Number(selectIndex + 1)].canSelect = true
-            }
-            // if(Number(index) <= Number(selectIndex))item.isSelect = true
-            // if(Number(index) <= Number(selectIndex + 1))item.canSelect = true
-            // if(Number(selectIndex) == this.centerChassisList.length - 1){
-            //   item.isSelect = true
-            // }
+      for(let i=0;i<this.centerChassisList.length;i++){
+        // 选中
+        if(selectItem.isSelect == false){
+          if(selectIndex == 0 || this.centerChassisList[selectIndex - 1].isSelect){
+            this.centerChassisList[selectIndex].isSelect = true
+            this.centerChassisList[selectIndex].canSelect = true
+            if(this.centerChassisList[selectIndex+1])this.centerChassisList[selectIndex+1].canSelect = true
           }
-          // 取消选中todo:
-          else{
-            console.log(123)
-            if(Number(index) == Number(selectIndex)){
+          return
+        }
+        // 取消选中
+        else{
+          this.centerChassisList.forEach((item,index)=>{
+            if(Number(index) >= Number(selectIndex)){
+              item.canSelect = false
               item.isSelect = false
             }
-            // console.log(120,index,selectIndex)
-            // if(Number(index) > Number(selectIndex)){
-            //   item.canSelect = false
-            //   item.isSelect = false
-            // }
-          }
-          // if(selectIndex == this.centerChassisList.length - 1){
-          //   item.canSelect = true
-          // }else{
-          //   this.centerChassisList[Number(selectIndex)+1].canSelect = true
-          // }
-        }else{
-          this.$warningMsg("必须从上按顺序选择")
+          })
+          this.centerChassisList[selectIndex].canSelect = true
+          return
         }
-        // if(selectItem.isSelect){
-        //   if(Number(index) > Number(selectIndex)){
-        //     item.canSelect = false
-        //     item.isSelect = false
-        //   }
-        // }
-      })
+      }
+    },
+    // 创建底盘组操作
+    createChassisHandle(){
+      let _selectItems = this.centerChassisList.filter(item=>{return item.isSelect})
+      if(!_selectItems || _selectItems.length <= 0){
+        this.$warningMsg("请选择至少一项")
+        return
+      }
+      let _selectChassisNumber = []
+      _selectItems.forEach(item=>{ if(item.isSelect)_selectChassisNumber.push(item.chassisNumber)})
+      let _msg = `是否确定将底盘号 (${_selectChassisNumber.join(",")}) 移入底盘组`
+      this.$confirm(_msg, '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        // 中间数据移除已选项
+        this.centerChassisList = this.centerChassisList.filter(item => !_selectChassisNumber.includes(item.chassisNumber))
+        // 右侧数据添加已选
+        this.rightTopChassisGroup = [
+          ...this.rightTopChassisGroup,
+          ..._selectItems
+        ]
+      }).catch(() => {
+
+      });
     }
   },
-  mounted() {
-  },
 };
 </script>
 <style lang="scss" scoped>
 @import "@/styles/mainbasicData.scss";
+$boxPadding:15px;
+$boxBorder:#ddd solid 1px;
+$footerBtn_height:60px;
+.page-box{
+  overflow:auto;
+  background:#f8f8f8;
+  padding:10px
+}
+.padKittingPackPage{
+  min-width:1000px;
+  height:100%;
+  display:flex;
+  .leftBtns{
+    width:15%;
+    min-width:150px;
+    border:$boxBorder;
+    padding:$boxPadding;
+    flex-shrink:0;
+    height:100%;
+    overflow:auto;
+    background:#fff;
+
+    .left-button{
+      flex-wrap: wrap;
+      display:flex;
+      width:100%;
+      height:90px;
+      background:#409EFF;
+      color:#fff;
+      margin:15px 0;
+      border-radius:12px;
+      text-align:center;
+      cursor:pointer;
+      align-content: center;
+
+      &:hover{
+        opacity:0.8
+      }
+
+      p{
+        width:100%;
+        flex-shrink:0;
+        margin:0;
+        padding:0;
+        font-size:14px;
+
+        &.code{
+          font-size:20px
+        }
+      }
+    }
+  }
+  .centerChassisContain{
+    position:relative;
+    width:calc(30% - 20px);
+    min-width:260px;
+    border:$boxBorder;
+    padding:$boxPadding;
+    height:100%;
+    overflow:auto;
+    margin:0 10px;
+    background:#fff;
+
+    $title_height:40px;
+    .title{
+      position:absolute;
+      top:0;
+      left:0;
+      right:0;
+      text-align:center;
+      line-height:$title_height;
+      height:$title_height;
+      overflow:hidden
+    }
+
+    .chassisList,.noDataTipper{
+      position:absolute;
+      top:$title_height;
+      left:0;
+      right:0;
+      bottom:$footerBtn_height;
+      overflow:auto;
+      padding:0;
+      margin:0;
+
+      li{
+        margin:10px;
+        padding:5px 15px;
+        list-style:none;
+      }
+    }
+    .noDataTipper{
+      color:#909399;
+      line-height:60px;
+      text-align:center;
+      font-size:14px;
+    }
+  }
+  .rightChassisGroup{
+    position:relative;
+    width:55%;
+    min-width:600px;
+    border:$boxBorder;
+    padding:$boxPadding;
+    height:100%;
+    overflow:auto;
+    background:#fff;
+
+    .rightTopTable{
+      position:absolute;
+      top:0;
+      left:0;
+      right:0;
+      height:30%;
+      overflow:auto;
+    }
+
+    .rightBottomBomData{
+      position:absolute;
+      top:calc(30% + 30px);
+      left:0;
+      right:0;
+      bottom:$footerBtn_height;
+      overflow:auto;
+      border-top:$boxBorder;
+    }
+  }
+  .footer-button{
+    position:absolute;
+    bottom:0;
+    left:0;
+    right:0;
+    text-align:center;
+    border-top:$boxBorder;
+    height:$footerBtn_height;
+
+    .el-button{
+      width:180px;
+      margin-top:10px
+    }
+  }
+}
 </style>
\ No newline at end of file