| | |
| | | <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 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"> |
| | | <h5>套餐</h5> |
| | | <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"> |
| | | <h5>检测项信息</h5> |
| | | <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"> |
| | | <h5>光纤带</h5> |
| | | <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"> |
| | | <h5>光纤</h5> |
| | | <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> |
| | | <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:[] |
| | | export default { |
| | | data() { |
| | | return { |
| | | saveLoad: false, |
| | | packageInfo: { |
| | | radio: 1, |
| | | input: '' |
| | | }, |
| | | tableData: [], |
| | | tape: { |
| | | value: '' |
| | | }, |
| | | options: [] |
| | | } |
| | | }, |
| | | methods: { |
| | | save() {}, |
| | | handleSelectionChange(val) {} |
| | | } |
| | | }, |
| | | methods:{ |
| | | save(){}, |
| | | handleSelectionChange(val) {} |
| | | } |
| | | } |
| | | </script> |
| | | |
| | | <style scoped> |
| | |
| | | overflow-x: hidden; |
| | | } |
| | | |
| | | .ins_order_config::-webkit-scrollbar { |
| | | width: 0; |
| | | } |
| | | |
| | | .title { |
| | | height: 60px; |
| | | line-height: 60px; |
| | | } |
| | | .center{ |
| | | |
| | | .center { |
| | | width: 100%; |
| | | height: calc(100% - 60px); |
| | | } |
| | | .grid-content{ |
| | | |
| | | .grid-content { |
| | | background: #fff; |
| | | border-radius: 4px; |
| | | box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.05); |
| | | } |
| | | .grid-content h4{ |
| | | |
| | | .grid-content h5 { |
| | | color: #3A7BFA; |
| | | font-weight: 400; |
| | | line-height: 32px; |
| | |
| | | box-sizing: border-box; |
| | | border-bottom: 1px solid #eee; |
| | | } |
| | | .search-item{ |
| | | |
| | | .search-item { |
| | | display: flex; |
| | | align-items: center; |
| | | line-height: 36px; |
| | | } |
| | | .search-item label{ |
| | | |
| | | .search-item label { |
| | | width: 90px; |
| | | font-size: 12px; |
| | | color: #606266; |
| | | /* text-align: right; */ |
| | | } |
| | | .btns{ |
| | | |
| | | .btns { |
| | | margin: 8px 0 8px 10px; |
| | | } |
| | | >>>.el-table th.el-table__cell>.cell{ |
| | | |
| | | >>>.el-table th.el-table__cell>.cell { |
| | | padding-top: 2px !important; |
| | | padding-bottom: 2px !important; |
| | | } |