|
@@ -0,0 +1,178 @@
|
|
|
+<template>
|
|
|
+ <div class="select-input">
|
|
|
+ <!-- 用途 -->
|
|
|
+ <div class="purpose" v-if="type == 1">
|
|
|
+ <Select
|
|
|
+ v-model="purposeIndex"
|
|
|
+ style="width: 200px"
|
|
|
+ @on-change="selectPurposeFn"
|
|
|
+ filterable
|
|
|
+ >
|
|
|
+ <div slot="empty">无匹配数据</div>
|
|
|
+ <Option :value="999">全部</Option>
|
|
|
+ <Option
|
|
|
+ v-for="(i, index) in selectPurposeList"
|
|
|
+ :value="index"
|
|
|
+ :key="index"
|
|
|
+ >{{ i.purpose }}</Option
|
|
|
+ >
|
|
|
+ </Select>
|
|
|
+ </div>
|
|
|
+ <!-- 供应商 -->
|
|
|
+ <div v-if="type == 2">
|
|
|
+ <Poptip trigger="focus" width="250" placement="bottom">
|
|
|
+ <div slot="content">
|
|
|
+ <ul style="" class="commons-select-search">
|
|
|
+ <li
|
|
|
+ :key="i.id"
|
|
|
+ v-for="i in supplierList"
|
|
|
+ @click="supplierListCk(i)"
|
|
|
+ >
|
|
|
+ {{ i.name }}
|
|
|
+ </li>
|
|
|
+ </ul>
|
|
|
+ </div>
|
|
|
+ <Input
|
|
|
+ v-model="inputValue"
|
|
|
+ @on-change="getSupplierSelectList"
|
|
|
+ placeholder="请输入用途关键词"
|
|
|
+ ></Input>
|
|
|
+ </Poptip>
|
|
|
+ </div>
|
|
|
+ <!-- 物料 -->
|
|
|
+ <div v-if="type == 3">
|
|
|
+ <Poptip trigger="focus" width="250" placement="bottom">
|
|
|
+ <div slot="content">
|
|
|
+ <ul style="" class="commons-select-search">
|
|
|
+ <li
|
|
|
+ :key="i.id"
|
|
|
+ v-for="i in materialList"
|
|
|
+ @click="materialListCk(i)"
|
|
|
+ >
|
|
|
+ {{ i.name }}
|
|
|
+ </li>
|
|
|
+ </ul>
|
|
|
+ </div>
|
|
|
+ <Input
|
|
|
+ v-model="inputValue"
|
|
|
+ @on-change="getMaterialSelectList"
|
|
|
+ placeholder="请输入物料名称"
|
|
|
+ ></Input>
|
|
|
+ </Poptip>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import axios from 'axios'
|
|
|
+export default {
|
|
|
+ props: {
|
|
|
+ //1 用途 2 物料 3供应商
|
|
|
+ type: String,
|
|
|
+ value: {
|
|
|
+ type: String,
|
|
|
+ default: '',
|
|
|
+ require: true,
|
|
|
+ },
|
|
|
+ },
|
|
|
+ name: '',
|
|
|
+ watch: {
|
|
|
+ value: {
|
|
|
+ handler() {
|
|
|
+ this.$emit('input', this.value)
|
|
|
+ },
|
|
|
+ immediate: true,
|
|
|
+ },
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ purposeIndex: null,
|
|
|
+ selectPurposeList: [],
|
|
|
+ inputValue: this.value,
|
|
|
+ supplierList: [],
|
|
|
+ materialList: [],
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ getMaterialSelectList() {
|
|
|
+ const v = this
|
|
|
+ v.loading = true
|
|
|
+ axios
|
|
|
+ .post('/cloudApi/material/selectList', {
|
|
|
+ pageNum:1,
|
|
|
+ pageSize:10,
|
|
|
+ search:this.inputValue,
|
|
|
+ })
|
|
|
+ .then((res) => {
|
|
|
+ v.materialList = res.data.data
|
|
|
+ v.loading = false
|
|
|
+ })
|
|
|
+
|
|
|
+ },
|
|
|
+ getSupplierSelectList(req) {
|
|
|
+ const v = this
|
|
|
+ v.loading = true
|
|
|
+ axios
|
|
|
+ .post('/cloudApi/supplier/selectList', {
|
|
|
+ search: this.inputValue,
|
|
|
+ })
|
|
|
+ .then((res) => {
|
|
|
+ v.supplierList = res.data.data
|
|
|
+ v.loading = false
|
|
|
+ console.log(v.supplierList)
|
|
|
+ })
|
|
|
+ },
|
|
|
+ materialListCk(i){
|
|
|
+ console.log(i)
|
|
|
+ this.inputValue = i.name
|
|
|
+ this.$emit('input', i.name)
|
|
|
+ },
|
|
|
+ supplierListCk(i) {
|
|
|
+ console.log(i)
|
|
|
+ this.inputValue = i.name
|
|
|
+ this.$emit('input', i.name)
|
|
|
+ },
|
|
|
+ selectPurposeFn(e) {
|
|
|
+ console.log(e)
|
|
|
+ if (e == 999) {
|
|
|
+ this.inputValue = ''
|
|
|
+ this.$emit('input', '')
|
|
|
+ } else {
|
|
|
+ this.inputValue = this.selectPurposeList[e].purpose
|
|
|
+ this.$emit('input', this.selectPurposeList[e].purpose)
|
|
|
+ }
|
|
|
+ },
|
|
|
+ getMaterialSelectPurposeList() {
|
|
|
+ const v = this
|
|
|
+ v.loading = true
|
|
|
+ axios
|
|
|
+ .get('/cloudApi/material/selectPurposeList?purpose=' + '', {})
|
|
|
+ .then((res) => {
|
|
|
+ v.selectPurposeList = res.data.data
|
|
|
+ v.loading = false
|
|
|
+ })
|
|
|
+ },
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ const v = this
|
|
|
+ if (v.type == undefined) {
|
|
|
+ console.log('请配置type //1 用途 2 物料 3供应商')
|
|
|
+ return
|
|
|
+ }
|
|
|
+ switch (v.type) {
|
|
|
+ case '1':
|
|
|
+ v.getMaterialSelectPurposeList()
|
|
|
+ break
|
|
|
+ case '2':
|
|
|
+ v.getSupplierSelectList()
|
|
|
+ case '3':
|
|
|
+ v.getMaterialSelectList()
|
|
|
+ default:
|
|
|
+ break
|
|
|
+ }
|
|
|
+ },
|
|
|
+}
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="less" scoped>
|
|
|
+</style>
|