廖井涛
2024-02-27 926a1e8b90381c7aa085d5462d78de9d2cc6034d
north-glass-erp/northglass-erp/src/views/sd/product/CreateProduct.vue
@@ -1,8 +1,10 @@
<script setup>
import request from "@/utils/request"
import deepClone from "@/utils/deepClone";
import {ElMessage} from "element-plus";
import {ref} from "vue";
import deepClone from "@/utils/deepClone"
import {ElMessage} from "element-plus"
import {computed, ref} from "vue"
import  useUserInfo from "@/stores/userInfo"
let  userInfo = useUserInfo()
const disposeList = $ref([
  '彩釉',
  '蒙砂',
@@ -10,22 +12,6 @@
  '贴膜',
  '喷砂',
  '磨边'
])
let processList = $ref([
    '磨边',
    '镀膜',
    '倒角',
    '清洗',
    '打孔',
    '挖缺',
    '挖槽',
    '水切割',
    '丝印',
    '半钢化',
    '钢化',
    '夹层',
    '中空',
    '包装'
])
let BasicData = ref({
  stuffColor:null,
@@ -56,15 +42,66 @@
  lowE:''
})
let processChecked = ref([])
let hollowBasic = ref({
  thickness:"",
  gasType:"",
  Type:"",
  GlueDepth:""
})
let InterlayerBasic = ref({
  thickness:"",
  color:"",
  type:""
})
let productDetailList = ref([])
let productTotal = ref({
  productName:'',
  creator:userInfo.user.userName
})
//页面加载请求
request.get(`/basicData/BasicDataByType/product`).then((res) => {
  if(res.code==200){
    console.log(res.data)
    BasicData.value = res.data
  }else{
    ElMessage.warning(res.msg)
  }
})
const saveProduct = () => {
  if(productDetailList.value.length===0){
    ElMessage.warning("请添加产品详情")
    return
  }else if(productDetailList.value[productDetailList.value.length-1].detailType!=='glass'){
    ElMessage.warning("产品详情最后一条不是玻璃,请完善")
    return
  }
  let productName = ""
  productDetailList.value.forEach(item =>{
    switch(item.detailType){
      case 'glass' :{
        productName+=item.detail
        break
      }
      case 'Interlayer' :{
        productName+='+'+item.detail
      }
      case 'hollow' :{
        productName+='*'+item.detail
      }
    }
  })
  productTotal.value.productName=productName
  let product = {
    title: productTotal.value,
    detail:productDetailList.value
  }
  request.post(`/product/saveProduct`,product).then((res) =>{
    if(res.code==200){
      ElMessage.success(res.msg)
    }
  })
}
const reset = () => {
  processChecked.value=[]
@@ -72,6 +109,211 @@
    stuff.value[item]=''
  })
}
const glassSure =  () => {
  let childName = ''
  Object.keys(stuff.value).forEach((item,index)=>{
    childName+=stuff.value[item]
  })
  let rege = /^\s*$/
  if(rege.test(childName) || processChecked.value.length===0){
    ElMessage.warning('请输入产品材料属性与工艺属性')
    return
  }
  let productDetail = {
    detailType:'glass',
    detail:childName,
    process:processChecked.value.join('->'),
    separation:Object.assign({}, stuff.value)
  }
  if(glassFlag.value.flag){
    if(productDetailList.value.length ===0 ){
      productDetailList.value.push(productDetail)
    }else{
      if (productDetailList.value[productDetailList.value.length-1].detailType === 'glass') {
        ElMessage.warning('请先选择间隔物')
        return
      }
      productDetailList.value.push(productDetail)
    }
  }else{
    productDetailList.value[glassFlag.value.index] = productDetail
  }
  reset()
}
//添加中空间隔物
const addHollow = () => {
  let childName = ''
  try {
    Object.keys(hollowBasic.value).forEach((item, index) => {
      if (hollowBasic.value[item] === '') {
        throw new Error("请选择全部中空间隔物下拉框")
      }
      childName += hollowBasic.value[item]
    })
  }catch (e){
    ElMessage.warning(e.message)
    return
  }
  let hollowDetail = {
    detailType:'hollow',
    detail:childName,
    separation:Object.assign({}, hollowBasic.value)
  }
  if(hollowFlag.value.flag){
    if (productDetailList.value.length ===0) {
      ElMessage.warning('请先选择产品')
      return
    }else if(productDetailList.value[productDetailList.value.length-1].detailType !== 'glass'){
      ElMessage.warning('请先选择产品')
      return
    }
    productDetailList.value.push(Object.assign({},hollowDetail))
  }else {
    productDetailList.value[hollowFlag.value.index] = hollowDetail
  }
  Object.keys(hollowBasic.value).forEach((item,index)=>{
    hollowBasic.value[item]=''
  })
}
//添加夹层间隔物
const addInterlayer = () => {
  let childName = ''
  try {
    Object.keys(InterlayerBasic.value).forEach((item, index) => {
      if (InterlayerBasic.value[item] === '') {
        throw new Error("请选择全部中空间隔物下拉框")
      }
      childName += InterlayerBasic.value[item]
    })
  }catch (e){
    ElMessage.warning(e.message)
    return
  }
  let InterlayerDetail = {
    detailType:'Interlayer',
    detail:childName,
    separation:Object.assign({}, InterlayerBasic.value)
  }
  if(InterlayerFlag.value.flag){
    if (productDetailList.value.length ===0) {
      ElMessage.warning('请先选择产品')
      return
    }else if(productDetailList.value[productDetailList.value.length-1].detailType !== 'glass'){
      ElMessage.warning('请先选择产品')
      return
    }
    productDetailList.value.push(Object.assign({},InterlayerDetail))
  }else{
    productDetailList.value[InterlayerFlag.value.index] = InterlayerDetail
  }
  Object.keys(InterlayerBasic.value).forEach((item,index)=>{
    InterlayerBasic.value[item]=''
  })
}
const deleteProductDetail =  (index) => {
  const detailType = productDetailList.value[index].detailType
  switch (detailType) {
    case 'glass':{
      glassFlag.value = {
        flag:true,
        index:null
      }
      break
    }
    case 'Interlayer':{
      InterlayerFlag.value = {
        flag:true,
        index:null
      }
      break
    }
    case 'hollow':{
      hollowFlag.value = {
        flag:true,
        index:null
      }
    }
  }
  productDetailList.value.splice(index,1)
}
let glassFlag = ref({
  flag:true,
  index:null
})
const updateGlass = (index) => {
  stuff.value = productDetailList.value[index].separation
  processChecked.value = productDetailList.value[index].process.split("->")
  glassFlag.value.flag=false
  glassFlag.value.index=index
}
const updateGlassSure = ()=> {
  glassSure()
  glassFlag.value.flag=true
  glassFlag.value.index=null
}
let InterlayerFlag = ref({
  flag:true,
  index:null
})
const updateInterlayer  = (index) => {
  InterlayerBasic.value = productDetailList.value[index].separation
  InterlayerFlag.value.flag=false
  InterlayerFlag.value.index=index
}
const updateInterlayerSure = () => {
  addInterlayer()
  InterlayerFlag.value.flag=true
  InterlayerFlag.value.index=null
}
let  hollowFlag = ref({
  flag:true,
  index:null
})
const updateHollow = (index) => {
  hollowBasic.value = productDetailList.value[index].separation
  hollowFlag.value.flag=false
  hollowFlag.value.index=index
}
const updateHollowSure = () => {
  addHollow()
  hollowFlag.value.flag=true
  hollowFlag.value.index=null
}
const productName = computed(() =>{
  let productName = ""
  productDetailList.value.forEach(item =>{
    switch(item.detailType){
      case 'glass' :{
        productName+=item.detail
        break
      }
      case 'Interlayer' :{
        productName+='+'+item.detail
      }
      case 'hollow' :{
        productName+='*'+item.detail
      }
    }
  })
  return productName
})
</script>
<template>
@@ -180,6 +422,7 @@
      <div class="glass-spacer">
        <div class="glass-spacer-jc">
          <el-select
              v-model="hollowBasic.thickness"
              size="small"
              style="width: 100px"
              clearable placeholder="*中空厚度:" >
