New file |
| | |
| | | <script setup> |
| | | import request from "@/utils/request" |
| | | import {onMounted, ref, watch} from "vue"; |
| | | import {useI18n} from "vue-i18n" |
| | | import {ElMessage} from "element-plus" |
| | | import {useRouter,useRoute} from "vue-router" |
| | | const { t } = useI18n() |
| | | const router = useRouter() |
| | | const route = useRoute() |
| | | |
| | | |
| | | let basic = ref({ |
| | | basicType : ['',''], |
| | | input:'', |
| | | nickname:'' |
| | | }) |
| | | let options=ref([ |
| | | { "label": t('orderBasicData.order'), |
| | | "value": "order", |
| | | "children": [ |
| | | { |
| | | "label": t('orderBasicData.orderType'), |
| | | "value": "orderType" |
| | | }, |
| | | { |
| | | "label": t('orderBasicData.orderClassify'), |
| | | "value": "orderClassify" |
| | | }, |
| | | { |
| | | "label": t('orderBasicData.icon'), |
| | | "value": "icon" |
| | | }, |
| | | { |
| | | "label": t('orderBasicData.packType'), |
| | | "value": "packType" |
| | | }, |
| | | { |
| | | "label": t('orderBasicData.alType'), |
| | | "value": "alType" |
| | | }, |
| | | { |
| | | "label": t('orderBasicData.saleMan'), |
| | | "value": "saleMan" |
| | | } |
| | | ] |
| | | }, |
| | | { |
| | | "label": t('orderBasicData.product'), |
| | | "value": "product", |
| | | "children": [ |
| | | { |
| | | "label": t('orderBasicData.stuffThickness'), |
| | | "value": "stuffThickness" |
| | | }, |
| | | { |
| | | "label": t('orderBasicData.stuffColor'), |
| | | "value": "stuffColor" |
| | | }, |
| | | { |
| | | "label": t('orderBasicData.stuffCraft'), |
| | | "value": "stuffCraft" |
| | | }, |
| | | { |
| | | "label": t('orderBasicData.stuffPosition'), |
| | | "value": "stuffPosition" |
| | | }, |
| | | { |
| | | "label": t('orderBasicData.stuffLowE'), |
| | | "value": "stuffLowE" |
| | | }, |
| | | { |
| | | "label": t('orderBasicData.InterlayerThickness'), |
| | | "value": "InterlayerThickness" |
| | | }, |
| | | { |
| | | "label": t('orderBasicData.InterlayerType'), |
| | | "value": "InterlayerType" |
| | | }, |
| | | { |
| | | "label": t('orderBasicData.InterlayerColor'), |
| | | "value": "InterlayerColor" |
| | | }, |
| | | { |
| | | "label": t('orderBasicData.process'), |
| | | "value": "process" |
| | | }, |
| | | { |
| | | "label": t('orderBasicData.hollowThickness'), |
| | | "value": "hollowThickness" |
| | | }, |
| | | { |
| | | "label": t('orderBasicData.hollowGasType'), |
| | | "value": "hollowGasType" |
| | | }, |
| | | { |
| | | "label": t('orderBasicData.hollowType'), |
| | | "value": "hollowType" |
| | | }, |
| | | { |
| | | "label": t('orderBasicData.hollowGlueDepth'), |
| | | "value": "hollowGlueDepth" |
| | | } |
| | | ] |
| | | }, |
| | | { |
| | | "children": [ |
| | | { |
| | | "label": t('orderBasicData.paymentTerms'), |
| | | "value": "paymentTerms" |
| | | }, |
| | | { |
| | | "label": t('orderBasicData.payMethod'), |
| | | "value": "payMethod" |
| | | } |
| | | ], |
| | | "label": t('orderBasicData.delivery'), |
| | | "value": "delivery" |
| | | } |
| | | ]) |
| | | |
| | | let props = defineProps({ |
| | | rowIndex:{ |
| | | Object, |
| | | default: null |
| | | } |
| | | }) |
| | | onMounted(() =>{ |
| | | if(props.rowIndex){ |
| | | basic.value.basicType[0] = props.rowIndex.basicType |
| | | basic.value.basicType[1] = props.rowIndex.basicCategory |
| | | basic.value.input = props.rowIndex.basicName |
| | | basic.value.nickname = props.rowIndex.nickname |
| | | } |
| | | }) |
| | | |
| | | const emit = defineEmits(['gaveParent']) |
| | | const saveBasicData = () =>{ |
| | | if(basic.value.basicType[1]==="hollowThickness"||basic.value.basicType[1]==="stuffThickness"||basic.value.basicType[1]==="InterlayerThickness"){ |
| | | if(!basic.value.input.includes("mm")){ |
| | | basic.value.input=basic.value.input+"mm" |
| | | } |
| | | } |
| | | basic.value.input=basic.value.input.trim() |
| | | request.post(`/basicData/addBasicData`, basic.value).then(res => { |
| | | if (res.data) { |
| | | ElMessage.success(t('basicData.msg.saveSuccess')) |
| | | emit('gaveParent', true) |
| | | } |
| | | }) |
| | | } |
| | | const updateBasicData = () =>{ |
| | | if(basic.value.basicType[1]==="hollowThickness"||basic.value.basicType[1]==="stuffThickness"||basic.value.basicType[1]==="InterlayerThickness"){ |
| | | if(!basic.value.input.includes("mm")){ |
| | | basic.value.input=basic.value.input+"mm" |
| | | } |
| | | } |
| | | let submitArr = props.rowIndex |
| | | submitArr.basicType = basic.value.basicType[0] |
| | | submitArr.basicCategory = basic.value.basicType[1] |
| | | submitArr.basicName = basic.value.input.trim() |
| | | submitArr.nickname = basic.value.nickname |
| | | request.post(`/basicData/updateBasicData`, submitArr).then(res => { |
| | | if (res.data) { |
| | | ElMessage.success(t('basicData.msg.saveSuccess')) |
| | | emit('gaveParent', true) |
| | | } |
| | | }) |
| | | |
| | | } |
| | | |
| | | const handleChange = (value) => { |
| | | const filterArr = options.value.filter((item) =>item.value === value[0] |
| | | ).map((item) =>item.children.filter((item) =>item.value === value[1])) |
| | | } |
| | | |
| | | const changeFile = (file) => { |
| | | const isJPG = file.raw.type === 'image/jpeg' || file.raw.type === 'image/png' ; |
| | | const isLt2M = file.size / 1024 / 1024 < 5; |
| | | |
| | | if (!isJPG) { |
| | | ElMessage.warning(t('orderBasicData.msg2')) |
| | | return |
| | | } |
| | | if (!isLt2M) { |
| | | ElMessage.warning(t('orderBasicData.msg1')) |
| | | return |
| | | } |
| | | |
| | | return new Promise((resolve, reject) => { |
| | | let reader = new FileReader(); |
| | | reader.readAsDataURL(file.raw); |
| | | reader.onload = (e) => { |
| | | resolve(e.target.result); |
| | | basic.value.nickname=e.target.result; |
| | | }; |
| | | }); |
| | | } |
| | | |
| | | |
| | | </script> |
| | | |
| | | <template> |
| | | <div> |
| | | <el-row> |
| | | <el-col :span="4">{{ $t('orderBasicData.page.searchOrderBasicData') }}:</el-col> |
| | | <el-col :span="12"> |
| | | <el-cascader |
| | | v-model="basic.basicType" |
| | | @change="handleChange" |
| | | :options="options" |
| | | :placeholder="$t('processCard.pleaseSelect')" |
| | | :disabled="props.rowIndex" |
| | | /> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row> |
| | | <el-col :span="4">{{ $t('orderBasicData.name') }}:</el-col> |
| | | <el-col :span="12"> |
| | | <el-input v-model="basic.input"/> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row> |
| | | <el-col :span="4">{{ $t('orderBasicData.alias') }}:</el-col> |
| | | <el-col :span="12"> |
| | | <el-input v-if="basic.basicType.length>0 && basic.basicType[1]!=='process'" v-model="basic.nickname"/> |
| | | <el-select v-model="basic.nickname" v-else> |
| | | <el-option :label="$t('orderBasicData.commonProcess')" value="" /> |
| | | <el-option :label="$t('orderBasicData.laminatingProcessA')" value="stepA" /> |
| | | <el-option :label="$t('orderBasicData.laminatingProcessB')" value="stepB" /> |
| | | </el-select> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row v-if="basic.basicType.length!==0 && basic.basicType[1]==='icon'" > |
| | | <el-col :span="4"></el-col> |
| | | <el-col :span="12"> |
| | | <el-upload |
| | | v-model="basic.nickname" |
| | | :limit="1" |
| | | :on-change="changeFile" |
| | | class="upload-demo" |
| | | ref="upload" |
| | | action="https://jsonplaceholder.typicode.com/posts/" |
| | | :file-list="fileList" |
| | | :auto-upload="false"> |
| | | <el-button slot="trigger" size="small" type="primary" >{{ $t('orderBasicData.selectFile') }}</el-button> |
| | | <div slot="tip" class="el-upload__tip">{{ $t('orderBasicData.msg3') }}</div> |
| | | </el-upload> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row> |
| | | <el-col :span="4"></el-col> |
| | | <el-col :span="12"> |
| | | <el-button v-show="!props.rowIndex" @click="saveBasicData" type="primary">{{ $t('basicData.insert') }}</el-button> |
| | | <el-button v-show="props.rowIndex" @click="updateBasicData" type="primary">{{ $t('basicData.update') }}</el-button> |
| | | |
| | | </el-col> |
| | | </el-row> |
| | | |
| | | </div> |
| | | </template> |
| | | |
| | | <style scoped> |
| | | div{ |
| | | text-align: center; |
| | | } |
| | | .el-row{ |
| | | margin-top: 10px; |
| | | } |
| | | </style> |