¶Ô±ÈÐÂÎļþ |
| | |
| | | <template> |
| | | <div class="ins_order_config"> |
| | | <div> |
| | | <el-row class="title"> |
| | | <el-col :span="6" style="padding-left: 20px;">å
纤é
ç½®</el-col> |
| | | <el-col :span="18" style="text-align: right;"> |
| | | <el-button size="medium" type="primary" @click="save" :loading="saveLoad">ä¿ å</el-button> |
| | | <el-button size="medium" @click="$parent.playOrder(0)"> |
| | | <span style="color: #3A7BFA;">å æ¶</span> |
| | | </el-button> |
| | | </el-col> |
| | | </el-row> |
| | | </div> |
| | | <div class="center"> |
| | | <el-row :gutter="10" style="margin-bottom: 10px;"> |
| | | <el-col :span="9"> |
| | | <div class="grid-content"> |
| | | <h4>å¥é¤</h4> |
| | | <div style="display: flex;align-items: center;justify-content: space-between;padding: 0 12px;box-sizing: border-box;"> |
| | | <div class="search-item"> |
| | | <label style="width: 70px;">æ ·ååå·</label> |
| | | <span style="font-size: 14px;">GYTA53</span> |
| | | </div> |
| | | <el-radio-group v-model="packageInfo.radio" size="small"> |
| | | <el-radio :label="0">å
¨æ£</el-radio> |
| | | <el-radio :label="1">æ½æ£</el-radio> |
| | | </el-radio-group> |
| | | </div> |
| | | <div class="search-item" style="margin-bottom: 8px;padding: 0 12px;box-sizing: border-box;"> |
| | | <label style="width: 70px;">æ ·åç¼å·</label> |
| | | <el-input v-model="packageInfo.input" placeholder="请è¾å
¥" size="small"></el-input> |
| | | </div> |
| | | <div style="display: flex;align-items: center;justify-content: space-between;margin-bottom: 8px;padding: 0 12px;box-sizing: border-box;"> |
| | | <div class="search-item" style="margin-right: 10px;"> |
| | | <label>å¥ç®¡æ°ç®</label> |
| | | <el-input v-model="packageInfo.input" placeholder="请è¾å
¥" size="small"></el-input> |
| | | </div> |
| | | <div class="search-item" style="margin-right: 10px;"> |
| | | <label style="width: 70px;">æ åé</label> |
| | | <el-input v-model="packageInfo.input" placeholder="请è¾å
¥" size="small"></el-input> |
| | | </div> |
| | | <div class="search-item"> |
| | | <label style="width: 70px;">æ£æµé</label> |
| | | <el-input v-model="packageInfo.input" placeholder="请è¾å
¥" size="small"></el-input> |
| | | </div> |
| | | </div> |
| | | <el-table |
| | | ref="table0" |
| | | :data="tableData" |
| | | tooltip-effect="dark" |
| | | style="width: 100%" |
| | | height="150px" |
| | | size="small" |
| | | @selection-change="handleSelectionChange"> |
| | | <el-table-column |
| | | type="selection" |
| | | width="55"> |
| | | </el-table-column> |
| | | <el-table-column |
| | | label="ç®¡è²æ " |
| | | show-overflow-tooltip> |
| | | <template slot-scope="scope">{{ scope.row.date }}</template> |
| | | </el-table-column> |
| | | <el-table-column |
| | | prop="name" |
| | | label="æ é" |
| | | show-overflow-tooltip> |
| | | </el-table-column> |
| | | <el-table-column |
| | | prop="address" |
| | | label="æµè¯é" |
| | | show-overflow-tooltip> |
| | | </el-table-column> |
| | | </el-table> |
| | | </div> |
| | | </el-col> |
| | | <el-col :span="15"> |
| | | <div class="grid-content"> |
| | | <h4>æ£æµé¡¹ä¿¡æ¯</h4> |
| | | <el-table |
| | | ref="table1" |
| | | :data="tableData" |
| | | tooltip-effect="dark" |
| | | style="width: 100%" |
| | | height="274px" |
| | | size="small" |
| | | @selection-change="handleSelectionChange"> |
| | | <el-table-column |
| | | type="selection" |
| | | width="55"> |
| | | </el-table-column> |
| | | <el-table-column |
| | | label="å®éªå®¤" |
| | | show-overflow-tooltip> |
| | | <template slot-scope="scope">{{ scope.row.date }}</template> |
| | | </el-table-column> |
| | | <el-table-column |
| | | prop="name" |
| | | label="æ£æµé¡¹ç®" |
| | | show-overflow-tooltip> |
| | | </el-table-column> |
| | | <el-table-column |
| | | prop="address" |
| | | label="è¯éªæ¹æ³" |
| | | show-overflow-tooltip> |
| | | </el-table-column> |
| | | <el-table-column |
| | | prop="address" |
| | | label="åä»·" |
| | | width="70" |
| | | show-overflow-tooltip> |
| | | </el-table-column> |
| | | <el-table-column |
| | | prop="address" |
| | | label="åä½" |
| | | width="70" |
| | | show-overflow-tooltip> |
| | | </el-table-column> |
| | | <el-table-column |
| | | prop="address" |
| | | label="é¢è®¡æ¶é´" |
| | | show-overflow-tooltip> |
| | | </el-table-column> |
| | | <el-table-column |
| | | prop="address" |
| | | label="æ£æµæ å" |
| | | show-overflow-tooltip> |
| | | </el-table-column> |
| | | <el-table-column |
| | | prop="address" |
| | | label="æ£æµè¦æ±" |
| | | show-overflow-tooltip> |
| | | </el-table-column> |
| | | </el-table> |
| | | </div> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row :gutter="10"> |
| | | <el-col :span="12"> |
| | | <div class="grid-content"> |
| | | <h4>å
纤带</h4> |
| | | <div class="btns"> |
| | | <el-button size="small" type="primary">çæå
纤带</el-button> |
| | | <el-button size="small" type="primary">ä¿åå
纤带项ç®</el-button> |
| | | </div> |
| | | <div style="display: flex;align-items: center;justify-content: space-between;margin-bottom: 8px;padding: 0 12px;box-sizing: border-box;"> |
| | | <div class="search-item" style="width: 50%;margin-right: 16px;"> |
| | | <label style="width: 80px;">纤带类å</label> |
| | | <el-select v-model="tape.value" placeholder="è¯·éæ©" size="small" style="width: 100%;"> |
| | | <el-option |
| | | v-for="item in options" |
| | | :key="item.value" |
| | | :label="item.label" |
| | | :value="item.value"> |
| | | </el-option> |
| | | </el-select> |
| | | </div> |
| | | <div class="search-item" style="width: 50%;"> |
| | | <label style="width: 80px;">åèæ å</label> |
| | | <el-select v-model="tape.value" placeholder="è¯·éæ©" size="small" style="width: 100%;"> |
| | | <el-option |
| | | v-for="item in options" |
| | | :key="item.value" |
| | | :label="item.label" |
| | | :value="item.value"> |
| | | </el-option> |
| | | </el-select> |
| | | </div> |
| | | </div> |
| | | <el-table |
| | | ref="table2" |
| | | :data="tableData" |
| | | tooltip-effect="dark" |
| | | style="width: 100%" |
| | | height="270px" |
| | | size="small" |
| | | @selection-change="handleSelectionChange"> |
| | | <el-table-column |
| | | type="selection" |
| | | width="55"> |
| | | </el-table-column> |
| | | <el-table-column |
| | | label="å
纤带ç¼å·" |
| | | show-overflow-tooltip> |
| | | <template slot-scope="scope">{{ scope.row.date }}</template> |
| | | </el-table-column> |
| | | <el-table-column |
| | | prop="name" |
| | | label="å
çº¤å¸¦è§æ ¼" |
| | | show-overflow-tooltip> |
| | | </el-table-column> |
| | | <el-table-column |
| | | prop="address" |
| | | label="åèæ å" |
| | | show-overflow-tooltip> |
| | | </el-table-column> |
| | | <el-table-column |
| | | prop="address" |
| | | label="å
çº¤æ£æµé" |
| | | show-overflow-tooltip> |
| | | </el-table-column> |
| | | </el-table> |
| | | </div> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <div class="grid-content"> |
| | | <h4>å
纤</h4> |
| | | <div class="btns"> |
| | | <el-button size="small" type="primary">å
纤é
è²</el-button> |
| | | <el-button size="small" type="primary">ä¿åå
纤项ç®</el-button> |
| | | </div> |
| | | <div style="display: flex;align-items: center;justify-content: space-between;margin-bottom: 8px;padding: 0 12px;box-sizing: border-box;"> |
| | | <div class="search-item" style="width: 50%;margin-right: 16px;"> |
| | | <label style="width: 80px;">å
纤类å</label> |
| | | <el-select v-model="tape.value" placeholder="è¯·éæ©" size="small" style="width: 100%;"> |
| | | <el-option |
| | | v-for="item in options" |
| | | :key="item.value" |
| | | :label="item.label" |
| | | :value="item.value"> |
| | | </el-option> |
| | | </el-select> |
| | | </div> |
| | | <div class="search-item" style="width: 50%;"> |
| | | <label style="width: 80px;">åèæ å</label> |
| | | <el-select v-model="tape.value" placeholder="è¯·éæ©" size="small" style="width: 100%;"> |
| | | <el-option |
| | | v-for="item in options" |
| | | :key="item.value" |
| | | :label="item.label" |
| | | :value="item.value"> |
| | | </el-option> |
| | | </el-select> |
| | | </div> |
| | | </div> |
| | | <el-table |
| | | ref="table3" |
| | | :data="tableData" |
| | | tooltip-effect="dark" |
| | | style="width: 100%" |
| | | height="270px" |
| | | size="small" |
| | | @selection-change="handleSelectionChange"> |
| | | <el-table-column |
| | | type="selection" |
| | | width="55"> |
| | | </el-table-column> |
| | | <el-table-column |
| | | label="管å¥è²æ " |
| | | show-overflow-tooltip> |
| | | <template slot-scope="scope">{{ scope.row.date }}</template> |
| | | </el-table-column> |
| | | <el-table-column |
| | | prop="name" |
| | | label="å
çº¤è²æ " |
| | | show-overflow-tooltip> |
| | | </el-table-column> |
| | | <el-table-column |
| | | prop="address" |
| | | label="å
çº¤è§æ ¼" |
| | | show-overflow-tooltip> |
| | | </el-table-column> |
| | | <el-table-column |
| | | prop="address" |
| | | label="åèæ å" |
| | | show-overflow-tooltip> |
| | | </el-table-column> |
| | | </el-table> |
| | | </div> |
| | | </el-col> |
| | | </el-row> |
| | | </div> |
| | | </div> |
| | | </template> |
| | | |
| | | <script> |
| | | export default { |
| | | data(){ |
| | | return{ |
| | | saveLoad:false, |
| | | packageInfo:{ |
| | | radio:1, |
| | | input:'' |
| | | }, |
| | | tableData:[], |
| | | tape:{ |
| | | value:'' |
| | | }, |
| | | options:[] |
| | | } |
| | | }, |
| | | methods:{ |
| | | save(){}, |
| | | handleSelectionChange(val) {} |
| | | } |
| | | } |
| | | </script> |
| | | |
| | | <style scoped> |
| | | .ins_order_config { |
| | | width: 100%; |
| | | height: 100%; |
| | | overflow-y: auto; |
| | | overflow-x: hidden; |
| | | } |
| | | |
| | | .title { |
| | | height: 60px; |
| | | line-height: 60px; |
| | | } |
| | | .center{ |
| | | width: 100%; |
| | | height: calc(100% - 60px); |
| | | } |
| | | .grid-content{ |
| | | background: #fff; |
| | | border-radius: 4px; |
| | | } |
| | | .grid-content h4{ |
| | | color: #3A7BFA; |
| | | font-weight: 400; |
| | | line-height: 32px; |
| | | padding-left: 16px; |
| | | box-sizing: border-box; |
| | | border-bottom: 1px solid #eee; |
| | | } |
| | | .search-item{ |
| | | display: flex; |
| | | align-items: center; |
| | | line-height: 36px; |
| | | } |
| | | .search-item label{ |
| | | width: 90px; |
| | | font-size: 12px; |
| | | color: #606266; |
| | | /* text-align: right; */ |
| | | } |
| | | .btns{ |
| | | margin: 8px 0 8px 10px; |
| | | } |
| | | >>>.el-table th.el-table__cell>.cell{ |
| | | padding-top: 2px !important; |
| | | padding-bottom: 2px !important; |
| | | } |
| | | </style> |