@epxing/business 0.0.0-stage → 5.3.0-beta.2

package/src/components/custom-bpmn/components/ParamsMachining.vue

@@ -0,0 +1,644 @@
+<template>
+  <div>
+    <ul class="bpmn-node-properties__attribute-list">
+      <div v-for="(item,index) in addParamsList" :key="index" class="add-params-item">
+        <div class="add-params-item-left">
+          <div class="add-params-item-line-one">
+            <div class="add-params-item-name">{{item.text}}</div>
+              <template v-if="item.type!=='2'&&item.type!=='1'&&item.type!=='4'">
+                <el-select class="machining-select" v-model="item.addType" placeholder="请选择" @change="item.value='',item.valueC='',item.paramsType=''">
+                  <el-option label="追加" value="add"></el-option>
+                  <el-option v-if="['8','9','10'].includes(item.type)" label="修改" value="edit"></el-option>
+                  <el-option v-if="['8','9','10'].includes(item.type)" label="删除" value="delete"></el-option>
+                  <el-option label="清空" value="clear"></el-option>
+                  <el-option label="覆盖" value="cover"></el-option>
+                </el-select>
+              </template>
+          </div>
+          <div>
+            <!-- 文本 数字 -->
+            <div class="bpmn-node-properties__attribute-input" v-if="item.type==='1'||item.type==='4'">
+                <el-select class="bpmn-node-properties__attribute-input-type" v-model="item.valueType" placeholder="请选择" @change="item.value='',item.valueC='',item.paramsType=''">
+                  <el-option label="指定值" value="designated"></el-option>
+                  <el-option label="动态值" value="dynamic"></el-option>
+                  <el-option label="公式" value="formula"></el-option>
+                </el-select>
+              <template v-if="item.valueType==='designated'">
+                <el-input class="machining-arr-input-con" v-model="item.value" placeholder="请输入内容"></el-input>
+              </template>
+              <template v-else-if="item.valueType==='formula'">
+                <epx-rule v-model="item.value" :selfStyle="false" :fieldConfigs="{attriName: 'value', attriLabel: '判断条件', dataType:'rule',rows:2, state: 'EDIT'}"
+                :extendVariable="ruleVariable" :ruleMetaId="businessMetaId">
+                  <el-input class="machining-arr-input-con" :model-value="getChineseValue(item.value)" placeholder="请点击输入"></el-input>
+                </epx-rule>
+              </template>
+              <template v-else-if="item.valueType==='dynamic'">
+                <div>
+                  <el-popover ref="popover" trigger="click" :tabindex="1">
+                    <template v-slot:reference><el-input class="machining-arr-input-con" :model-value="item.valueC" suffix-icon="el-icon-search" size="default" placeholder="参数"></el-input></template>
+                    <epx-bpmn-global-params-tree :globalParamsData="globalParamsData" @nodeClick="selectDynamicParams($event,item,index)"></epx-bpmn-global-params-tree>
+                  </el-popover>
+                </div>
+              </template>
+            </div>
+            <!-- 对象 -->
+            <template v-else-if="item.type==='2'">
+              <div class="bpmn-node-properties__attribute-input" v-for="(field,fIndex) in item.fields" :key="field.id+fIndex">
+                <label class="bpmn-node-properties__attribute-input__label">{{field.name}}</label>
+                <div class="bpmn-node-properties__attribute-input-type">
+                  <el-select v-model="field.valueType" placeholder="请选择" @change="field.value='',field.valueC='',field.paramsType=''">
+                    <el-option label="指定值" value="designated"></el-option>
+                    <el-option label="动态值" value="dynamic"></el-option>
+                    <el-option label="公式" value="formula"></el-option>
+                    <el-option label="删除" value="delete"></el-option>
+                  </el-select>
+                </div>
+                <div v-if="field.valueType!=='delete'">
+                  <template v-if="field.valueType==='designated'">
+                    <div class="bpmn-node-properties__attribute-input__con">
+                      <epx-table-form-item :show-label="false" valueWidth="auto" :value="field.value" :valueLabel="field.valueC" @change="v=> changeFormData(field,v)"
+                        :field-configs="{attriName: field.code, dataType:field.dataType, codeKey:field.codeKey,attriLabel: field.name, state: 'ADD'}">
+                      </epx-table-form-item>
+                    </div>
+                  </template>
+                  <template v-else-if="field.valueType==='formula'">
+                    <epx-rule v-model="field.value" :selfStyle="false" :fieldConfigs="{attriName: 'value', attriLabel: '判断条件', dataType:'rule',rows:2, state: 'EDIT'}"
+                      :extendVariable="ruleVariable" :ruleMetaId="item.object||businessMetaId">
+                      <el-input class="bpmn-node-properties__attribute-input__con" :model-value="getChineseValue(field.value)" placeholder="请点击输入"></el-input>
+                    </epx-rule>
+                  </template>
+                  <template v-else-if="field.valueType==='dynamic'">
+                    <div>
+                      <el-popover ref="popover" trigger="click" :tabindex="1">
+                        <template v-slot:reference><el-input class="bpmn-node-properties__attribute-input__con" :model-value="field.valueC"  placeholder="参数"></el-input></template>
+                        <!-- <div class="bpmn-node-properties__scope-opera__popper">
+                          <el-tree :data="globalParamsData" node-key="label" :props="{
+                              children: 'children',
+                              label: 'text'
+                            }" @node-click="selectFieldDynamicParams($event,field,fIndex)">
+                            <span v-html="node.label" slot-scope="{ node }"></span>
+                          </el-tree>
+                        </div> -->
+                    <epx-bpmn-global-params-tree :globalParamsData="globalParamsData" @nodeClick="selectFieldDynamicParams($event,field,fIndex)"></epx-bpmn-global-params-tree>
+                      </el-popover>
+                    </div>
+                  </template>
+                </div>
+                <div class="close-object-field">
+                  <i class="el-icon-close" @click="deleteParamsField(item,fIndex)"></i>
+                  <!-- <el-button style="marginLeft:10px" type="primary" link @click="deleteParamsField(item,fIndex)">删除</el-button> -->
+                </div>
+              </div>
+              <div>
+                <el-popover ref="popover" trigger="click" :tabindex="1">
+                  <template v-slot:reference><el-button type="primary" link>+添加普通字段</el-button></template>
+                  <div class="bpmn-node-properties__update-add-field__popper">
+                    <div class="bpmn-node-properties__update-add-field__popper_item" v-for="(field,fieldIndex) in metaParams[item.uid||item.object]" :key="field.id+fieldIndex" @click="addField(item,field)">{{field.name}}</div>
+                  </div>
+                </el-popover>
+                <el-button style="marginLeft:10px" type="primary" link @click="addVirtualField(index)">+添加虚拟字段</el-button>
+              </div>
+            </template>
+            <!-- 数组类 -->
+            <template v-else-if="['3','5','6','7'].includes(item.type) || (item.addType==='cover' && ['8','9','10'].includes(item.type))">
+              <div class="bpmn-node-properties__attribute-input" v-if="item.addType!=='clear'">
+                <div class="bpmn-node-properties__attribute-input-type">
+                  <el-select class="bpmn-node-properties__attribute-input-type" v-model="item.valueType" placeholder="请选择" @change="item.value='',item.valueC='',item.paramsType=''">
+                    <el-option label="指定值" value="designated"></el-option>
+                    <el-option label="动态值" value="dynamic"></el-option>
+                    <el-option label="公式" value="formula"></el-option>
+                  </el-select>
+                </div>
+                <div>
+                  <template v-if="item.valueType==='designated'">
+                    <el-input class="machining-arr-input-con" v-model="item.value" placeholder="请输入内容"></el-input>
+                  </template>
+                  <template v-else-if="item.valueType==='formula'">
+                    <epx-rule class="machining-arr-input-con" v-model="item.value" :selfStyle="false" :fieldConfigs="{attriName: 'value', attriLabel: '判断条件', dataType:'rule',rows:2, state: 'EDIT'}"
+                      :extendVariable="ruleVariable" :ruleMetaId="item.object||businessMetaId">
+                      <el-input :model-value="getChineseValue(item.value)" placeholder="请点击输入"></el-input>
+                    </epx-rule>
+                  </template>
+                  <template v-else-if="item.valueType==='dynamic'">
+                    <div>
+                      <el-popover ref="popover" trigger="click" :tabindex="1">
+                        <template v-slot:reference><el-input class="machining-arr-input-con" :model-value="item.valueC"  placeholder="参数"></el-input></template>
+                        <!-- <div class="bpmn-node-properties__scope-opera__popper">
+                          <el-tree :data="globalParamsData" node-key="label" :props="{
+                              children: 'children',
+                              label: 'text'
+                            }" @node-click="selectFieldDynamicParams($event,item,index)">
+                            <span v-html="node.label" slot-scope="{ node }"></span>
+                          </el-tree>
+                        </div> -->
+                        <epx-bpmn-global-params-tree :globalParamsData="globalParamsData" @nodeClick="selectFieldDynamicParams($event,item,index)"></epx-bpmn-global-params-tree>
+                      </el-popover>
+                    </div>
+                  </template>
+                </div>
+              </div>
+            </template>
+            <!-- 集合类 -->
+            <template v-else-if="['8','9','10'].includes(item.type)">
+              <div class="bpmn-node-properties__attribute-input" v-if="item.addType!=='clear'">
+                <label class="machining-map-label">键</label>
+                <div class="bpmn-node-properties__attribute-input-type">
+                  <el-select v-model="item.keyValueType" placeholder="请选择" @change="item.keyValue='',item.keyValueC='',item.keyParamsType=''">
+                    <el-option label="指定值" value="designated"></el-option>
+                    <el-option label="动态值" value="dynamic"></el-option>
+                    <el-option label="公式" value="formula"></el-option>
+                  </el-select>
+                </div>
+                <div>
+                  <template v-if="item.keyValueType==='designated'">
+                    <el-input class="maching-map-input-con" v-model="item.keyValue" placeholder="请输入内容"></el-input>
+                  </template>
+                  <template v-else-if="item.keyValueType==='formula'">
+                    <epx-rule v-model="item.keyValue" :selfStyle="false" :fieldConfigs="{attriName: 'keyValue', attriLabel: '判断条件', dataType:'rule',rows:2, state: 'EDIT'}"
+                      :extendVariable="ruleVariable" :ruleMetaId="item.object||businessMetaId">
+                      <el-input class="maching-map-input-con" :model-value="getChineseValue(item.keyValue)" placeholder="请点击输入"></el-input>
+                    </epx-rule>
+                  </template>
+                  <template v-else-if="item.keyValueType==='dynamic'">
+                    <div>
+                      <el-popover ref="popover" trigger="click" :tabindex="1">
+                        <template v-slot:reference><el-input class="maching-map-input-con" :model-value="item.keyValueC"  placeholder="参数"></el-input></template>
+                        <!-- <div class="bpmn-node-properties__scope-opera__popper">
+                          <el-tree :data="globalParamsData" node-key="label" :props="{
+                              children: 'children',
+                              label: 'text'
+                            }" @node-click="selectKeyDynamicParams($event,item,index)">
+                            <span v-html="node.label" slot-scope="{ node }"></span>
+                          </el-tree>
+                        </div> -->
+                        <epx-bpmn-global-params-tree :globalParamsData="globalParamsData" @nodeClick="selectKeyDynamicParams($event,item,index)"></epx-bpmn-global-params-tree>
+                      </el-popover>
+                    </div>
+                  </template>
+                </div>
+              </div>
+              <div class="bpmn-node-properties__attribute-input" v-if="item.addType!=='clear'&&item.addType!=='delete'">
+                <label class="machining-map-label machining-map-value-label">值</label>
+                <div class="bpmn-node-properties__attribute-input-type">
+                  <el-select v-model="item.valueType" placeholder="请选择" @change="item.value='',item.valueC='',item.paramsType=''">
+                    <el-option label="指定值" value="designated"></el-option>
+                    <el-option label="动态值" value="dynamic"></el-option>
+                    <el-option label="公式" value="formula"></el-option>
+                  </el-select>
+                </div>
+                <div>
+                  <template v-if="item.valueType==='designated'">
+                    <el-input class="maching-map-input-con" v-model="item.value" placeholder="请输入内容"></el-input>
+                  </template>
+                  <template v-else-if="item.valueType==='formula'">
+                    <epx-rule v-model="item.value" :selfStyle="false" :fieldConfigs="{attriName: 'value', attriLabel: '判断条件', dataType:'rule',rows:2, state: 'EDIT'}"
+                      :extendVariable="ruleVariable" :ruleMetaId="item.object||businessMetaId">
+                      <el-input class="maching-map-input-con" :model-value="getChineseValue(item.value)" placeholder="请点击输入"></el-input>
+                    </epx-rule>
+                  </template>
+                  <template v-else-if="item.valueType==='dynamic'">
+                    <div>
+                      <el-popover ref="popover" trigger="click" :tabindex="1">
+                        <template v-slot:reference><el-input class="maching-map-input-con" :model-value="item.valueC"  placeholder="参数"></el-input></template>
+                        <!-- <div class="bpmn-node-properties__scope-opera__popper">
+                          <el-tree :data="globalParamsData" node-key="label" :props="{
+                              children: 'children',
+                              label: 'text'
+                            }" @node-click="selectFieldDynamicParams($event,item,index)">
+                            <span v-html="node.label" slot-scope="{ node }"></span>
+                          </el-tree>
+                        </div> -->
+                        <epx-bpmn-global-params-tree :globalParamsData="globalParamsData" @nodeClick="selectFieldDynamicParams($event,item,index)"></epx-bpmn-global-params-tree>
+                      </el-popover>
+                    </div>
+                  </template>
+                </div>
+              </div>
+            </template>
+          </div>
+        </div>
+        <div class="add-params-item-right">
+          <i class="el-icon-error" @click="deleteParams(index)"></i>
+        </div>
+      </div>
+      <div>
+        <el-popover ref="popover" trigger="click" :tabindex="1">
+          <template v-slot:reference><el-button style="margin:10px 0" type="primary" plain size="small">+添加参数</el-button></template>
+          <!-- <div class="bpmn-node-properties__update-add-field__popper">
+            <div class="bpmn-node-properties__update-add-field__popper_item" v-for="item in inParamData" :key="item.id" @click="addParams(item)">{{item.name}}</div>
+          </div> -->
+          <div class="bpmn-node-properties__scope-opera__popper">
+            <el-tree :data="machiningParams" node-key="code" :props="{
+                children: 'children',
+                label: 'text'
+              }" @node-click="addParams"
+              :default-expanded-keys="expandedKeys"
+              >
+              <template v-slot="{ node }"><span v-html="node.label"></span></template>
+            </el-tree>
+          </div>
+        </el-popover>
+      </div>
+    </ul>
+    <el-dialog
+      title="添加对象的虚拟字段"
+      v-model="dialogVisible"
+      width="500px"
+      :append-to-body="true"
+      destroy-on-close
+      >
+      <div>
+        <epx-table-form :column="1" v-model="virtualData"
+        :fieldsConfigs="virtualFields">
+        </epx-table-form>
+      </div>
+      <template v-slot:footer><span class="dialog-footer">
+        <el-button @click="dialogVisible = false">取 消</el-button>
+        <el-button type="primary" @click="addVirtualFieldData">确 定</el-button>
+      </span></template>
+    </el-dialog>
+
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'epx-bpmn-params-machining',
+  props: {
+    globalParamsData: {
+      type: Array,
+      default () {
+        return []
+      }
+    },
+    nodeParamList: {
+      type: Array,
+      default () {
+        return []
+      }
+    },
+    inParamData: {
+      type: Array,
+      default () {
+        return []
+      }
+    },
+    addRecordParamData: {
+      type: Array,
+      default () {
+        return []
+      }
+    },
+    ruleVariable: {
+      type: Array,
+      default () {
+        return []
+      }
+    },
+    elementValues: {
+      type: Object,
+      default () {
+        return {}
+      }
+    },
+    businessMetaId: String
+  },
+  // 文本 1
+  // 数字 4
+  // 对象 2
+  // 数组 文本 5
+  // 数组 数字 6
+  // 数组 数据对象 3
+  // 数组 Object 7
+  // 集合 文本/文本 8
+  // 集合 文本/数据对象 9
+  // // 集合 文本/Object 10
+  data () {
+    return {
+      addParamsList: [],
+      metaParams: {},
+      initNodeParams: [],
+      dialogVisible: false,
+      addVirtualFieldIndex: null,
+      virtualFields: [
+        { attriName: 'id', attriLabel: '字段编号', dataType: 'text', state: 'ADD' },
+        { attriName: 'name', attriLabel: '字段名称', dataType: 'text', state: 'ADD' },
+        {
+          attriName: 'valueType',
+          attriLabel: '字段值',
+          dataType: 'list',
+          state: 'ADD',
+          options: [
+            { id: 'designated', name: '指定值', code: 'designated' },
+            { id: 'dynamic', name: '动态值', code: 'dynamic' },
+            { id: 'formula', name: '公式', code: 'formula' }
+          ]
+        }
+      ],
+      virtualData: {},
+      machiningParams: [],
+      expandedKeys: []
+    }
+  },
+  computed: {
+    getChineseValue () {
+      return (value) => {
+        let string = ''
+        if (value) {
+          string = JSON.parse(value).elText
+        }
+        return string
+      }
+    }
+  },
+  watch: {
+    addParamsList: {
+      handler () {
+        this.saveNodeData()
+      },
+      deep: true
+    }
+  },
+  methods: {
+    changeFormData (field, v) {
+      let value = ''
+      let label = ''
+      if (Array.isArray(v)) {
+        value = v.map(item => item.id || item).join(',')
+        label = v.map(item => item.name || item).join('、')
+      } else if (typeof v === 'object') {
+        value = v.id
+        label = v.name
+      } else {
+        value = v
+      }
+      field.valueC = label || value
+      field.value = value
+      // this.$set(field, 'value', value)
+      // this.$set(field, 'valueC', label || value)
+    },
+    addVirtualField (index) {
+      this.addVirtualFieldIndex = index
+      this.dialogVisible = true
+    },
+    addVirtualFieldData () {
+      const item = this.addParamsList[this.addVirtualFieldIndex]
+      const obj = { id: this.virtualData.id, name: this.virtualData.name, value: '', valueC: '', paramsType: '', valueType: this.virtualData.valueType }
+      item.fields.push(obj)
+      this.dialogVisible = false
+      this.virtualData = { }
+      this.addVirtualFieldIndex = null
+    },
+    deleteParamsField (item, index) {
+      item.fields.splice(index, 1)
+    },
+    addField (item, field) {
+      const obj = { ...field, value: '', valueC: '', paramsType: '', valueType: 'designated' }
+      item.fields.push(obj)
+    },
+    selectKeyDynamicParams (paramItem, field, index) {
+      if (!paramItem.leaf) return
+      // const obj = { ...item }
+      field.keyValueC = paramItem.text
+      field.keyValue = paramItem.code
+      field.keyParamsType = paramItem.paramsType
+    },
+    selectFieldDynamicParams (paramItem, field, index) {
+      if (!paramItem.leaf) return
+      // const obj = { ...item }
+      field.valueC = paramItem.text
+      field.value = paramItem.code
+      field.paramsType = paramItem.paramsType
+    },
+    selectDynamicParams (paramItem, item, index) {
+      if (!paramItem.leaf) return
+      const obj = { ...item }
+      obj.valueC = paramItem.text
+      obj.value = paramItem.code
+      obj.paramsType = paramItem.paramsType
+      this.addParamsList.splice(index, 1, obj)
+    },
+    deleteParams (index) {
+      this.addParamsList.splice(index, 1)
+    },
+    addParams (item) {
+      if (!item.leaf) return
+      // const index = this.addParamsList.findIndex(paramItem => (paramItem.code || paramItem.id) === item.code)
+      // if (index > -1) {
+      //   this.$message.error('已有该数据')
+      //   return
+      // }
+      const obj = { ...item, type: item.type || '1', targetParamsType: item.paramsType, value: '', valueC: '', paramsType: '', addType: 'add', valueType: 'designated' }
+      if (item.type === '2') {
+        obj.fields = []
+      }
+      if (['8', '9', '10'].includes(item.type)) {
+        obj.keyValue = ''
+        obj.keyValueC = ''
+        obj.keyParamsType = ''
+        obj.keyValueType = 'designated'
+      }
+      this.addParamsList.push(obj)
+    },
+    saveNodeData () {
+      this.$emit('updateElementValues', {
+        key: 'camunda:paramsMachining',
+        data: JSON.stringify(this.addParamsList)
+      })
+    },
+    getAddParamsList () {
+      if (!this.$_.isEmpty(this.elementValues['camunda:paramsMachining']) && this.elementValues['camunda:paramsMachining'] !== '[]') {
+        const paramsMachining = this.elementValues['camunda:paramsMachining']
+        if (paramsMachining) {
+          this.addParamsList = JSON.parse(paramsMachining)
+        }
+      }
+      this.metaParams = {}
+      this.addRecordParamData.forEach(item => {
+        if (item.children.length > 0) {
+          this.metaParams[item.uid] = item.children
+        }
+      })
+      this.initNodeParams.forEach(async item => {
+        let meta = this.getMeta(item.object)
+        if (!meta && item.object) {
+          meta = await this.$store.dispatch({
+            type: 'ADD_META',
+            metaId: item.object
+          })
+        }
+        // 获取所有字段
+        if (meta) {
+          const children = meta.getAllFieldConfigs().map(field => ({
+            name: field.attriLabel,
+            code: field.attriName,
+            dataType: field.dataType,
+            codeKey: field.dataType === 'object' ? field.relatedEntity : field.codeKey
+          }))
+          this.metaParams[item.object] = children
+        }
+      })
+    }
+  },
+  created () {
+    let newArr = []
+    if (this.globalParamsData.length > 0) {
+      newArr = JSON.parse(JSON.stringify(this.globalParamsData)).splice(0, 1)
+      newArr[0].children.forEach(item => {
+        // item.children = []
+        if (item.leaf === undefined)item.leaf = true
+        if (!item.type) item.type = '1'
+        if (item.children.length > 0) {
+          if (item.isloop) {
+            const arr = item.children.filter(child => !child.children || child.children.length === 0)
+            item.children = arr
+          }
+          if (item.nodeTypeId && (item.nodeTypeId === '19' || item.nodeTypeId === '24')) { // 单条查询 19  数据转换 24
+            item.children = []
+          }
+        }
+      })
+      this.initNodeParams = newArr[0].children
+    }
+    const inParamData = this.inParamData.map(item => ({ ...item, code: item.id, text: item.name, leaf: true }))
+    if (newArr[0].children && newArr[0].children.length > 0) {
+      this.machiningParams.push(newArr[0])
+    }
+    if (inParamData.length > 0) {
+      this.machiningParams.push({
+        text: '全局参数',
+        leaf: false,
+        code: 'LIUCHENG_PARAMS',
+        children: inParamData
+      })
+    }
+    if (this.machiningParams.length > 0) {
+      this.expandedKeys = [this.machiningParams[0].code]
+    }
+    // this.machiningParams = [...newArr, {
+    //   text: '全局参数',
+    //   leaf: false,
+    //   code: 'LIUCHENG_PARAMS',
+    //   children: inParamData
+    // }]
+    this.getAddParamsList()
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.add-params-item{
+  margin-bottom: 14px;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  // border-top: 1px solid var(--epx-border);
+  // padding-top: 10px;
+  position: relative;
+}
+.add-params-item-left{
+  // flex: 1;
+  // width: calc(100% - 20px);
+  width: 100%;
+  background: var(--epx-bg);
+  border-radius: var(--epx-radius-base);
+  padding: 0 10px;
+}
+.add-params-item-right{
+  width: 18px;
+  height: 18px;
+  border-radius: 50%;
+  text-align: right;
+  position: absolute;
+  right: -9px;
+  top: 0;
+  color: var(--epx-text);
+  font-size: 18px;
+}
+.add-params-item-right .el-icon-error{
+  cursor: pointer;
+  visibility: hidden;
+}
+.add-params-item:hover{
+  .el-icon-error{
+    visibility: visible;
+  }
+}
+.add-params-item-line-one{
+  display: flex;
+  align-items: center;
+  margin-bottom: 10px;
+  margin-top: 10px;
+}
+.add-params-item-name{
+  flex: 1;
+  font-weight: bold;
+  font-size: var(--epx-font-size-base);
+  color: #222222;
+}
+.machining-select{
+  width: 54px;
+
+    :deep(.el-input__inner) {
+      border: none;
+      background: var(--epx-bg);
+      padding: 0;
+    }
+    :deep(.el-input__suffix) {
+      right: 0px;
+    }
+
+}
+.machining-arr-input-con{
+  width: 320px;
+  height: 36px;
+
+    // EP 的输入框盒子是 .el-input__wrapper，.el-input__inner 只是里面的裸 <input>
+    // （element-ui 时代反过来）。高度打在 __inner 上 → 实际框高 = 值 + wrapper 上下各 1px，
+    // 且 --el-input-height 仍停在默认 32px，__prefix/__suffix/清除按钮的行高都按它算。
+    :deep(.el-input) {
+      --el-input-height: 36px;
+    }
+
+}
+.maching-map-input-con{
+  width: 286px;
+  height: 36px;
+
+    // EP 的输入框盒子是 .el-input__wrapper，.el-input__inner 只是里面的裸 <input>
+    // （element-ui 时代反过来）。高度打在 __inner 上 → 实际框高 = 值 + wrapper 上下各 1px，
+    // 且 --el-input-height 仍停在默认 32px，__prefix/__suffix/清除按钮的行高都按它算。
+    :deep(.el-input) {
+      --el-input-height: 36px;
+    }
+
+}
+.maching-object-input{
+  width: 180px;
+  height: 36px;
+
+    // EP 的输入框盒子是 .el-input__wrapper，.el-input__inner 只是里面的裸 <input>
+    // （element-ui 时代反过来）。高度打在 __inner 上 → 实际框高 = 值 + wrapper 上下各 1px，
+    // 且 --el-input-height 仍停在默认 32px，__prefix/__suffix/清除按钮的行高都按它算。
+    :deep(.el-input) {
+      --el-input-height: 36px;
+    }
+
+}
+.machining-map-label{
+  color: #fff;
+  border-radius: 50%;
+  width: 24px;
+  height: 24px;
+  background: #0076EF;
+  text-align: center;
+  margin-right: 10px;
+}
+.machining-map-value-label{
+  background: #EF8900;
+}
+.close-object-field{
+  margin-left: 10px;
+  cursor: pointer;
+}
+</style>