EL中的param和params

本文详细解释了Java Web开发中常用的EL表达式的使用方法,包括如何通过${param.name}

 

${param.name}等价于request.getParameter(“name”),{param[name]}也是一样的。

${params.name}等价于request.getParameterValues(”name”),大多用于获取客户端的数组数据,如页面的复选框的值。

 

注意:${requestScope.name} 等价于 request.getAttribute(“name”)

         ${name}没有指定从哪个作用域中取数据,会按顺序pageScope、requestScope、sessionScope、applicationScope,从最小的作用域开始搜索为name的值。

 

各种得到属性的EL表达式:

${scope.attribute},其中scope指pageSocpe、requestScope、sessionScope、applicationScope,attribute指的就是你在某个scope中设置的属性了。

 

 

<!-- 供应商质量管理-供应商索赔管理-修改新增界面 --> <template> <div class="app-container"> <el-form ref="modelForm" :model="modalForm" :title="title" :rules="rules"> <div class="form-title"> {{ title }} </div> <div class="form-bordered"> <el-collapse v-model="activeNames"> <!-- 基本信息 --> <el-collapse-item name="1"> <template slot="title">{{ $t('BasicInformation') }}<span style="color: #004097; font-weight: 900">({{ $t('ClickToExpandOrcollapse') }})</span></template> <div class="form-bordered"> <!-- pd发起的流程 --> <template v-if="modalForm.roles == 'PD'"> <el-row> <!-- 编号 --> <el-col :span="12"> <el-form-item :label="$t('rm.rm.formCode')"> <span v-if="modalForm.formCode">{{ modalForm.formCode }}</span><span v-else style="color: red;">提交后自动生成</span> </el-form-item> </el-col> <!-- 来源 --> <el-col :span="12"> <el-form-item :label="$t('spl.supplierClaim.source')"> <el-input v-model="modalForm.source" clearable :placeholder="$t('pleaseEnter', { param: $t('spl.supplierClaim.source') })" /> </el-form-item> </el-col> </el-row> <el-row> <!-- 供方简称 --> <el-col :span="12"> <el-form-item :label="$t('spl.supplierClaim.shortName')" prop="shortName" :rules="[{ required: true, message: $t('pleaseEnter', { param: $t('spl.supplierClaim.shortName'), }), trigger: 'blur', },]"> <dataSelect v-model="modalForm.shortName" :title="'选择供应商主数据'" :api="getSupplierList" :columns="[ { label: $t('baseData.supplier.supplierCode'), code: 'supplierCode' }, { label: $t('baseData.supplier.supplierName'), code: 'supplierName' }, ]" :search-params-list="[ { label: $t('baseData.supplier.supplierCode'), code: 'supplierCode' }, { label: $t('baseData.supplier.supplierName'), code: 'supplierName' }, ]" :show-search="true" :on-page="false" :model-form="modalForm" :select-name="'shortName'" :single-select="true" :bind-object="{ label: 'supplierName', key: 'supplierName' }" :default-ids="modalForm.shortName" :default-names="modalForm.shortName" @selectUserClosepopIndex="(list) => doGetMainPd(list, modalForm)" /> </el-form-item> </el-col> <!-- 申请部门名称 --> <el-col :span="12"> <el-form-item :label="$t('spl.supplierClaim.applyDeptBy')" prop="applyDeptBy"> <org-picker ref="orgPickerApplyDeptBy" type="dept" :multiple="false" :parent-this="this" :form-props="'applyDeptBy'" :selected.sync="modalForm.applyDeptBy" /> </el-form-item> </el-col> </el-row> <el-row> <!-- 申请日期 --> <el-col :span="12"> <el-form-item :label="$t('spl.supplierClaim.applicatTime')" prop="applicatTime"> <el-date-picker v-model="modalForm.applicatTime" show-time clearable value-format="yyyy-MM-dd" /> </el-form-item> </el-col> <!-- 物料名称 --> <el-col :span="12"> <el-form-item :label="$t('spl.supplierClaim.materialName')" prop="materialCode"> <dataSelect v-model="modalForm.materialName" :title="'选择物料主数据'" :api="getMaterialMasterDataList" :columns="[{ label: '物料编码', code: 'materialCode' }, { label: '物料名称', code: 'materialName' }]" :search-params-list="[{ label: '物料编码', code: 'materialCode' }, { label: '物料名称', code: 'materialName' }]" :show-search="true" :on-page="false" :model-form="modalForm" :select-name="'materialName'" :single-select="false" :bind-object="{ label: 'materialName', key: 'materialCode' }" :default-ids="modalForm.materialCode" :default-names="modalForm.materialName" @selectUserClosepop="(list) => doGetMaterial(list, modalForm)" /> </el-form-item> </el-col> </el-row> <el-row> <!-- 物料编码 --> <el-col :span="12"> <el-form-item :label="$t('spl.supplierClaim.materialCode')" prop="materialCode"> <el-input disabled v-model="modalForm.materialCode" readonly /> </el-form-item> </el-col> <!-- 订单号 --> <el-col :span="12"> <el-form-item :label="$t('spl.supplierClaim.orderCode')"> <el-input v-model="modalForm.orderCode" clearable :placeholder="$t('pleaseEnter', { param: $t('spl.supplierClaim.orderCode') })" /> </el-form-item> </el-col> </el-row> <el-row> <!-- 数量 --> <el-col :span="12"> <el-form-item :label="$t('spl.supplierClaim.quantityNum')" prop="quantityNum"> <el-input v-model="modalForm.quantityNum" clearable :placeholder="$t('pleaseEnter', { param: $t('spl.supplierClaim.quantityNum') })" /> </el-form-item> </el-col> <!-- 质量协议 --> <el-col :span="12"> <el-form-item :label="$t('spl.supplierClaim.dealUrl')"> <fileUpload v-model="modalForm.dealUrl" :limit="1" :is-read-only="false" /> </el-form-item> </el-col> </el-row> <el-row> <!-- 异常描述 --> <el-col :span="12"> <el-form-item :label="$t('spl.supplierClaim.description')" prop="description"> <el-input v-model="modalForm.description" type="textarea" clearable @change="descriptionChange()" :placeholder="$t('pleaseEnter', { param: $t('spl.supplierClaim.description') })" /> </el-form-item> </el-col> <!-- 异常描述附件 --> <el-col :span="12"> <el-form-item :label="$t('spl.supplierClaim.descriptionUrl')"> <fileUpload v-model="modalForm.descriptionUrl" :limit="1" :is-read-only="false" /> </el-form-item> </el-col> </el-row> <el-row> <!-- sqe --> <el-col :span="12"> <el-form-item :label="$t('SQE')" prop="sqe"> <el-select v-model="modalForm.sqeName" :placeholder="$t('pleaseEnter', { param: $t('SQE') })" @change="sqeChange"> <el-option v-for="(item, index) in sqeList" :key="index" :label="item.label" :value="item.label"></el-option> </el-select> </el-form-item> </el-col> <el-col :span="12"></el-col> </el-row> </template> <template v-else> <el-row> <!-- 编号 --> <el-col :span="12"> <el-form-item :label="$t('rm.rm.formCode')"> <span v-if="modalForm.formCode">{{ modalForm.formCode }}</span><span v-else style="color: red;">提交后自动生成</span> </el-form-item> </el-col> <!-- 来源 --> <el-col :span="12"> <el-form-item :label="$t('spl.supplierClaim.source')" prop="source"> <el-input v-model="modalForm.source" clearable :placeholder="$t('pleaseEnter', { param: $t('spl.supplierClaim.source') })" /> </el-form-item> </el-col> </el-row> <el-row> <!-- 供方简称 --> <el-col :span="12"> <el-form-item :label="$t('spl.supplierClaim.shortName')" prop="shortName" :rules="[{ required: true, message: $t('pleaseEnter', { param: $t('spl.supplierClaim.shortName'), }), trigger: 'blur', },]"> <dataSelect v-model="modalForm.shortName" :title="'选择供应商主数据'" :api="getSupplierList" :columns="[ { label: $t('baseData.supplier.supplierCode'), code: 'supplierCode' }, { label: $t('baseData.supplier.supplierName'), code: 'supplierName' }, ]" :search-params-list="[ { label: $t('baseData.supplier.supplierCode'), code: 'supplierCode' }, { label: $t('baseData.supplier.supplierName'), code: 'supplierName' }, ]" :show-search="true" :on-page="false" :model-form="modalForm" :select-name="'shortName'" :single-select="true" :bind-object="{ label: 'supplierName', key: 'supplierName' }" :default-ids="modalForm.shortName" :default-names="modalForm.shortName" @selectUserClosepopIndex="(list) => doGetMain(list, modalForm)" /> </el-form-item> </el-col> <!-- 申请部门名称 --> <el-col :span="12"> <el-form-item :label="$t('spl.supplierClaim.applyDeptBy')" prop="applyDeptBy"> <org-picker ref="orgPickerApplyDeptBy" type="dept" :multiple="false" :parent-this="this" :form-props="'applyDeptBy'" :selected.sync="modalForm.applyDeptBy" /> </el-form-item> </el-col> </el-row> <el-row> <!-- 申请日期 --> <el-col :span="12"> <el-form-item :label="$t('spl.supplierClaim.applicatTime')" prop="applicatTime"> <el-date-picker v-model="modalForm.applicatTime" show-time clearable value-format="yyyy-MM-dd" /> </el-form-item> </el-col> <!-- 物料名称 --> <el-col :span="12"> <el-form-item :label="$t('spl.supplierClaim.materialName')" prop="materialCode"> <dataSelect v-model="modalForm.materialName" :title="'选择物料主数据'" :api="getMaterialMasterDataList" :columns="[{ label: '物料编码', code: 'materialCode' }, { label: '物料名称', code: 'materialName' }]" :search-params-list="[{ label: '物料编码', code: 'materialCode' }, { label: '物料名称', code: 'materialName' }]" :show-search="true" :on-page="false" :model-form="modalForm" :select-name="'materialName'" :single-select="false" :bind-object="{ label: 'materialName', key: 'materialCode' }" :default-ids="modalForm.materialCode" :default-names="modalForm.materialName" @selectUserClosepop="(list) => doGetMaterial(list, modalForm)" /> </el-form-item> </el-col> </el-row> <el-row> <!-- 物料编码 --> <el-col :span="12"> <el-form-item :label="$t('spl.supplierClaim.materialCode')" prop="materialCode"> <el-input disabled v-model="modalForm.materialCode" readonly /> </el-form-item> </el-col> <!-- 订单号 --> <el-col :span="12"> <el-form-item :label="$t('spl.supplierClaim.orderCode')"> <el-input v-model="modalForm.orderCode" clearable :placeholder="$t('pleaseEnter', { param: $t('spl.supplierClaim.orderCode') })" /> </el-form-item> </el-col> </el-row> <el-row> <!-- 数量 --> <el-col :span="12"> <el-form-item :label="$t('spl.supplierClaim.quantityNum')" prop="quantityNum"> <el-input v-model="modalForm.quantityNum" clearable :placeholder="$t('pleaseEnter', { param: $t('spl.supplierClaim.quantityNum') })" /> </el-form-item> </el-col> <!-- 质量协议 --> <el-col :span="12"> <el-form-item :label="$t('spl.supplierClaim.dealUrl')"> <fileUpload v-model="modalForm.dealUrl" :limit="1" :is-read-only="false" /> </el-form-item> </el-col> </el-row> <el-row> <!-- 异常描述 --> <el-col :span="12"> <el-form-item :label="$t('spl.supplierClaim.description')" prop="description"> <el-input v-model="modalForm.description" type="textarea" clearable @change="descriptionChange()" :placeholder="$t('pleaseEnter', { param: $t('spl.supplierClaim.description') })" /> </el-form-item> </el-col> <!-- 异常描述附件 --> <el-col :span="12"> <el-form-item :label="$t('spl.supplierClaim.descriptionUrl')"> <fileUpload v-model="modalForm.descriptionUrl" :limit="1" :is-read-only="false" /> </el-form-item> </el-col> </el-row> <el-row> <!-- sqe --> <el-col :span="12"> <el-form-item :label="$t('SQE')" prop="sqe"> <org-picker v-if="modalForm.roles == 'CQE'" ref="orgPickersqe" type="user" :multiple="false" :parent-this="this" :form-props="'sqe'" :selected.sync="modalForm.sqe" /> <org-picker-view v-else :value.sync="modalForm.sqe" /> </el-form-item> </el-col> <el-col :span="12"></el-col> </el-row> <el-row v-if="roleId == 1"> </el-row> </template> </div> </el-collapse-item> <el-collapse-item name="2"> <template slot="title">异常费用核算<span style="color: #004097; font-weight: 900">({{ $t('ClickToExpandOrcollapse') }})</span></template> <el-tabs v-model="activeTab" @tab-click="updateTableData" type="card" @edit="removeTab"> <!-- <el-tab-pane v-for="(item , index) in modalForm.classifyList" :key="index" :label="item.materialName" :name="item.id">--> <el-tab-pane v-for="item in classifyList" :key="item.materialCode" :label="`${item.materialName} - ${item.materialCode}`" :name="item.materialCode" > <!-- <div v-for="(sub, sIdx) in item.subList" :key="sIdx" style="margin-bottom: 20px;"> --> <el-row > <el-col :span="24"> <el-table :key="contentTable" :data="item.subList" border> <el-table-column align="center" :label="$t('operation')" width="100"> <template slot-scope="scope"> <div class="el-zlw-operate"> <div> <a href="javascript:" @click="copysonList(item.subList, scope)"><i class="el-icon-copy-document" /></a> <a href="javascript:" @click="addsonList(item.subList, scope)"><i class="el-icon-circle-plus-outline" /></a> <a v-show="item.subList.length > 1" href="javascript:" @click="removesonList(item.subList, scope)"><i class="el-icon-remove-outline" /></a> </div> </div> </template> </el-table-column> <el-table-column align="center" type="index" :label="$t('no')" width="50" /> <!-- 修订前项次内容--> <el-table-column align="center" header-align="center"> <template slot="header"> <span class="required">{{ $t('qualitySystem.systemfile.beforeReviseItemContent') }}</span> </template> <template slot-scope="scope"> <el-form-item label-width="0" :prop="'subList.' + scope.$index + '.materialCode'" :rules="[{ required: true, message: $t('pleaseEnter', { param: $t('qualitySystem.systemfile.beforeReviseItemContent') }), trigger: 'blur' }]"> <el-input v-model="scope.row.materialCode" clearable type="textarea" :rows="2" maxlength="100" :placeholder="$t('pleaseEnter', { param: $t('qualitySystem.systemfile.beforeReviseItemContent') })" /> <!-- <span v-else>{{ scope.row.beforeReviseItemContent }}</span> --> </el-form-item> </template> </el-table-column> </el-table> </el-col> </el-row> <div style="padding: 15px; background: #fafafa; border-radius: 6px;"> <h4>{{ item.materialName }}</h4> <!-- 子级列表 subList --> <div v-for="(sub, sIdx) in item.subList" :key="sIdx" style="margin-bottom: 20px;"> <el-input v-model="sub.materialCode" placeholder="请输入子级合计费用" style="width: 200px; margin-right: 10px;" ></el-input> <!-- 孙级列表 sonList --> <div style="margin-left: 20px; margin-top: 8px;"> <div v-for="(son, sonIdx) in sub.sonList" :key="sonIdx" style="margin-bottom: 8px;"> <el-input v-model="son.workPeople" placeholder="请输入孙级加班工时" style="width: 200px; margin-right: 10px;" ></el-input> <el-button size="mini" type="danger" icon="el-icon-delete" @click="removeSon(sub, sonIdx)" circle></el-button> </div> <el-button size="mini" icon="el-icon-plus" @click="addSon(sub)">新增孙级</el-button> </div> <!-- 删除子级 --> <el-button size="mini" type="warning" style="margin-top: 5px;" @click="removeSub(item, sIdx)"> 删除此子级 </el-button> </div> <!-- 添加子级 --> <el-button size="small" type="primary" @click="addSub(item)">+ 添加子级</el-button> </div> </el-tab-pane> </el-tabs> </el-collapse-item> </el-collapse> </div> </el-form> </div> </template> <script> import { getSupplierClaimInfo, getSupplySqeByCode, getSupplyInfoByCode, getUserInfoByRoleCode, getSupplyInfoBySupplyCode, addSupplierClaim, updateSupplierClaim } from '@/api/spl/supplierClaim/api'; import { getSupplierList } from '@/api/baseData/supplier/api'; import { getMaterialMasterDataList } from '@/api/baseData/materialMasterData/api'; import { getDicts } from '@/api/baseData/dict/api'; import moment from 'moment'; import dataSelect from 'zlw/components/common/tool/dataSelect.vue' import viewSettings from "@/components/viewSettings"; function Form() { return { id: null,// 主键ID version: null,// 乐观锁 deleteFlag: null,// 删除标识 state: null,// 状态 formCode: null,// 编号 currentProcessorBy: null,// 当前流程处理人 currentProcessorId: null,// 当前流程处理人ID createDeptPathBy: null,// 创建部门 createDeptPathId: null,// 创建部门ID processFlow: null,// 处理流程 year: null,// 年度 code: null,// 编号 formState: null,// 表单状态 shortName: null,// 供方简称 materialCode: null,// 物料编码 materialName: null,// 物料名称 categoryId: null,// 供应商品类id categoryBy: null,// 供应商品类名称 applyDeptId: null,// 申请部门id applyDeptBy: null,// 申请部门名称 amount: null,// 索赔金额 applicatId: null,// 申请人id applicatBy: null,// 申请人名称 applicatTime: null,// 申请日期 source: null,// 来源 orderCode: null,// 订单号 quantityNum: null,// 数量 dealUrl: null,// 质量协议 description: null,// 异常描述 descriptionUrl: null,// 异常描述附件 hasReconciliationNumber: null,// 是否对账 hasReconciliationNumber1: null,// 是否对账 purchaserBy: null,// 采购人 purchaserBy1: null,// 采购人 purchaserByName: null, //采购人 workPeople: null,// 加工人数 workTime: null,// 加工时间 workPrice: null,// 小时单价 workTotal: null,// 加工费合计 matterName: null,// 材料名称 matterNum: null,// 材料损失费数量 matterPrice: null,// 损失费单价 matterTotal: null,// 材料损失费合计 delayNum: null,// 误工人数 delayTime: null,// 误工时间 delayPrice: null,// 误工单价 delayTotal: null,// 误工合计 otherIndemnity: null,// 其它客户赔款 otherPenalize: null,// 其它品质处罚 otherTotal: null,// 其它合计 parentId: null,// 父级id roles: null, // 角色 money: 1, amount: 1, backState: null, backIdea: null, supplierId: null, sqe: null, supplierName: null, sqeName: null, isOnline: '线上', otherTypes: null, otherTypesAmounts: null, classifyList:[new classifyListForm()], } } function classifyListForm() { return { id: null, parentId: null, materialCode: null, materialName: null, costList:[new costListForm()], } } function costListForm() { return { id: null, parentId: null, feeType: null, workPeople: null, workTime: null, } } export default { name: 'SupplierClaimCreateOrEdit', components: { dataSelect, viewSettings }, data() { return { // 表单数据 modalForm: new Form(), // 所有选中的物料及其子表单数据 classifyList: [], activeTab: '', getSupplierList, getMaterialMasterDataList, // 标题 title: '供应商索赔确认单', sonObj: {}, // 表单参数 defaultProps: { children: 'children', label: 'label' }, userinfo: {}, select: null, propsBpm: null, rules: { // 校验 year: [{ required: true, message: this.$t('pleaseEnter', { param: this.$t('spl.supplierClaim.year') }), trigger: 'blur' }], //年度 code: [{ required: true, message: this.$t('pleaseEnter', { param: this.$t('spl.supplierClaim.code') }), trigger: 'blur' }], //编号 //表单状态 formState: [{ required: true, message: this.$t('pleaseEnter', { param: this.$t('spl.supplierClaim.formState') }), trigger: 'blur' }], //供方简称 shortName: [{ required: true, message: this.$t('pleaseEnter', { param: this.$t('spl.supplierClaim.shortName') }), trigger: 'blur' }], //供应商品类id categoryId: [{ required: true, message: this.$t('pleaseEnter', { param: this.$t('spl.supplierClaim.categoryId') }), trigger: 'blur' }], //供应商品类名称 categoryBy: [{ required: true, message: this.$t('pleaseEnter', { param: this.$t('spl.supplierClaim.categoryBy') }), trigger: 'blur' }], //申请部门id applyDeptId: [{ required: true, message: this.$t('pleaseEnter', { param: this.$t('spl.supplierClaim.applyDeptId') }), trigger: 'blur' }], //申请部门名称 applyDeptBy: [{ required: true, message: this.$t('pleaseEnter', { param: this.$t('spl.supplierClaim.applyDeptBy') }), trigger: 'blur' }], //物料名称 materialName: [{ required: true, message: this.$t('pleaseEnter', { param: this.$t('spl.supplierClaim.materialName') }), trigger: 'blur' }], //物料编码 materialCode: [{ required: true, message: this.$t('pleaseEnter', { param: this.$t('spl.supplierClaim.materialCode') }), trigger: 'blur' }], amount: [{ required: true, message: this.$t('pleaseEnter', { param: this.$t('spl.supplierClaim.amount') }), trigger: 'blur' }], //索赔金额 //申请人id applicatId: [{ required: true, message: this.$t('pleaseEnter', { param: this.$t('spl.supplierClaim.applicatId') }), trigger: 'blur' }], //SQE sqe: [{ required: true, message: this.$t('pleaseEnter', { param: this.$t('SQE') }), trigger: 'blur' }], //申请日期 applicatTime: [{ required: true, message: this.$t('pleaseEnter', { param: this.$t('spl.supplierClaim.applicatTime') }), trigger: 'blur' }], source: [{ required: true, message: this.$t('pleaseEnter', { param: this.$t('spl.supplierClaim.source') }), trigger: 'blur' }], //来源 orderCode: [{ required: true, message: this.$t('pleaseEnter', { param: this.$t('spl.supplierClaim.orderCode') }), trigger: 'blur' }],//订单号 quantityNum: [{ required: true, message: this.$t('pleaseEnter', { param: this.$t('spl.supplierClaim.quantityNum') }), trigger: 'blur' }], //数量 dealUrl: [{ required: true, message: this.$t('pleaseEnter', { param: this.$t('spl.supplierClaim.dealUrl') }), trigger: 'blur' }], //质量协议 //异常描述 description: [{ required: true, message: this.$t('pleaseEnter', { param: this.$t('spl.supplierClaim.description') }), trigger: 'blur' }], //异常描述附件 descriptionUrl: [{ required: true, message: this.$t('pleaseEnter', { param: this.$t('spl.supplierClaim.descriptionUrl') }), trigger: 'blur' }], // 是否对账 hasReconciliationNumber: [ { required: true, message: this.$t('pleaseEnter', { param: this.$t('spl.supplierClaim.hasReconciliationNumber') }), trigger: ['change'] } ], hasReconciliationNumber1: [{ required: true, message: '请选择是否对账', trigger: 'change' }], // 是否对账 // 采购人 purchaserBy: [{ required: true, message: '请选择采购人', trigger: 'change' }], purchaserBy1: [{ required: true, message: '请选择采购人', trigger: 'change' }], purchaserByName: [{ required: true, message: '请选择采购人', trigger: 'change' }], //加工人数 workPeople: [{ required: true, message: this.$t('pleaseEnter', { param: this.$t('spl.supplierClaim.workPeople') }), trigger: 'blur' }], //加工时间 workTime: [{ required: true, message: this.$t('pleaseEnter', { param: this.$t('spl.supplierClaim.workTime') }), trigger: 'blur' }], //小时单价 workPrice: [{ required: true, message: this.$t('pleaseEnter', { param: this.$t('spl.supplierClaim.workPrice') }), trigger: 'blur' }], //加工费合计 workTotal: [{ required: true, message: this.$t('pleaseEnter', { param: this.$t('spl.supplierClaim.workTotal') }), trigger: 'blur' }], //材料名称 matterName: [{ required: true, message: this.$t('pleaseEnter', { param: this.$t('spl.supplierClaim.matterName') }), trigger: 'blur' }], //材料损失费数量 matterNum: [{ required: true, message: this.$t('pleaseEnter', { param: this.$t('spl.supplierClaim.matterNum') }), trigger: 'blur' }], //损失费单价 matterPrice: [{ required: true, message: this.$t('pleaseEnter', { param: this.$t('spl.supplierClaim.matterPrice') }), trigger: 'blur' }], //材料损失费合计 matterTotal: [{ required: true, message: this.$t('pleaseEnter', { param: this.$t('spl.supplierClaim.matterTotal') }), trigger: 'blur' }], //误工人数 delayNum: [{ required: true, message: this.$t('pleaseEnter', { param: this.$t('spl.supplierClaim.delayNum') }), trigger: 'blur' }], //误工时间 delayTime: [{ required: true, message: this.$t('pleaseEnter', { param: this.$t('spl.supplierClaim.delayTime') }), trigger: 'blur' }], //误工单价 delayPrice: [{ required: true, message: this.$t('pleaseEnter', { param: this.$t('spl.supplierClaim.delayPrice') }), trigger: 'blur' }], //误工合计 delayTotal: [{ required: true, message: this.$t('pleaseEnter', { param: this.$t('spl.supplierClaim.delayTotal') }), trigger: 'blur' }], //其它客户赔款 otherIndemnity: [{ required: true, message: this.$t('pleaseEnter', { param: this.$t('spl.supplierClaim.otherIndemnity') }), trigger: 'blur' }], //其它品质处罚 otherPenalize: [{ required: true, message: this.$t('pleaseEnter', { param: this.$t('spl.supplierClaim.otherPenalize') }), trigger: 'blur' }], //其它合计 otherTotal: [{ required: true, message: this.$t('pleaseEnter', { param: this.$t('spl.supplierClaim.otherTotal') }), trigger: 'blur' }], //父级id parentId: [{ required: true, message: this.$t('pleaseEnter', { param: this.$t('spl.supplierClaim.parentId') }), trigger: 'blur' }], //合计 totalBy: [{ required: false, message: this.$t('pleaseEnter', { param: this.$t('spl.supplierClaim.totalBy') }), trigger: ['blur', 'change'] }], backState: [{ required: true, message: this.$t('pleaseEnter', { param: '供应商回签' }), trigger: ['blur', 'change'] }], backIdea: [{ required: true, message: this.$t('pleaseEnter', { param: '供应商回签意见' }), trigger: 'blur' }], otherTypesAmounts: [{ required: true, message: this.$t('pleaseEnter', { param: this.$t('spl.supplierClaim.otherTypesAmounts') }), trigger: 'blur' }], otherTypes: [{ required: true, message: this.$t('pleaseEnter', { param: this.$t('spl.supplierClaim.otherTypes') }), trigger: 'blur' }], }, activeNames: ['1', '2'], buyList: [], buyer: null, roleId: 0, sqeList: [],//sqe角色人员 } }, computed: { optionsDisabled() { return { disabledDate: (time) => { return time.getTime() < Date.now() - 8.64e7 } } }, parentComponent() { return this } }, created() { // 获取当前登录人信息 this.getUserProfile().then((res) => { this.userinfo = res.data; }) if (this.$store.getters.roles.includes('SQE')) { this.roleId = 1 this.getUserInfoByRoleCode(); } if (JSON.parse(this.$route.query.dataForm).id) { // 查询表单信息 getSupplierClaimInfo(JSON.parse(this.$route.query.dataForm).id).then((res) => { this.modalForm = Object.assign(new Form(), res.data) if (this.modalForm.state = "未提交") { // 设置发起人角色 if (this.$store.getters.roles.includes('PD')) { this.modalForm.roles = 'PD' } if (this.$store.getters.roles.includes('CQE')) { this.modalForm.roles = 'CQE' } if (this.$store.getters.roles.includes('SQE')) { this.modalForm.roles = 'SQE' } // 售后进来的没有sqe if (!this.modalForm.sqe) { if (this.modalForm.roles == 'SQE') { this.modalForm.roles = 'SQE' this.roleId = 1 // console.log(this.userinfo, "角色------------------》") // 获取当前登录人信息 this.getUserProfile().then((res) => { this.userinfo = res.data; this.modalForm.sqe = JSON.stringify([{ account: this.userinfo.userName, name: this.userinfo.nickName, id: this.userinfo.userId }]) }) } if (this.modalForm.roles == 'PD') { this.getSQEList() } if (this.modalForm.roles == 'CQE') { let arr = [] if (this.modalForm.supplierCode) { getSupplySqeByCode(this.modalForm.supplierCode).then(ress => { // 过滤空元素(空对象) const filtered = ress.filter(item => Object.keys(item).length > 0 // 过滤掉空对象 {} ); // 根据id去重(保留首次出现的元素) filtered.map(item => { arr.push(item.qaEngineer) }) let parsedArray = arr.flatMap(str => JSON.parse(str)); let ids = new Set(); let uniqueArray = []; parsedArray.forEach(item => { if (!ids.has(item.id)) { ids.add(item.id); uniqueArray.push(item); } }); if (uniqueArray.length > 0) { this.modalForm.sqe = JSON.stringify(uniqueArray); } else { this.$message.warning('请先维护该供应商对应的质量工程!') } }) } else { this.$message.warning('历史数据没查询到对应的供应商编码信息,请重新选择下供应商!') } } } } // console.log(this.modalForm.roles, 1233333) // 以前代码逻辑定义的,怕改错,暂保留下 if (this.modalForm.roles == 'SQE') { this.roleId = 1 } if (this.modalForm.roles == 'PD' && this.modalForm.sqe) { this.modalForm.sqeName = JSON.parse(this.modalForm.sqe)[0].name this.getSQEList() } // 比较金额大小 if (this.modalForm.totalByStr) { let code = 'gztyre_gyssp'; getDicts(code).then(res => { this.money = res.data?.[0]?.dicName if (parseFloat(this.modalForm.totalByStr) >= this.money * 1) { // console.log(parseFloat(this.modalForm.totalByStr), 222222) this.modalForm.amount = 1 console.log('大于合计金额:', this.modalForm.amount) } else { this.modalForm.amount = 2 console.log('小于合计金额:', this.modalForm.amount) } }) } }) } else { setTimeout(() => { if (this.$store.getters.roles.includes('PD')) { this.modalForm.roles = 'PD' this.getSQEList() } if (this.$store.getters.roles.includes('CQE')) { this.modalForm.roles = 'CQE' } if (this.$store.getters.roles.includes('SQE')) { this.modalForm.roles = 'SQE' this.roleId = 1 console.log(this.userinfo, "角色------------------》") // 获取当前登录人信息 this.getUserProfile().then((res) => { this.userinfo = res.data; this.modalForm.sqe = JSON.stringify([{ account: this.userinfo.userName, name: this.userinfo.nickName, id: this.userinfo.userId }]) }) } console.log(this.modalForm.roles, "角色") // this.modalForm.purchaserBy = this.modalForm.purchaserBy1; }, 300) } }, methods: { /** 提交按钮(数据权限) */ submitForm() { this.modalForm.isSubmit = 1 this.modalForm.state = '已提交' // 必填验证 this.$refs.modelForm.validate ((valid) => { if (valid) { this.save() } else { this.$setScroll() } }) }, /** 保存按钮(数据权限) */ saveForm() { this.modalForm.isSubmit = 0 this.modalForm.state = '未提交' this.save() }, /** 通用保存方法 */ save() { if (this.modalForm.id != null && undefined != this.modalForm.id) { updateSupplierClaim(this.modalForm).then(res => { if (res.code == 200) { this.$message({ type: 'success', message: this.$t('updateSuccess') }) } else { this.$message({ type: 'error', message: this.$t('modifyFailed') }) } this.closeModal(res.data) }).catch(() => { this.loadingType(false) }) } else { addSupplierClaim(this.modalForm).then(res => { if (res.code == 200) { this.$message({ type: 'success', message: this.$t('saveSuccess') }) } else { this.$message({ type: 'error', message: this.$t('saveFailed') }) } this.closeModal(res.data) }).catch(() => { this.loadingType(false) }) } }, closeModal(id) { this.loadingType(false) if (this.modalForm.isSubmit == 1) { // 暂存不关闭弹窗 this.closeBtn('close') } else { // 期望暂存接口返回id用于查询数据 getSupplierClaimInfo(id).then(res => { this.modalForm = Object.assign(new Form(), res.data) }) } }, // 选择是否对账 handleChange(value) { this.modalForm.hasReconciliationNumber = value this.modalForm.hasReconciliationNumber1 = value; }, handleChange1(value) { this.modalForm.hasReconciliationNumber = value; this.modalForm.hasReconciliationNumber1 = value; }, // 查询采购人员角色用户 getUserInfoByRoleCode() { getUserInfoByRoleCode('spl_buy').then(res => { let arr = res.data; arr.map(item => { let obj = {}; obj.label = item.nickName; obj.value = [{ account: item.userName, id: item.userId, name: item.nickName, parentDeptId: item.dept.deptId, parentDeptName: item.dept.deptName, selected: false, type: 'user', userName: item.userName }] this.buyList.push(obj); }) }) }, // 获取sqe角色人员 getSQEList() { getUserInfoByRoleCode('SQE').then(res => { let arr = res.data; arr.map(item => { let obj = {}; obj.label = item.nickName; obj.value = [{ account: item.userName, id: item.userId, name: item.nickName, parentDeptId: item.dept?.deptId, parentDeptName: item.dept?.deptName, selected: false, type: 'user', userName: item.userName }] this.sqeList.push(obj); }) console.log('this.sqeList:', this.sqeList); }) }, // 选择采购 buyChange(val) { if (val) { console.log('采购人员:', val) const list = this.buyList.filter(item => { return item.label === val }) // console.log(list,11111) this.modalForm.purchaserBy = list[0]?.value } else { this.modalForm.purchaserBy = null } }, buyChange1(val) { if (val) { console.log('采购人员:', val) const list = this.buyList.filter(item => { return item.label === val }) // console.log(list,11111) this.modalForm.purchaserBy = list[0]?.value } else { this.modalForm.purchaserBy = null } }, // 选择sqe sqeChange(val) { if (val) { // console.log('sqe:', val) const list = this.sqeList.filter(item => { return item.label === val }) // console.log(list,11111) this.modalForm.sqe = JSON.stringify(list[0]?.value) console.log('this.modalForm.sqe:', this.modalForm.sqe) } else { this.modalForm.sqe = null } }, /** 动态添加行 复制方法 */ copyTableRow(lists, scope) { let son = JSON.parse(JSON.stringify(scope.row)) lists.splice(scope.$index, 0, son) }, /** 动态添加行 增加方法 */ addTableRow(lists, scope) { let son = Object.assign({}, this.modalFormSonObj) lists.splice(scope.$index + 1, 0, son) lists.map((item, index) => { item.seqNo = index + 1 // 更改序号 }) }, /** 动态添加行 删除方法 */ removeTableRow(lists, scope) { for (let i = 0; i < lists.length; i++) { if (i === scope.$index) { lists.splice(i, 1) } } lists.map((item, index) => { item.seqNo = index + 1 // 更改序号 }) }, // 选择人员回调 selected(select) { this.select = Object.assign([], select); }, /** 手动再验证 */ validateField(type) { this.$refs.modelForm.validateField(type) }, /** 格式化时间 */ checkDate(val) { return moment(val).format('yyyy-MM-DD') }, /** 格式化时间 */ checkDateTime(val) { return moment(val).format('YYYY-MM-DD HH:mm:ss') }, // 工作流节点选择 workChange() { const { workPeople, workTime, workPrice, matterNum, matterPrice, delayNum, delayTime, delayPrice, otherIndemnity, otherPenalize, otherTypesAmounts } = this.modalForm if (workPeople && workTime && workPrice) { const workTotal = Number(workPeople) * Number(workTime) * Number(workPrice) this.modalForm.workTotal = parseFloat(workTotal.toFixed(2)); } if (matterNum && matterPrice) { const matterTotal = Number(matterNum) * Number(matterPrice); this.modalForm.matterTotal = parseFloat(matterTotal.toFixed(2)); } if (delayNum && delayTime && delayPrice) { const delayTotal = Number(delayNum) * Number(delayTime) * Number(delayPrice); this.modalForm.delayTotal = parseFloat(delayTotal.toFixed(2)); } if (otherIndemnity && otherPenalize && otherTypesAmounts) { const otherTotal = Number(otherIndemnity) + Number(otherPenalize) + Number(otherTypesAmounts);; this.modalForm.otherTotal = parseFloat(otherTotal.toFixed(2)); } this.deductionChange() }, // 扣除改变 deductionChange() { const { workTotal, matterTotal, delayTotal, otherTotal } = this.modalForm // if (workTotal && matterTotal && delayTotal && otherTotal) {总扣除金额} let totalVal = Number(workTotal) + Number(matterTotal) + Number(delayTotal) + Number(otherTotal) this.modalForm.totalBy = this.numToChinese(totalVal); this.modalForm.totalByStr = totalVal; }, // 数字转中文 numToChinese(num) { const fraction = ['角', '分']; const digit = ['零', '壹', '贰', '叁', '肆', '伍', '陆', '柒', '捌', '玖']; const unit = [['元', '万', '亿'], ['', '拾', '佰', '仟']]; let head = num < 0 ? '欠' : ''; num = Math.abs(num); let s = ''; for (let i = 0; i < fraction.length; i++) { s += (digit[Math.floor(num * 10 * Math.pow(10, i)) % 10] + fraction[i]).replace(/零./, ''); } s = s || '整'; num = Math.floor(num); for (let i = 0; i < unit[0].length && num > 0; i++) { let p = ''; for (let j = 0; j < unit[1].length && num > 0; j++) { p = digit[num % 10] + unit[1][j] + p; num = Math.floor(num / 10); } s = p.replace(/(零.)*零$/, '').replace(/^$/, '零') + unit[0][i] + s; } return head + s.replace(/(零.)*零元/, '元').replace(/(零.)+/g, '零').replace(/^整$/, '零元整'); }, // 供应商主数据弹窗 doGetMain(list, row) { this.modalForm.supplierCode = list[0].supplierCode; this.modalForm.supplierName = list[0].supplierName; this.modalForm.shortName = row.supplierName; if (this.modalForm.supplierCode) { // if (this.modalForm.roles == 'CQE') { // let arr = []; // getSupplySqeByCode(this.modalForm.supplierCode).then(ress => { // // 过滤空元素(空对象) // const filtered = ress.filter(item => // Object.keys(item).length > 0 // 过滤掉空对象 {} // ); // // 根据id去重(保留首次出现的元素) // filtered.map(item => { arr.push(item.qaEngineer) }) // let parsedArray = arr.flatMap(str => JSON.parse(str)); // let ids = new Set(); // let uniqueArray = []; // parsedArray.forEach(item => { // if (!ids.has(item.id)) { // ids.add(item.id); // uniqueArray.push(item); // } // }); // if (uniqueArray.length > 0) { // this.modalForm.sqe = JSON.stringify(uniqueArray); // } else { // this.modalForm.shortName = null // this.modalForm.supplierCode = null // this.$message.warning('请先维护该供应商对应的质量工程!') // } // }) // } // 获取供应商信息 getSupplyInfoByCode(this.modalForm.supplierCode).then(res => { if (res) { this.modalForm.supplierId = JSON.stringify(res); } else { this.$message.error("请联系管理员去维护供应商应答人员信息!"); } }) // 判断供应商类型 getSupplyInfoBySupplyCode(this.modalForm.supplierCode).then(res => { if (res.managementType) { this.modalForm.isOnline = res.managementType; } else { this.$message.error("请联系管理员去维护供应商线上/线下信息!"); } }) console.log(this.modalForm.sqe, '------------>'); } }, doGetMainPd(list, row) { this.modalForm.supplierCode = list[0].supplierCode; this.modalForm.supplierName = list[0].supplierName; this.modalForm.shortName = row.supplierName; if (this.modalForm.supplierCode) { // let arr = []; // getSupplySqeByCode(this.modalForm.supplierCode).then(ress => { // // 过滤空元素(空对象) // const filtered = ress.filter(item => // Object.keys(item).length > 0 // 过滤掉空对象 {} // ); // // 根据id去重(保留首次出现的元素) // filtered.map(item => { arr.push(item.qaEngineer) }) // let parsedArray = arr.flatMap(str => JSON.parse(str)); // let ids = new Set(); // let uniqueArray = []; // parsedArray.forEach(item => { // if (!ids.has(item.id)) { // ids.add(item.id); // uniqueArray.push(item); // } // }); // this.modalForm.sqe = uniqueArray; // console.log("SQE信息:", this.modalForm.sqe); // }) // 获取供应商信息 // getSupplyInfoByCode(this.modalForm.supplierCode).then(res => { // if (res) { // this.modalForm.supplierId = JSON.stringify(res); // } else { // this.$message.error("请联系管理员去维护供应商应答人员信息!"); // } // }) // // 判断供应商类型 // getSupplyInfoBySupplyCode(this.modalForm.supplierCode).then(res => { // if (res.managementType) { // this.modalForm.isOnline = res.managementType; // } else { // this.$message.error("请联系管理员去维护供应商线上/线下信息!"); // } // }) console.log(this.modalForm.sqe, '------------>'); } }, // 获取物料信息 doGetMaterial(list, row) { this.classifyList = []; this.activeTab = ''; if (list && list.length) { this.modalForm.materialCode = list.map(item => item.materialCode).join(',') list.forEach(item => { // 初始化该物料对应的 subList 及其 sonList const subList = [ { parentId: '',workPeople: '',workTime: '',feeType: '' } ]; this.classifyList.push({ materialName: item.materialName, materialCode: item.materialCode, subList // 每个物料自带自己的子表单结构 }); }); // 默认激活第一个 tab if (this.classifyList.length > 0) { this.activeTab = this.classifyList[0].materialCode; } } else { this.modalForm.materialCode = null this.modalForm.materialName = null } }, // 添加一个新的孙级到指定子级 addSon(subItem) { subItem.sonList.push({ materialname: '' }); }, /** 导出word按钮操作 */ handleExportWord() { this.modalForm.titleWord = this.title; this.exportDownWord2Pdf({ templatePath: "templates/word/supplyClaim.docx", data: this.modalForm }, this.title); }, formatNumber(num) { if (num || num == 0) { const parts = num.toString().split('.'); parts[0] = parts[0].replace(/\B(?=(\d{3})+(?!\d))/g, ','); return '¥' + Number(num).toFixed(2).replace(/\B(?=(\d{3})+(?!\d))/g, ',') + '元'; } }, /** 手动再验证 */ validateField(type) { this.$refs.modelForm.validateField(type) }, // 去除输入框中的空格 descriptionChange() { this.modalForm.description = this.modalForm.description.replace(/\s/g, '') console.log(this.modalForm.description, '======>>>>>>>>'); }, } } </script> <style lang="scss" scoped> [class^=el-icon-copy-document] { color: #3370FF; background-color: transparent; } [class^=el-icon-circle-plus-outline] { color: #3370FF; background-color: transparent; } [class^=el-icon-remove-outline] { color: #F54A4F; background-color: transparent; } .el-zlw-operate { color: #606266; font-size: 1.5em; vertical-align: middle; } .el-zlw-operate>div>a>i { margin: 0 3px; } .date_picker { width: 100px !important; } .Twoheader { display: flex; justify-content: space-between; width: 100%; div { text-align: center } .red { padding-right: 5px; color: #F54A4F; } } .Twoheader>div { text-align: center } ::v-deep .el-collapse-item__content { padding-bottom: 5px; } ::v-deep .no-scroll-x { overflow-x: hidden !important; } ::v-deep .no-scroll-x .cell { overflow: hidden !important; } ::v-deep .no-scroll-x .el-table__body-wrapper { overflow-x: hidden !important; } ::v-deep.no-scroll .el-table__body-wrapper { overflow-x: hidden !important; } ::v-deep.no-scroll .el-table__body { overflow: hidden !important; } ::v-deep.no-scroll--scrollable-x .el-table__body-wrapper { overflow-x: hidden !important; } .col_right_border { border-right: 1px solid #e8e8e8; } .fy_title_box { height: 30px; line-height: 30px; text-align: center; background: #f8f8f9; } .required::before { position: absolute; top: 50%; left: 0; height: 8px; margin-top: -13px; color: #F54A4F; content: "*"; } </style> 帮我优化下,
最新发布
09-19
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值