123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186 |
- <template>
- <vxe-modal v-model="value" id="supplierModal" v-loading="load" :width="width?width+'px':'60%'" @show="show" :height="height?height+'px':'80%'" min-width="500" min-height="400"
- show-zoom resize transfer show-footer :zIndex="zIndex">
- <template #title>
- <span>{{title?title:'选择供应商'}}</span>
- </template>
- <template #default>
- <module-view :propConfig="config" ref="view" @pagination="getList" @search="getList" @resert="getList" @clickHandle="clickHandle" />
- </template>
- <template #footer>
- <div class="btn">
- <el-button plain size="small" @click="value = false">取消</el-button>
- <el-button type="primary" size="small" @click="confirm">确定</el-button>
- </div>
- </template>
- </vxe-modal>
- </template>
- <script lang="ts">
- import { Component, Prop, Vue, Watch } from "vue-property-decorator";
- @Component
- export default class SupplierModal extends Vue {
- value=false
- data:Array<any>=[]
- time:any;
- timeNum = 0;
- load=false;
- @Prop()
- title?:string
- @Prop()
- width?:number
- @Prop()
- height?:number
- @Prop()
- mulit?:boolean
-
- @Prop()
- zIndex?:number
- config:any={
- attr:{
- calculateH:true
- },
- search:{
- attr:{
- size:'mini',
-
- },
- columns:[
- [{
- labelWidth:'120px',
- span:10,
- label:'名称',
- prop:'name',
- component:'by-input',
- compConfig:{
- attr:{
- clearable:true,
- placeholder:'请输入名称'
- }
- }
- },{
- labelWidth:'120px',
- span:10,
- label:'负责人',
- prop:'contacts',
- component:'by-input',
- compConfig:{
- attr:{
- clearable:true,
- placeholder:'请输入负责人'
- }
- }
- }]
- ]
- },
- tool:{
- tools:{
- search:true,
- refresh:true
- }
- },
- table:{
- attr:{
- size:'mini',
- seq:true,
- align:'center',
- triggerRowCheck:'row',
- pageSize:10
- },
- columns:[{
- title:'名称',
- field:'name'
- },{
- title:'负责人',
- field:'contacts'
- }]
- },
- }
- clickHandle(n:string){
- if(n == 'onRefresh'){
- this.getList()
- }
- }
- setShow(v:boolean){
- this.value = v;
- }
- created(){
- if(this.mulit){
- this.config.table.attr.checkbox = true
- }else{
- this.config.table.attr.radio = true
- }
- }
- //确定
- confirm(){
- let data:Array<any>=this.getSelectdata();
- if(data.length == 0){
- this.$message('请选择供应商!')
- return
- }
- this.$emit('confirm',data);
- this.value = false;
- }
- //获取已选中表格数据
- getSelectdata(){
- let data:Array<any>=[];
- if(this.$refs.view){
- data = (this.$refs.view as any).getSelectData()
- }
- return data;
- }
- //显示弹窗
- show(){
- if(this.data.length ==0){
- this.time =setInterval(()=>{
- this.getList()
- },500)
- }
- if(this.$refs.view){
- (this.$refs.view as any).clearCheckboxRow();
- }
- }
- getList(){
- if(!this.$refs.view){
- if(this.timeNum > 5){
- clearInterval(this.time)
- }
- this.timeNum ++;
- return
- }
- clearInterval(this.time)
- let query:any = (this.$refs.view as any).getQuery();
- query.isLikeSearch = '1';
- this.$emit('supplierRequestAfter',query);
- this.load = true;
- (this as any).$request({
- url: '/maindata/maindataMaterialSupplier/page',
- method: 'get',
- params:query
- }).then((res:any) => {
- this.load = false;
- if(res.data.records){
- (this.$refs.view as any).setTableValue(res.data.records);
- this.data = res.data.records;
- let page={
- pageNo: res.data.current, //当前页
- pageSize: res.data.size, //每页条数
- total: res.data.total //总条数
- };
- (this.$refs.view as any).setPage(page)
- }
- }).catch(()=>{
- this.load = false;
- })
- }
- }
- </script>
|