index_20220714154751.vue 2.86 KB
<template>
    <div>
        <div style="display: flex;align-items: center;justify-content: space-between;">
            <div>
                <a-input-search v-model:value="value" placeholder="请输入商品名" style="width: 200px;margin-left: 20px;"
                    @search="onSearch" />
                <!-- <a-space direction="vertical">
                    <a-select v-model:value="value1" :size="size" style="width: 200px;margin-left: 20px;" :options="options"></a-select>
                </a-space> -->
            </div>
            <div>
                <a-button type="primary" block>新建支付项</a-button>
            </div>
        </div>
        <div style="margin-top: 10px;">
            <a-table :dataSource="list" :columns="columns">
                <template #bodyCell="{ column,record }">
                <div v-if="column.key == 'name'">
                    <image :src="record.picurl"/> 
                      <a-image :width="200" :src="record.picurl"/><div>{{record.subject}}</div>
                </div>
                    <div v-if="column.key == 'tags'">
                        <a-button type="primary" @click="onEdit">编辑</a-button>
                        <a-button type="primary" style="margin-left: 20px;">支付链接</a-button>
                        <a-button type="primary" style="margin-left: 20px;">统计</a-button>
                        <a-button type="primary" style="margin-left: 20px;">删除</a-button>
                    </div>
                </template>
            </a-table>
        </div>
    </div>
</template>

<script lang="ts" setup>
import { ref, defineExpose,onMounted} from 'vue';
import type { SelectProps } from 'ant-design-vue';
import {getUid} from '@/utils/userInfo'
import {onSelectGoods,onfindby} from '@/api/index'
const popupScroll = () => {
    console.log('popupScroll');
};
const value = ref<string>('');
const optionss = ref<Array<Object>>([])
const options = [...Array(25)].map((_, i) => ({ value: (i + 10).toString(36) + (i + 1) }))
let list = ref()
const columns = [
    {
        title: '支付项目名称',
        dataIndex: 'picurl',
        key: 'picurl',
    },
    {
        title: '年龄',
        dataIndex: 'age',
        key: 'age',
    },
    {
        title: '住址',
        dataIndex: 'address',
        key: 'address',
    },
    {
        title: '操作',
        dataIndex: 'tags',
        key: 'tags',
    },
]
const onEdit = (e:any)=>{
    console.log(e);
}
const onSearch =  async() => {
  const params = {
    status:"0",
    name:value.value,
    uid:getUid()
  }
  const data = await onfindby(params)
  list.value = data.data
  console.log(list,'list');
  
};
onMounted(async () => {
   onSearch()
})
defineExpose({
    size: ref<SelectProps['size']>('middle'),
    value1: ref('a1'),
    options,
    value,
    onSearch,
    columns,
    onEdit,
    optionss
})
</script>
<style lang="less" scoped>
</style>