@@ -190,6 +433,7 @@
            />
          </el-select>
          <el-select
              v-model="hollowBasic.gasType"
              size="small"
              style="width: 100px"
              clearable placeholder="*充气方式:" >
@@ -200,6 +444,7 @@
            />
          </el-select>
          <el-select
              v-model="hollowBasic.Type"
              size="small"
              style="width: 100px"
              clearable placeholder="*封胶:" >
@@ -210,6 +455,7 @@
            />
          </el-select>
          <el-select
              v-model="hollowBasic.GlueDepth"
              size="small"
              style="width: 100px"
              clearable placeholder="*默认胶深:" >
@@ -220,13 +466,21 @@
            />
          </el-select>
          <el-button
              v-if="hollowFlag.flag"
              @click="addHollow"
              size="small"
              type="primary"
              round>中空间隔物</el-button>
          <el-button
              v-else
              @click="updateHollowSure"
              size="small"
              type="primary"
              round>夹层间隔物修改</el-button>
        </div>
        <div class="glass-spacer-zk">
          <el-select
              v-model="InterlayerBasic.thickness"
              size="small"
              style="width: 100px"
              clearable placeholder="*夹层厚度:" >
@@ -237,6 +491,7 @@
            />
          </el-select>
          <el-select
              v-model="InterlayerBasic.type"
              size="small"
              style="width: 100px"
              clearable placeholder="*类型:" >
