<template>
|
<div>
|
<div class="body" :style="{height:mainHeight+'px'}">
|
<div style="padding-top: 10px;display: flex;flex-direction: column">
|
<div style="margin-bottom: 15px;font-size: 14px">
|
<i class="el-icon-s-operation" style="color:#42b983; margin-right: 5px" />扫码信息
|
</div>
|
<div style="display: flex;align-items: center">
|
<div style="width: 90px;display: flex">
|
<div style="color: red;width:10px">*</div>
|
扫描条码:
|
</div>
|
<el-input
|
v-model="form.orderstepqrcode"
|
name="GXproduceCode"
|
style="width: 300px"
|
@keyup.enter.native="val=>enterNative(val,'GXproduceCode')"
|
/>
|
<!-- @keyup.native="e=>judgeIsScanning(e,'GXproduceCode')"-->
|
|
</div>
|
<!-- 六项信息 -->
|
<div v-if="!isIpad" style="background:#f8f8fa ;display:flex;margin-top: 10px;align-items: center; line-height: 50px">
|
<div style="display: flex; margin-left: 10px">
|
<div style="display: flex;margin-right: 50px">
|
<div style="width: 90px">工单编码:</div>
|
<div style="width: 150px">{{ form.wo_code }}</div>
|
</div>
|
<div style="display: flex;">
|
<div style="width: 90px">产品编码:</div>
|
<div style="width: 150px">{{ form.partcode }}</div>
|
</div>
|
</div>
|
<div style="display: flex;margin-left: 30px;">
|
<div style="display: flex;margin-right: 50px">
|
<div style="width: 90px">产品名称:</div>
|
<div style="width: 150px">{{ form.partname }}</div>
|
</div>
|
<div style="display: flex;">
|
<div style="width: 90px">产品规格:</div>
|
<div style="width: 150px">{{ form.partspec }}</div>
|
</div>
|
</div>
|
<div style=" display: flex;margin-left: 30px;">
|
<div style="display: flex;margin-right: 50px">
|
<div style="width: 90px">工序编码:</div>
|
<div style="width: 150px">{{ form.stepcode }}</div>
|
</div>
|
<div style="display: flex;">
|
<div style="width: 90px">工序名称:</div>
|
<div style="width: 150px">{{ form.stepname }}</div>
|
</div>
|
</div>
|
</div>
|
<div
|
v-if="isIpad"
|
style="display:flex;margin-top: 10px;align-items: center;line-height: 30px; flex-direction: column"
|
>
|
<div style="display: flex; justify-content: flex-start;width: 100%">
|
<div style="display: flex;margin-right: 50px">
|
<div style="width: 90px">工单编码:</div>
|
<div style="width: 200px">{{ form.wo_code }}</div>
|
</div>
|
<div style="display: flex;margin-right: 50px">
|
<div style="width: 90px">产品编码:</div>
|
<div style="width: 200px">{{ form.partcode }}</div>
|
</div>
|
<div style="display: flex;">
|
<div style="width: 90px">产品名称:</div>
|
<div style="width: 200px">{{ form.partname }}</div>
|
</div>
|
</div>
|
|
<div style=" display: flex; justify-content: flex-start;margin-top: 10px;width: 100%">
|
<div style="display: flex;margin-right: 50px">
|
<div style="width: 90px">产品规格:</div>
|
<div style="width: 200px">{{ form.partspec }}</div>
|
</div>
|
<div style="display: flex;margin-right: 50px">
|
<div style="width: 90px">工序编码:</div>
|
<div style="width: 200px">{{ form.stepcode }}</div>
|
</div>
|
<div style="display: flex;">
|
<div style="width: 90px">工序名称:</div>
|
<div style="width: 200px">{{ form.stepname }}</div>
|
</div>
|
</div>
|
</div>
|
|
<div style="margin: 15px 0;font-size: 14px">
|
<i class="el-icon-s-operation" style="color:#42b983; margin-right: 5px" />检验标准信息
|
</div>
|
<div style="display: flex;align-items: center">
|
<div style="width: 90px;display: flex">
|
<div style="color: red;width:10px">*</div>
|
检验标准:
|
</div>
|
<el-select
|
v-model="checkStandard"
|
style="width: 200px;"
|
placeholder="请选择"
|
filterable
|
@change="changeCheckStandard"
|
>
|
<el-option
|
v-for="item in checkStandardSelect"
|
:key="item.code"
|
:label="item.name"
|
:value="item.code"
|
/>
|
</el-select>
|
<div style="width: 90px;margin-left: 50px;display: flex">
|
<div style="color: red;width:10px">*</div>
|
检验人员:
|
</div>
|
<el-select
|
v-model="checkUser"
|
style="width: 200px;"
|
placeholder="请选择"
|
filterable
|
>
|
<el-option
|
v-for="item in checkUserSelect"
|
:key="item.usercode"
|
:label="item.username"
|
:value="item.usercode"
|
/>
|
</el-select>
|
<div style="width: 90px;margin-left: 50px;display: flex">
|
<div style="color: red;width:10px">*</div>
|
检验数量:
|
</div>
|
<el-input v-model="checkqty" oninput="value=value.replace(/[^0-9]/g,'')" style="width: 200px" />
|
</div>
|
|
<!-- 检验结果 和 检验备注 -->
|
<div style="display: flex;margin-top: 20px;align-items: center">
|
|
<div style="display: flex;margin-right: 50px;align-items: center">
|
<div style="width: 90px;display: flex">
|
<div style="color: red;width:10px">*</div>
|
检验结果:
|
</div>
|
<el-select
|
v-model="checkResult"
|
style="width: 200px;"
|
placeholder="请选择"
|
filterable
|
>
|
<el-option
|
v-for="item in checkResultSelect"
|
:key="item.code"
|
:label="item.name"
|
:value="item.code"
|
/>
|
</el-select>
|
</div>
|
<div style="display: flex;align-items: center">
|
<div style="width: 90px">检验备注:</div>
|
<el-input v-model="checkdescr" style="width: 540px" placeholder="请输入" />
|
</div>
|
|
</div>
|
|
<div style="margin: 15px 0;font-size: 14px">
|
<i class="el-icon-s-operation" style="color:#42b983; margin-right: 5px" />检验项信息
|
</div>
|
<div>
|
<el-button type="primary" @click="add">新增</el-button>
|
</div>
|
<div style="margin-top: 10px">
|
<el-table
|
ref="multipleTable"
|
:data="JYTableData"
|
:height="tableHeight+'px'"
|
border
|
:row-class-name="tableRowClassName"
|
:style="{width: 100+'%',height:tableHeight+'px',}"
|
highlight-current-row
|
:header-cell-style="this.$headerCellStyle"
|
:cell-style="this.$cellStyle"
|
@selection-change="handleSelectionChange"
|
@cell-dblclick="cellDblclick"
|
>
|
<el-table-column
|
type="index"
|
label="序号"
|
width="100"
|
fixed
|
/>
|
|
<!-- <el-table-column-->
|
<!-- prop="code"-->
|
<!-- label="检验项目编码(名称)"-->
|
<!-- >-->
|
<!-- <template slot-scope="{row}">-->
|
<!-- <div v-if="row.isVisible===0" style="display: flex;">-->
|
<!-- <div>{{ row.code }}</div>-->
|
<!-- <div style="margin-left: 10px">{{ row.name }}</div>-->
|
<!-- </div>-->
|
|
<!-- <el-select-->
|
<!-- v-if="row.isVisible===1"-->
|
<!-- v-model="row.code"-->
|
<!-- filterable-->
|
<!-- style="width: 400px;"-->
|
<!-- placeholder="请选择"-->
|
<!-- @change="val=>changeCode(val,row)"-->
|
<!-- >-->
|
<!-- <el-option-->
|
<!-- v-for="item in JYSelectArr"-->
|
<!-- :key="item.code"-->
|
<!-- :label="item.code+''+item.name"-->
|
<!-- :value="item.code"-->
|
<!-- />-->
|
<!-- </el-select>-->
|
<!-- </template>-->
|
<!-- </el-table-column>-->
|
|
<el-table-column
|
prop="code"
|
label="检验标准编码"
|
>
|
<template slot-scope="{row}">
|
<div v-if="row.isVisible===0">{{ row.code }}</div>
|
<el-select
|
v-if="row.isVisible===1"
|
v-model="row.code"
|
style="width: 200px;"
|
placeholder="请选择"
|
@change="val=>changeName(val,row)"
|
>
|
<el-option
|
v-for="item in JYSelectArr"
|
:key="item.name"
|
:label="item.code"
|
:value="item.name"
|
/>
|
</el-select>
|
</template>
|
</el-table-column>
|
<el-table-column
|
prop="name"
|
label="检验标准名称"
|
>
|
<template slot-scope="{row}">
|
<div v-if="row.isVisible===0">{{ row.name }}</div>
|
<el-select
|
v-if="row.isVisible===1"
|
v-model="row.name"
|
style="width: 200px;"
|
placeholder="请选择"
|
@change="val=>changeName(val,row)"
|
>
|
<el-option
|
v-for="item in JYSelectArr"
|
:key="item.code"
|
:label="item.name"
|
:value="item.code"
|
/>
|
</el-select>
|
</template>
|
</el-table-column>
|
|
<el-table-column
|
prop="stepcheckitem_desc"
|
label="检验标准描述"
|
>
|
<template slot-scope="scope">
|
<el-input
|
v-if="scope.row.isVisible===1||scope.row.index === tabClickIndex && tabClickLabel === '检验标准描述'"
|
v-model="scope.row.stepcheckitem_desc"
|
placeholder="请输入"
|
@keyup.enter.native="val=>keyUpEnterNative(val,scope.row)"
|
/>
|
<div
|
v-else
|
> {{ scope.row.stepcheckitem_desc }}
|
</div>
|
|
</template>
|
</el-table-column>
|
|
<el-table-column
|
prop="result"
|
label="检验结果"
|
width="100"
|
>
|
<template slot-scope="{row}">
|
<div v-if="row.result==='OK'">合格</div>
|
<div v-if="row.result==='NG'">不良</div>
|
</template>
|
|
<!-- <template slot-scope="{row}">-->
|
<!-- <el-radio-group-->
|
<!-- v-model="row.result"-->
|
<!-- size="small"-->
|
<!-- @change="a=>changeRadioValue(a,row)"-->
|
<!-- >-->
|
<!-- <el-radio-->
|
<!-- :label="0"-->
|
<!-- @change="clickRadio(0,row)"-->
|
<!-- >-->
|
<!-- 合格-->
|
<!-- </el-radio>-->
|
<!-- <el-radio-->
|
<!-- :label="1"-->
|
<!-- @change="clickRadio(1,row)"-->
|
<!-- >-->
|
<!-- 不良-->
|
<!-- </el-radio>-->
|
<!-- </el-radio-group>-->
|
<!-- </template>-->
|
|
</el-table-column>
|
|
<el-table-column
|
type="selection"
|
width="55"
|
/>
|
|
<el-table-column
|
label="操作"
|
fixed="right"
|
>
|
<template slot-scope="{row}">
|
<div class="operationClass">
|
<el-button v-if="row.isVisible===0" type="text" @click="del(row)">删除</el-button>
|
<el-button v-if="row.isVisible===1" type="text" @click="confirm(row)">确认</el-button>
|
<el-button v-if="row.isVisible===1" type="text" @click="cancel(row)">取消</el-button>
|
</div>
|
</template>
|
</el-table-column>
|
</el-table>
|
</div>
|
|
<div style="display: flex;margin: 30px 0;align-items: center">
|
<el-button type="primary" @click="submitButton('FirstCheck')">首检保存</el-button>
|
<el-button type="primary" style="margin-left: 50px" @click="submitButton('PatroCheck')">巡检保存</el-button>
|
<el-button type="primary" style="margin-left: 50px" @click="submitButton('EndCheck')">完工检保存</el-button>
|
<el-button type="info" style="margin-left: 50px" @click="submitButton('Cancel')">取消</el-button>
|
</div>
|
</div>
|
</div>
|
|
</div>
|
</template>
|
|
<script>
|
// import Pagination from '@/components/Pagination'
|
|
// const SER_HZ = /^[\u4e00-\u9fa5]+$/
|
import $ from 'jquery'
|
import {
|
MesOrderStepCheckItemList,
|
MesOrderStepCheckSearch,
|
MesOrderStepCheckSelect, SaveMesOrderStepCheckItem,
|
StepCheckItemSelect
|
} from '@/api/zlgl'
|
import { MesOrderSelectUser } from '@/api/scgl'
|
|
export default {
|
name: 'QXDY',
|
// components: {
|
// Pagination
|
// },
|
data() {
|
return {
|
isIpad: false,
|
mainHeight: 0,
|
tableHeight: 0,
|
form: { // 工序
|
// MO-2022-07-0001_1;001
|
orderstepqrcode: '', // 扫描的二维码信息
|
wo_code: '', // 工单编码
|
partcode: '', // 产品编码
|
partname: '', // 产品名称
|
partspec: '', // 产品规格
|
stepcode: '', // 工序编码
|
stepname: ''// 工序名称
|
},
|
checkStandard: '', // 检验标准
|
checkStandardSelect: [], // 检验标准下拉数组
|
checkUser: '', // 检验人员
|
checkqty: 0, // 检验数量
|
checkUserSelect: [], // 检验人员下拉数组
|
checkResult: '', // 检验结果
|
checkResultSelect: [
|
{ code: 'OK', name: '合格' },
|
{ code: 'NG', name: '不良' }
|
], // 检验结果下拉数组
|
checkdescr: '', // 检验备注(描述)
|
|
JYTableData: [], // 检验项信息表格
|
JYSelectArr: [], // 检验下拉数组
|
// JYSelectedArr: [], // 已选检验项目数组
|
JYIsCancel: true,
|
multipleSelection: [], // 表格多选框
|
tabClickIndex: null, // 点击的单元格
|
tabClickLabel: '', // 当前点击的列名
|
isCancel: false, // 是否点击取消按钮
|
judgeIsScanningArr: []// 判断是否扫码数组
|
}
|
},
|
created() {
|
this.handleRequest()
|
},
|
mounted() {
|
window.addEventListener('resize', this.getHeight)
|
this.getHeight()
|
|
this.getFocus()
|
},
|
methods: {
|
handleRequest() {
|
this.getMesOrderStepCheckSelect().then(res => {
|
if (res.code === '200') {
|
this.getMesOrderSelectUser()
|
this.getJYSelectArr()
|
}
|
})
|
},
|
|
// 获取聚焦
|
getFocus() {
|
this.$nextTick(() => {
|
$("input[name='GXproduceCode']")[0].focus()
|
})
|
},
|
// 获取检验标准下拉数组
|
async getMesOrderStepCheckSelect() {
|
const res = await MesOrderStepCheckSelect()
|
this.checkStandardSelect = res.data
|
return { code: res.code }
|
},
|
// 获取检验人员下拉
|
async getMesOrderSelectUser() {
|
const { data: res } = await MesOrderSelectUser()
|
this.checkUserSelect = res
|
},
|
// 获取检验项下拉数组
|
async getJYSelectArr() {
|
const { data: res } = await StepCheckItemSelect()
|
this.JYSelectArr = res
|
},
|
// 检验标准下拉值改变
|
async changeCheckStandard(val) {
|
await this.getJYSelectArr()
|
this.isCancel = false
|
|
const { data: res } = await MesOrderStepCheckItemList({ checkstandcode: val })
|
this.JYTableData = res
|
|
// let arr = […b].filter(x => […a].every(y => y.id !== x.id));
|
this.JYSelectArr = [...this.JYSelectArr].filter(x => [...this.JYTableData].every(y => y.code !== x.code))
|
|
this.JYTableData.forEach(item => {
|
let number = Math.random() * Math.random()// 作为删除时的标识符
|
number = number === 0 ? (10 + Math.random()) : number
|
|
// item.result = 0 // 0合格 1不良
|
item.result = 'OK'
|
|
item.isVisible = 0
|
item.number = number
|
})
|
this.$refs.multipleTable.toggleAllSelection()
|
},
|
// changeRadioValue(val, row) {
|
// console.log(val, row.result, 20000)
|
// },
|
// clickRadio(e, row) {
|
// console.log(e, row.result, 10000)
|
// row.result = e
|
// },
|
handleSelectionChange(val) {
|
this.multipleSelection = val
|
const arr = this.multipleSelection.map(i => i.number)
|
this.JYTableData.forEach(it => {
|
if (arr.includes(it.number)) {
|
it.result = 'OK'
|
} else {
|
it.result = 'NG'
|
}
|
})
|
|
if (this.multipleSelection.length > 0 && this.multipleSelection.length === this.JYTableData.length) {
|
this.checkResult = 'OK'
|
} else {
|
this.checkResult = 'NG'
|
}
|
if (this.isCancel) {
|
this.checkResult = ''
|
}
|
},
|
// 检验项目编码(名称)
|
changeName(val, row) {
|
const res = this.JYSelectArr.find(item => {
|
return item.code === val || item.name === val
|
})
|
row.code = res.code
|
row.name = res.name
|
row.stepcheckitem_desc = res.descr
|
},
|
// 防抖 //扫码用的是防抖
|
fnThrottle(method, delay, duration, belong) {
|
var that = this
|
var timer = this.timer
|
var begin = new Date().getTime()
|
return function() {
|
var current = new Date().getTime()
|
clearTimeout(timer)
|
if (current - begin >= duration) {
|
// method()
|
// that.VALUE()
|
begin = current
|
} else {
|
that.timer = setTimeout(function() {
|
// method()
|
that.enterNative(that.form.orderstepqrcode, belong)
|
}, delay)
|
}
|
}
|
},
|
// 判断是否是扫码枪扫码
|
judgeIsScanning(e, belong) {
|
const timenow = e.timeStamp
|
let flag = true
|
this.judgeIsScanningArr.push(timenow)
|
let i
|
for (i in this.judgeIsScanningArr) {
|
flag = Math.ceil(this.judgeIsScanningArr[this.judgeIsScanningArr.length - 1]) - Math.ceil(this.judgeIsScanningArr[this.judgeIsScanningArr.length - 2]) < 0.1
|
if (i > 0 && this.judgeIsScanningArr.length === parseInt(i) + 1) {
|
if (flag) {
|
this.fnThrottle(this.enterNative, 500, 2000, belong)()
|
return
|
}
|
}
|
}
|
},
|
// 扫码键盘回车事件
|
async enterNative(val, belong) {
|
if (belong === 'GXproduceCode') {
|
const res = await MesOrderStepCheckSearch({ orderstepqrcode: this.form.orderstepqrcode })
|
this.form.wo_code = res.data[0].wo_code
|
this.form.partcode = res.data[0].partcode
|
this.form.partname = res.data[0].partname
|
this.form.partspec = res.data[0].partspec
|
this.form.stepcode = res.data[0].stepcode
|
this.form.stepname = res.data[0].stepname
|
}
|
},
|
|
// 新增
|
add() {
|
if (this.JYTableData.length === 0) {
|
return this.$message.info('请先选择检验标准!')
|
}
|
if (this.JYTableData.length > 0 && this.JYTableData[this.JYTableData.length - 1].isVisible === 1) {
|
return this.$message.info('请先确定或取消本条记录!')
|
}
|
|
let number = Math.random() * Math.random()// 作为删除时的标识符
|
number = number === 0 ? (10 + Math.random()) : number
|
const data = { result: 'OK', code: '', name: '', stepcheckitem_desc: '', isVisible: 1, number }
|
this.JYTableData.push(data)
|
this.$refs.multipleTable.toggleRowSelection(data, true)
|
|
this.JYIsCancel = false
|
},
|
|
// 确认
|
confirm(row) {
|
if (row.code === '') {
|
return this.$message.info('检验项目编码不能为空!')
|
}
|
if (row.name === '') {
|
return this.$message.info('检验项目名称不能为空!')
|
}
|
|
this.JYSelectArr.forEach((item, index) => {
|
if (item.code === row.code) {
|
this.JYSelectArr.splice(index, 1)
|
}
|
})
|
|
this.JYTableData.forEach((item, index) => {
|
if (item.number === row.number) {
|
item.isVisible = 0
|
item.code = row.code
|
item.name = row.name
|
item.result = row.result
|
item.stepcheckitem_desc = row.stepcheckitem_desc
|
}
|
})
|
|
if (this.multipleSelection.length > 0 && this.multipleSelection.length === this.JYTableData.length) {
|
this.checkResult = 'OK'
|
} else {
|
this.checkResult = 'NG'
|
}
|
},
|
// 取消
|
cancel(row) {
|
this.JYTableData.forEach((item, index) => {
|
if (item.number === row.number) {
|
this.JYTableData.splice(index, 1)
|
}
|
})
|
|
if (this.JYIsCancel && row.code.toString().length > 0) {
|
this.JYSelectArr.splice(0, 0, {
|
code: row.code,
|
name: row.name,
|
descr: row.stepcheckitem_desc
|
})
|
}
|
this.JYIsCancel = true
|
},
|
|
// 删除
|
del(row) {
|
this.JYSelectArr.splice(0, 0, {
|
code: row.code,
|
name: row.name,
|
descr: row.stepcheckitem_desc
|
})
|
|
this.JYTableData.forEach((item, index) => {
|
if (item.number === row.number) {
|
this.JYTableData.splice(index, 1)
|
}
|
})
|
},
|
// 提交
|
submitButton(val) {
|
if (val !== 'Cancel') {
|
if (this.form.orderstepqrcode.length < 1) {
|
return this.$message.info('扫描条码不能为空!')
|
}
|
if (this.checkStandard.length < 1) {
|
return this.$message.info('检验标准不能为空!')
|
}
|
if (this.checkUser.length < 1) {
|
return this.$message.info('检验人员不能为空!')
|
}
|
if (parseFloat(this.checkqty) <= 0) {
|
return this.$message.info('检验数量必须要大于零!')
|
}
|
if (this.JYTableData.length < 1) {
|
return this.$message.info('检验项信息不能为空!')
|
}
|
if (this.checkResult.length < 1) {
|
return this.$message.info('检验结果不能为空!')
|
}
|
|
const text = val === 'FirstCheck' ? '首检保存' : (val === 'PatroCheck' ? '巡检保存' : '完工检保存')
|
this.$confirm('是否确认' + text + '?', '提示', {
|
confirmButtonText: '确定',
|
cancelButtonText: '取消',
|
type: 'warning'
|
}).then(() => {
|
const arr = []
|
this.JYTableData = this.JYTableData.filter(item => item.code !== '')
|
this.JYTableData.forEach((item, index) => {
|
arr.push({
|
code: item.code,
|
name: item.name,
|
seq: (index + 1),
|
descr: item.stepcheckitem_desc,
|
checkresult: item.result
|
})
|
})
|
const data = {
|
'mesordercode': this.form.wo_code, // 工单编号
|
'partcode': this.form.partcode, // 产品编码
|
'stepcode': this.form.stepcode, // 工序编码
|
'checkstanedcode': this.checkStandard, // 检验标准编码
|
'checkusercode': this.checkUser, // 检验人员编码
|
'checkqty': this.checkqty, // 检验数量
|
'checktypecode': val, // 检验类型编码
|
'checkresult': this.checkResult, // 检验结果(OK(合格) NG(不良))
|
'checkdescr': this.checkdescr, // 检验描述
|
'data': arr
|
}
|
SaveMesOrderStepCheckItem(data).then(res => {
|
if (res.code === '200') {
|
this.$message.success(text + '成功!')
|
this.clearContent()
|
this.getFocus()
|
this.getJYSelectArr()
|
}
|
})
|
}).catch(() => {
|
this.$message.info('已取消保存')
|
})
|
} else {
|
this.clearContent()
|
this.getFocus()
|
this.getJYSelectArr()
|
}
|
},
|
// 清空页面内容
|
clearContent() {
|
this.JYTableData = []
|
this.multipleSelection = []
|
this.checkdescr = ''
|
this.checkUser = ''
|
this.checkqty = 0
|
this.checkResult = ''
|
this.checkStandard = ''
|
this.form.orderstepqrcode = ''
|
this.form.wo_code = ''
|
this.form.partcode = ''
|
this.form.partname = ''
|
this.form.partspec = ''
|
this.form.stepcode = ''
|
this.form.stepname = ''
|
|
this.judgeIsScanningArr = []
|
|
this.isCancel = true
|
},
|
|
// 单元格被点击时
|
cellDblclick(row, column, cell, event) {
|
console.log(row, column, cell, event)
|
console.log(column.label)
|
console.log(row.index)
|
switch (column.label) {
|
case '检验标准描述':
|
this.tabClickIndex = row.index
|
this.tabClickLabel = column.label
|
break
|
// case '判责金额(元)':
|
// this.tabClickIndex = row.index
|
// this.tabClickLabel = column.label
|
// break
|
default:
|
return
|
}
|
},
|
// 回车事件
|
keyUpEnterNative(val, row) {
|
this.tabClickLabel = ''
|
},
|
|
tableRowClassName({ row, rowIndex }) {
|
// 把每一行的索引放进row
|
row.index = rowIndex
|
return 'custom-row'
|
},
|
// 获取页面高度
|
getHeight() {
|
this.$nextTick(() => {
|
this.mainHeight = window.innerHeight - 85
|
this.tableHeight = this.mainHeight - 450
|
|
this.isIpad = window.innerHeight < 769 && window.innerWidth < 1367
|
})
|
}
|
}
|
}
|
</script>
|
|
<style lang="scss" scoped>
|
::v-deep .el-select .el-input .el-select__caret {
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
}
|
</style>
|
<!--公共页面样式-->
|
<style lang="scss" scoped>
|
$main_color: #42b983;
|
.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--default, .el-button--info {
|
height: 34px;
|
display: flex;
|
align-items: center;
|
padding: 0 15px;
|
}
|
|
::v-deep .el-button--primary {
|
//background-color: $main_color !important;
|
}
|
|
::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;
|
}
|
|
.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;
|
}
|
|
</style>
|
<style>
|
|
.el-table .custom-row {
|
background: #f8f8fa;
|
}
|
</style>
|