yh-ui/src/components/Business/ProdOrder/ProdOrderInput.vue

<!--version: 4, 经营场所选择器-->
<!--版本更新内容：添加prop属性，修复多选-->

<template>
  <div>
    <template v-if="multiple">
      <el-tag
        v-for="(item,index) of selected"
        :key="item.priceId"
        size="small"
        style="margin-right: 4px"
        disable-transitions
        :closable="!disabled"
        @close="onCloseSelected(index)"
      >{{item.name}}</el-tag>
      <el-tag style="cursor: not-allowed" size="small" type="info" v-if="disabled">+</el-tag>
      <el-tag style="cursor: pointer" size="small" @click="openDialog" type="success" v-else>+</el-tag>
    </template>
    <el-input
      v-else
      :value="inputBindValue"
      @focus="openDialog"
      :size="size"
      :disabled="disabled"
      readonly
      ref="inputRef"
      :placeholder="placeholder">
      <template #suffix><i class="el-icon-arrow-right"/></template>
    </el-input>

    <prod-order-dialog
      v-if="openType === 'dialog'"
      :show.sync="dialogShow"
      :query="query"
      :multiple="multiple"
      :init-select="selected"
      @select="onSubmit"
      :prop="prop"
      :title="title"
      :list-api="listApi"
    />
    <prod-order-drawer
      v-else-if="openType === 'drawer'"
      :show.sync="dialogShow"
      :query="query"
      :multiple="multiple"
      :init-select="selected"
      @select="onSubmit"
      :prop="prop"
      :title="title"
      :list-api="listApi"
    />
  </div>
</template>

<script>
import {$businessInput} from "@/components/Business/mixins";
import ProdOrderDrawer from "@/components/Business/ProdOrder/ProdOrderDrawer.vue";
import {listProdOrder, listProdOrderByIds} from "@/api/yh/prodOrder";
import ProdOrderDialog from "@/components/Business/ProdOrder/ProdOrderDialog.vue";

export default {
  name: 'ProdOrderInput',
  mixins: [$businessInput],
  components: {ProdOrderDialog, ProdOrderDrawer},
  props: {
    listApi: {
      type: Function,
      default: listProdOrder,
    },
    loadApi: {
      type: Function,
      default: listProdOrderByIds
    },
    prop: {
      type: String,
      default: "id"
    },
    // 展示值的属性
    showProp: {
      type: String,
      default: 'erpBillNo'
    },
    // 打开的类型
    openType: {
      type: String,
      default: 'dialog',
    },
    title: {
      type: String,
      default: "选择生产订单"
    },
    placeholder: {
      type: String,
      default: "点击选择生产订单"
    }
  }
}
</script>