@@ -247,6 +502,7 @@
            />
          </el-select>
          <el-select
              v-model="InterlayerBasic.color"
              size="small"
              style="width: 100px"
              clearable placeholder="*颜色:" >
@@ -257,10 +513,19 @@
            />
          </el-select>
          <el-button
              v-if="InterlayerFlag.flag"
              @click="addInterlayer"
              size="small"
              type="primary"
              style="margin-left: 100px"
              round>夹层间隔物</el-button>
          <el-button
              v-else
              @click="updateInterlayerSure"
              size="small"
              type="primary"
              style="margin-left: 100px"
              round>夹层间隔物修改</el-button>
        </div>
      </div>
      <div class="line"/>
@@ -302,10 +567,16 @@
            </el-col>
            <el-col :span="3">
              <div class="grid-content ep-bg-purple" >
                <el-button
                <el-button v-if="glassFlag.flag"
                    @click="glassSure"
                    size="small"
                    type="primary"
                    round>确认</el-button>
                <el-button v-else
                           @click="updateGlassSure"
                           size="small"
                           type="primary"
                           round>修改</el-button>
              </div>
            </el-col>
          </el-row>
@@ -368,64 +639,57 @@
          </el-col>
          <el-col :span="20">
            <div class="grid-content ep-bg-purple" >
              <el-input size="large" disabled  />
              <el-input :value="productName" size="large" disabled  />
            </div>
          </el-col>
        </el-row>
      </div>
      <div class="glass-part-detail">
        <el-row style="width: 90%" >
          <el-col :span="4">
        <el-row style="width: 90%"  v-for="(item,index) in productDetailList">
          <el-col :span="4" v-show="item.detailType === 'glass'">
            <el-button
                @click = "updateGlass(index)"
                size="small"
                type="primary"
                round>修改玻璃</el-button>
                type="primary">修改玻璃</el-button>
          </el-col>
          <el-col :span="4" v-show="item.detailType === 'Interlayer'">
            <el-button
                @click = "updateInterlayer(index)"
                size="small"
                type="primary">修改夹层</el-button>
          </el-col>
          <el-col :span="4" v-show="item.detailType === 'hollow'">
            <el-button
                @click = "updateHollow(index)"
                size="small"
                type="primary">修改中空</el-button>
          </el-col>
          <el-col :span="16">
            <el-input
                :value="item.detail"
                value="5mm白玻"
                size="small"
                disabled  />
          </el-col>
        </el-row>
        <el-row style="width: 90%" >
          <el-col :span="4">
          <el-col
              v-show="index+1 === productDetailList.length"
              :span="4">
            <el-button
                @click="deleteProductDetail(index)"
                size="small"
                type="primary"
                round>修改夹层</el-button>
          </el-col>
          <el-col :span="16">
            <el-input
                value="5mmPVB透明"
                size="small"
                disabled  />
          </el-col>
        </el-row>
        <el-row style="width: 90%" >
          <el-col :span="4">
            <el-button
                size="small"
                type="primary"
                round>修改玻璃</el-button>
          </el-col>
          <el-col :span="16">
            <el-input
                value="5mm白玻"
                size="small"
                disabled  />
                type="primary">删除</el-button>
          </el-col>
        </el-row>
      </div>
      <el-button
          @click="saveProduct"
          style="float: right;
          margin-right: 0.5rem;"
          size="large"
          type="primary"
          round>重置</el-button>
          round>创建</el-button>
    </div>
  </div>
</template>