<template>
|
<div>
|
<div class="body" :style="{height:mainHeight+'px'}" style="background-color: #eaecef">
|
|
<div
|
style="background-color: #f8f8fa;margin: 10px 0;
|
overflow-y:auto;overflow-x: hidden;
|
display: flex;flex-direction: column"
|
:style="{height:mainHeight+'px'}"
|
>
|
<div class="content1">
|
<div>
|
<i class="el-icon-s-operation" style="font-size: 14px" :style="{color:$store.state.settings.theme}" />
|
</div>
|
<div class="title">
|
扫描信息
|
</div>
|
</div>
|
|
<div class="content2">
|
<el-form :inline="true" label-width="80px">
|
<el-form-item label="检验类型">
|
<el-select
|
v-model="form.checktype"
|
style="width: 160px;"
|
placeholder="请选择"
|
filterable
|
>
|
<el-option
|
v-for="item in checktypeArr"
|
:key="item.code"
|
:label="item.name"
|
:value="item.code"
|
/>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="扫码条码">
|
<el-input
|
v-model="form.orderstepqrcode"
|
name="GXproduceCode"
|
style="width: 250px"
|
placeholder="请扫码工单工序码"
|
@keyup.enter.native="enterNative"
|
/>
|
</el-form-item>
|
</el-form>
|
</div>
|
|
<div class="content1">
|
<div>
|
<i class="el-icon-s-operation" style="font-size: 14px" :style="{color:$store.state.settings.theme}" />
|
</div>
|
<div class="title">
|
工单信息
|
</div>
|
</div>
|
<div class="content2" style="width: 60%;margin-left: 30px;">
|
<div class="orderMsg">单据编号:{{ form.wocode }}</div>
|
<div class="orderMsg">物料编码:{{ form.partcode }}</div>
|
<div class="orderMsg">物料名称:{{ form.partname }}</div>
|
</div>
|
<div class="content2" style="width: 60%;margin-left: 30px;">
|
<div class="orderMsg">物料规格:{{ form.partspec }}</div>
|
<div class="orderMsg">工序编码:{{ form.stepcode }}</div>
|
<div class="orderMsg">工序名称:{{ form.stepname }}</div>
|
</div>
|
|
<div class="content1">
|
<div>
|
<i class="el-icon-s-operation" style="font-size: 14px" :style="{color:$store.state.settings.theme}" />
|
</div>
|
<div class="title">
|
质检方案
|
</div>
|
</div>
|
<div class="content2" style="width: 60%;margin-left: 30px;">
|
<div class="orderMsg">方案名称:{{ form.checkstandname }}</div>
|
<div class="orderMsg">抽样方式:{{
|
form.sampmethod === 'FIXED' ? '固时抽检' : form.sampmethod === 'SCARE' ? '比例抽检' : ''
|
}}
|
</div>
|
</div>
|
<div class="content2" style="width: 60%;margin-left: 30px;">
|
<div class="orderMsg">报工数量:{{ form.good_qty }}</div>
|
<div class="orderMsg">样本数量:
|
<el-input-number
|
v-if="form.good_qty"
|
v-model="form.sampscare"
|
:max="form.good_qty"
|
:min="1"
|
size="medium"
|
@change="numberChange"
|
/>
|
</div>
|
</div>
|
|
<div
|
v-if="checkItemArr.length>0"
|
class="content1"
|
>
|
<div>
|
<i class="el-icon-s-operation" style="font-size: 14px" :style="{color:$store.state.settings.theme}" />
|
</div>
|
<div class="title">
|
检验项目
|
</div>
|
</div>
|
<div
|
v-if="form.sampscare!==1&&checkItemArr.length>0"
|
class="content2"
|
style="width: 60%;"
|
>
|
<el-link :underline="false" :disabled="!(stepActive>0)" style="width: 60px;margin-top: 5px" @click="pre">上一件
|
</el-link>
|
<el-steps :active="stepActive" style="width: 70%;margin:0 10px;" finish-status="success">
|
<el-step v-for="item in form.sampscare" :key="item" title="" />
|
</el-steps>
|
<el-link
|
:underline="false"
|
:disabled="!(stepActive < form.sampscare-1)"
|
style="width: 60px;margin-top: 5px"
|
@click="next"
|
>下一件
|
</el-link>
|
</div>
|
|
<div
|
class="content2"
|
style="flex-direction: column;justify-content:flex-start;width: 480px;margin-top: 10px;"
|
>
|
|
<div
|
v-for="(item,index) in checkItemArr"
|
v-if="stepActive+1===item.checkNumber"
|
:key="item.code+(stepActive+1).toString()"
|
:style="{borderBottom:(index+1)%checkItemArr.map(i=>i.checkNumber===1).filter(i=>i).length!==0?`1px solid rgba(48,49,51,0.2)`:''}"
|
class="checkItem"
|
>
|
|
<div style="display: flex;justify-content: space-between;align-items: center">
|
<div style="display: flex;width: 300px;">
|
<div class="serialNumber">{{ item.stepcheckitem_seq }}</div>
|
<div style="display: flex;align-items: center">{{ item.name }}</div>
|
</div>
|
|
<div v-show="item.numberjudge==='N'" style="width: 150px;display: flex;padding-left: 20px">
|
<el-button
|
type="primary"
|
size="mini"
|
:plain="!item.check_result"
|
@click="checkResultClick('OK',item)"
|
>合格
|
</el-button>
|
<el-button
|
type="warning"
|
size="mini"
|
:plain="item.check_result"
|
@click="checkResultClick('NG',item)"
|
>不合格
|
</el-button>
|
</div>
|
<div v-show="item.numberjudge!=='N'" style="width: 150px;" />
|
</div>
|
|
<div style="display: flex;margin-bottom: 5px">
|
<div style="display: flex;flex-direction: column">
|
<div v-if="item.standvalue" class="itemTitle">标准值</div>
|
<div v-if="item.uppervalue" class="itemTitle">上限值</div>
|
<div v-if="item.lowervalue" class="itemTitle">下限值</div>
|
<div v-if="item.stepcheckitem_desc" class="itemTitle">描述</div>
|
<div v-if="item.numberjudge!=='N'" class="itemTitle">实测值
|
<el-input
|
v-model="item.real_value"
|
size="mini"
|
oninput="value=value.replace(/[^0-9.]/g,'')"
|
style="width: 100px;margin-left: 5px"
|
@input="val=>inputChange(val,item)"
|
/>
|
</div>
|
</div>
|
<div style="display: flex;flex-direction: column">
|
<div v-if="item.standvalue" class="itemContent">{{ item.standvalue }}</div>
|
<div v-if="item.uppervalue" class="itemContent">{{ item.uppervalue }}</div>
|
<div v-if="item.lowervalue" class="itemContent">{{ item.lowervalue }}</div>
|
<div v-if="item.stepcheckitem_desc" class="itemContent">{{ item.stepcheckitem_desc }}</div>
|
|
<div v-show="item.numberjudge!=='N'" class="itemContent" style="width: 150px;display: flex">
|
<el-button
|
type="primary"
|
size="mini"
|
:disabled="item.required==='Y'&&!item.real_value"
|
:plain="!item.check_result"
|
@click="checkResultClick('OK',item)"
|
>合格
|
</el-button>
|
<el-button
|
type="warning"
|
size="mini"
|
:disabled="item.required==='Y'&&!item.real_value"
|
:plain="item.check_result"
|
@click="checkResultClick('NG',item)"
|
>
|
不合格
|
</el-button>
|
</div>
|
</div>
|
</div>
|
|
</div>
|
|
</div>
|
|
<div
|
v-if="checkItemArr.filter(i=>i.check_result!=='').length===checkItemArr.length&&checkItemArr.length>0"
|
class="content1"
|
>
|
<div>
|
<i class="el-icon-s-operation" style="font-size: 14px" :style="{color:$store.state.settings.theme}" />
|
</div>
|
<div class="title">
|
检验结果
|
</div>
|
</div>
|
|
<div
|
v-if="checkItemArr.filter(i=>i.check_result!=='').length===checkItemArr.length&&checkItemArr.length>0"
|
class="content2"
|
style="width: 60%;margin-left: 30px;"
|
>
|
<div class="orderMsg2">样本数量:{{ form.sampscare }}</div>
|
<div class="orderMsg2">合格数量:{{ form.goodqty }}</div>
|
<div class="orderMsg2">不合格数量:{{ form.ngqty }}</div>
|
|
<div style="width: 290px;display: flex;align-items: center" class="resultButton">
|
<div style="width: 70px;">判定结果:</div>
|
<el-button type="primary" size="medium" :plain="!check_result" @click="check_result=true">合格</el-button>
|
<el-button type="warning" size="medium" :plain="check_result" @click="check_result=false">不合格</el-button>
|
</div>
|
</div>
|
|
<div
|
v-if="checkItemArr.filter(i=>i.check_result!=='').length===checkItemArr.length&&checkItemArr.length>0"
|
class="content2 submitButton"
|
style="margin-top: 10px;margin-bottom: 10px;"
|
>
|
<el-button
|
v-waves
|
type="primary"
|
@click="submitButton"
|
>提交
|
</el-button>
|
</div>
|
|
</div>
|
|
</div>
|
</div>
|
</template>
|
|
<script>
|
import waves from '@/directive/waves'
|
import $ from 'jquery'
|
import { MesOrderStepCheckItemList, MesOrderStepCheckSearch, SaveMesOrderStepCheckItem } from '@/api/QualityManagement'
|
import { getCookie } from '@/utils/auth'
|
|
export default {
|
name: 'ProcessCheck',
|
|
directives: { waves },
|
data() {
|
return {
|
mouseHoverType: 'mouseout',
|
isExpandForm: false,
|
mainHeight: 0,
|
tableHeight: 0,
|
|
form: {
|
orderstepqrcode: '', // 扫描工序二维码信息
|
checktype: 'FirstCheck',
|
|
wocode: '',
|
partcode: '',
|
partname: '',
|
partspec: '',
|
stepcode: '',
|
stepname: '',
|
checkstandcode: '',
|
checkstandname: '',
|
check_type: '',
|
sampmethod: '', // FIXED(固时抽检) SCARE(比例抽检)
|
sampscare: '',
|
qualitystatus: '',
|
good_qty: '', // 指的报工数量
|
sampleqty: '',
|
goodqty: '', // 合格数量
|
ngqty: '', // 不良数量
|
// checkitemcont: [],
|
|
username: getCookie('admin')
|
|
},
|
checktypeArr: [
|
{ code: 'FirstCheck', name: '首检' },
|
{ code: 'PatroCheck', name: '巡检' },
|
{ code: 'EndCheck', name: '完工检' }
|
],
|
stepActive: 0, // 当前处于第几件
|
|
checkItemArr: [],
|
check_result: ''
|
|
}
|
},
|
|
watch: {
|
'checkItemArr': {
|
deep: true, // 深度监听时 监听到属性 当不为深度监听时,可监听长度
|
handler: function(val) {
|
// do something with the new and old value of myArray
|
this.form.goodqty = 0
|
for (var i = 0; i < this.form.sampscare; i++) {
|
const flag = this.checkItemArr.filter(j => j.checkNumber === i + 1).every(j => j.check_result)
|
if (flag) {
|
this.form.goodqty++
|
}
|
}
|
this.form.ngqty = this.form.sampscare - this.form.goodqty
|
}
|
}
|
},
|
|
activated() {
|
window.addEventListener('resize', this.getHeight)
|
this.getHeight()
|
this.getFocus()
|
},
|
created() {
|
|
},
|
mounted() {
|
window.addEventListener('resize', this.getHeight)
|
this.getHeight()
|
|
this.getFocus()
|
},
|
methods: {
|
// 获取聚焦
|
getFocus() {
|
this.$nextTick(() => {
|
$('input[name=\'GXproduceCode\']')[0].focus()
|
})
|
},
|
async enterNative() {
|
const data = {
|
orderstepqrcode: this.form.orderstepqrcode,
|
checktype: this.form.checktype,
|
stu_torgcode: getCookie('stu_torgcode')
|
}
|
const { data: res } = await MesOrderStepCheckSearch(data)
|
this.form.wocode = res.labcont[0].wo_code
|
this.form.partcode = res.labcont[0].partcode
|
this.form.partname = res.labcont[0].partname
|
this.form.partspec = res.labcont[0].partspec ? res.labcont[0].partspec : '/'
|
this.form.stepcode = res.labcont[0].stepcode
|
this.form.stepname = res.labcont[0].stepname
|
this.form.good_qty = res.labcont[0].good_qty
|
|
this.form.checkstandcode = res.chekstand[0].checkstandcode
|
this.form.checkstandname = res.chekstand[0].checkstandname
|
this.form.sampmethod = res.chekstand[0].sampmethod
|
|
this.form.sampscare = res.chekstand[0].sampmethod === 'FIXED' ? res.chekstand[0].sampscare
|
: res.labcont[0].good_qty * res.chekstand[0].sampscare / 100
|
this.form.sampscare = this.form.sampscare <= this.form.good_qty ? this.form.sampscare : this.form.good_qty
|
this.form.sampscare = Math.ceil(this.form.sampscare)// 向上取整
|
await this.getMesOrderStepCheckItemList()
|
},
|
async getMesOrderStepCheckItemList() {
|
const { data: res } = await MesOrderStepCheckItemList({ checkstandcode: this.form.checkstandcode })
|
// this.checkItemArr = res
|
this.checkItemArr = []
|
for (let i = 0; i < this.form.sampscare; i++) {
|
res.forEach(j => {
|
this.checkItemArr.push({
|
checkNumber: i + 1,
|
stepcheckitem_seq: j.stepcheckitem_seq,
|
name: j.name,
|
code: j.code,
|
standvalue: j.standvalue,
|
lowervalue: j.lowervalue,
|
uppervalue: j.uppervalue,
|
|
unit: j.unit,
|
stepcheckitem_desc: j.stepcheckitem_desc,
|
required: j.required, // 是否必填
|
numberjudge: j.numberjudge, // 数值判断
|
real_value: '',
|
check_result: j.numberjudge === 'Y' ? '' : true
|
})
|
})
|
}
|
|
if (this.checkItemArr.every(i => i.check_result)) {
|
this.check_result = true
|
} else {
|
this.check_result = ''
|
}
|
},
|
|
numberChange(currentValue, oldValue) {
|
const t = this.checkItemArr.filter(i => i.checkNumber === 1)
|
|
// 件数变少时执行
|
if (currentValue < this.checkItemArr.length / t.length) {
|
this.checkItemArr.reverse()
|
this.checkItemArr.splice(0, t.length * (oldValue - currentValue))
|
this.checkItemArr.reverse()
|
|
this.stepActive = currentValue - 1
|
}
|
// 件数变多时执行
|
if (currentValue > this.checkItemArr.length / t.length) {
|
for (let i = currentValue; i > oldValue; i--) {
|
t.forEach(j => {
|
this.checkItemArr.push({
|
checkNumber: i,
|
name: j.name,
|
code: j.code,
|
standvalue: j.standvalue,
|
lowervalue: j.lowervalue,
|
uppervalue: j.uppervalue,
|
stepcheckitem_seq: j.stepcheckitem_seq,
|
unit: j.unit,
|
stepcheckitem_desc: j.stepcheckitem_desc,
|
required: j.required, // 是否必填
|
numberjudge: j.numberjudge, // 数值判断
|
real_value: '',
|
check_result: j.numberjudge === 'Y' ? '' : true
|
})
|
})
|
}
|
this.checkItemArr.sort((a, b) => a.checkNumber - b.checkNumber)
|
}
|
},
|
|
pre() {
|
if (this.stepActive > 0) {
|
this.stepActive--
|
}
|
},
|
next() {
|
if (this.stepActive < this.form.sampscare) {
|
this.stepActive++
|
}
|
},
|
|
inputChange(val, item) {
|
if (val !== '') {
|
if (item.numberjudge === 'Y') { // 如果需要进行数值判断
|
if (item.uppervalue === '' && item.lowervalue === '') { // 上限值为空,下限值为空
|
item.check_result = parseFloat(val) === parseFloat(item.standvalue)
|
}
|
|
if (item.uppervalue !== '' && item.lowervalue !== '') { // 上限值不为空,下限值不为空
|
item.check_result = parseFloat(val) >= parseFloat(item.lowervalue) && parseFloat(val) <=
|
parseFloat(item.uppervalue)
|
}
|
|
if (item.uppervalue !== '' && item.lowervalue === '') { // 上限值不为空,下限值为空
|
item.check_result = parseFloat(val) <= parseFloat(item.uppervalue)
|
}
|
|
if (item.uppervalue === '' && item.lowervalue !== '') { // 上限值为空,下限值不为空
|
item.check_result = parseFloat(val) >= parseFloat(item.lowervalue)
|
}
|
}
|
}
|
|
if (val === '') {
|
item.check_result = ''
|
}
|
|
this.check_result = !!this.checkItemArr.every(i => i.check_result)
|
},
|
|
checkResultClick(val, item) {
|
item.check_result = val === 'OK'
|
|
if (this.checkItemArr.filter(i => i.check_result !== '').length === this.checkItemArr.length) {
|
this.check_result = !!this.checkItemArr.every(i => i.check_result)
|
}
|
},
|
|
submitButton() {
|
this.$confirm('是否确认提交?', '提示', {
|
confirmButtonText: '确定',
|
cancelButtonText: '取消',
|
type: 'warning'
|
}).then(() => {
|
const checkitemcont = []
|
this.checkItemArr.forEach((i, index) => {
|
checkitemcont.push({
|
checknum: i.checkNumber + '/' + this.checkItemArr.length / this
|
.checkItemArr.filter(j => j.checkNumber === 1).length,
|
checkiem_seq: i.stepcheckitem_seq,
|
checkitem_code: i.code,
|
checkitem_name: i.name,
|
check_value: i.real_value ? i.real_value : '',
|
check_result: i.check_result ? 'OK' : 'NG',
|
checkitem_descr: ''
|
})
|
})
|
|
const data = {
|
stu_torgcode: getCookie('stu_torgcode'),
|
wocode: this.form.wocode,
|
partcode: this.form.partcode,
|
stepcode: this.form.stepcode,
|
checkstandcode: this.form.checkstandcode,
|
check_type: this.form.checktype,
|
sampmethod: this.form.sampmethod,
|
qualitystatus: this.check_result ? 'OK' : 'NG',
|
good_qty: this.form.good_qty,
|
sampleqty: this.form.sampscare,
|
goodqty: this.form.goodqty,
|
ngqty: this.form.ngqty,
|
admin: this.form.username,
|
checkitemcont
|
}
|
|
SaveMesOrderStepCheckItem(data).then(res => {
|
if (res.code === '200') {
|
this.form.orderstepqrcode = ''
|
|
this.form.wocode = ''
|
this.form.partcode = ''
|
this.form.partname = ''
|
this.form.partspec = ''
|
this.form.stepcode = ''
|
this.form.stepname = ''
|
this.form.checkstandcode = ''
|
this.form.checkstandname = ''
|
this.form.check_type = ''
|
this.form.sampmethod = ''// FIXED(固时抽检) SCARE(比例抽检)
|
this.form.sampscare = ''
|
this.form.qualitystatus = ''
|
this.form.good_qty = '' // 指的报工数量
|
this.form.sampleqty = ''
|
this.form.goodqty = '' // 合格数量
|
this.form.ngqty = '' // 不良数量
|
this.stepActive = 0
|
this.checkItemArr = []
|
this.check_result = ''
|
this.$message.success('检验成功!')
|
this.getFocus()
|
}
|
})
|
})
|
},
|
|
// 获取页面高度
|
getHeight() {
|
this.$nextTick(() => {
|
this.mainHeight = window.innerHeight - 85
|
this.tableHeight = this.mainHeight - 255
|
})
|
},
|
tableRowClassName({ row, rowIndex }) {
|
return 'custom-row'
|
}
|
}
|
}
|
</script>
|
|
<!--公共页面样式-->
|
<style lang="scss" scoped>
|
$main_color: #42b983;
|
::v-deep .el-button--text {
|
font-size: 14px;
|
cursor: pointer;
|
}
|
|
.el-icon-share, .el-icon-delete, .el-icon-edit-outline {
|
color: $main_color;
|
cursor: pointer;
|
}
|
|
.el-icon-edit-outline {
|
margin-right: 15px;
|
}
|
|
::v-deep .el-button--primary, .el-button--warning, .el-button--default, .el-button--info {
|
//height: 34px;
|
//display: flex;
|
//align-items: center;
|
//padding: 0 15px;
|
width: 58px;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
}
|
|
.submitButton {
|
::v-deep .el-button--primary {
|
width: 160px;
|
letter-spacing: 10px;
|
padding-left: 25px;
|
font-size: 18px;
|
//display: flex;
|
//justify-content: center;
|
//align-items: center;
|
}
|
}
|
|
.resultButton {
|
::v-deep .el-button--primary {
|
width: 100px;
|
letter-spacing: 4px;
|
padding-left: 22px;
|
}
|
|
::v-deep .el-button--warning {
|
width: 100px;
|
letter-spacing: 4px;
|
padding-left: 22px;
|
}
|
}
|
|
::v-deep .el-button--default {
|
background-color: #f8f8fa;
|
border: none;
|
}
|
|
::v-deep .el-input__inner {
|
height: 34px;
|
line-height: 34px;
|
//color: #a7a7a7;
|
}
|
|
::v-deep .el-dialog__body {
|
padding: 20px 100px !important;
|
}
|
|
::v-deep .dialogVisibleRoles .el-dialog__body {
|
padding: 20px 20px !important;
|
}
|
|
::v-deep .importPickerClass .el-dialog__body {
|
padding: 20px 20px !important;
|
}
|
|
::v-deep .el-dialog__footer {
|
display: flex;
|
justify-content: flex-end;
|
}
|
|
::v-deep .el-table .caret-wrapper {
|
transform: scale(0.8);
|
}
|
|
::v-deep .cell {
|
display: flex;
|
align-items: center;
|
justify-content: space-between;
|
}
|
|
::v-deep .el-table::before {
|
height: 0;
|
}
|
|
::v-deep .el-table__body-wrapper {
|
background-color: #f8f8fa;
|
}
|
|
::v-deep .el-table__body .el-table__row.hover-row td {
|
background-color: #eaecef;
|
}
|
|
::v-deep .el-form--inline .el-form-item__label {
|
//color: #a7a7a7;
|
//font-size: 16px;
|
}
|
|
.body ::v-deep .el-divider {
|
border: 1px solid #eee;
|
width: 99%;
|
margin: 10px auto;
|
}
|
|
.body ::v-deep .el-form-item {
|
margin-bottom: 0;
|
}
|
|
.userDialogVisible ::v-deep .el-form-item {
|
margin-bottom: 0;
|
}
|
|
::v-deep .el-select__caret {
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
}
|
|
.tableFixed {
|
::v-deep .el-table__fixed-right {
|
height: 100% !important;
|
}
|
|
::v-deep .el-table__fixed {
|
height: 100% !important;
|
}
|
}
|
</style>
|
|
<style lang="scss" scoped>
|
.content1 {
|
display: flex;
|
align-items: center;
|
margin: 10px 0 0 10px;
|
|
.title {
|
font-size: 14px;
|
font-weight: bold;
|
margin-left: 5px;
|
}
|
}
|
|
.content2 {
|
margin: 10px 0 0 20px;
|
display: flex;
|
font-size: 14px;
|
width: 100%;
|
align-items: center;
|
}
|
|
.orderMsg {
|
width: 33.33%;
|
display: flex;
|
align-items: center;
|
}
|
|
::v-deep .el-input-number--medium {
|
line-height: 32px;
|
width: 120px;
|
}
|
|
.checkItem {
|
display: flex;
|
justify-content: space-between;
|
min-height: 36px;
|
|
align-items: center;
|
flex-direction: column;
|
margin-top: 5px;
|
}
|
|
.serialNumber {
|
width: 20px;
|
height: 20px;
|
border-radius: 50%;
|
background-color: #42B983;
|
color: #fff;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
margin-right: 10px;
|
}
|
|
.itemTitle {
|
width: 300px;
|
padding-left: 40px;
|
height: 26px;
|
color: #909399;
|
display: flex;
|
align-items: center;
|
|
::v-deep .el-input--mini {
|
line-height: 24px;
|
height: 24px;
|
}
|
|
::v-deep .el-input__inner {
|
line-height: 24px;
|
height: 24px;
|
}
|
}
|
|
.itemContent {
|
width: 150px;
|
height: 26px;
|
padding-left: 20px;
|
display: flex;
|
align-items: center;
|
|
}
|
|
.orderMsg2 {
|
width: 200px;
|
}
|
</style>
|
|
<style>
|
|
.el-table .custom-row {
|
background: #f8f8fa;
|
}
|
</style>
|