|
@@ -0,0 +1,202 @@
|
|
|
|
+<template>
|
|
|
|
+ <div class="my-layout">
|
|
|
|
+ <el-card class="mt8" shadow="never" :body-style="{ paddingBottom: '0' }">
|
|
|
|
+ <el-form :inline="true" @submit.stop.prevent>
|
|
|
|
+ <el-form-item>
|
|
|
|
+ <el-select lable="选择项目" v-model="state.uploadFilter.projectId" value-key="id" clearable >
|
|
|
|
+ <el-option v-for="item in state.uploadProjectList" :key="item.id" :label="item.name" :value="item.id" ></el-option>
|
|
|
|
+ </el-select>
|
|
|
|
+ </el-form-item>
|
|
|
|
+ <el-form-item>
|
|
|
|
+ <el-input v-model="state.uploadFilter.Company" placeholder="请输入推广码来源" />
|
|
|
|
+ </el-form-item>
|
|
|
|
+ <el-form-item>
|
|
|
|
+ <el-upload style="margin-right: 5px;"
|
|
|
|
+ :action="LinkAction"
|
|
|
|
+ :headers="linkHeaders"
|
|
|
|
+ :data="{ ProjectId: state.uploadFilter.projectId, Company:state.uploadFilter.Company }"
|
|
|
|
+ :show-file-list="false"
|
|
|
|
+ :before-upload="OnUploadLinkBefore"
|
|
|
|
+ :on-success="onUploadLinkSuccess"
|
|
|
|
+ :on-error="onUploadLinkError"
|
|
|
|
+ accept=".xlsx"
|
|
|
|
+ >
|
|
|
|
+ <el-button type="primary" icon="ele-Upload"> 导入推广码 </el-button>
|
|
|
|
+ </el-upload>
|
|
|
|
+ <el-button type="primary" icon="ele-Download" @click="onDownExcel"> 导出推广码样式 </el-button>
|
|
|
|
+ </el-form-item>
|
|
|
|
+ </el-form>
|
|
|
|
+ </el-card>
|
|
|
|
+ <el-card class="mt8" shadow="never" :body-style="{ paddingBottom: '0' }">
|
|
|
|
+ <el-form :inline="true" @submit.stop.prevent>
|
|
|
|
+ <el-form-item>
|
|
|
|
+ <el-select lable="选择项目" v-model="state.filter.projectId" value-key="id" clearable >
|
|
|
|
+ <el-option v-for="item in state.uploadProjectList" :key="item.id" :label="item.name" :value="item.id" ></el-option>
|
|
|
|
+ </el-select>
|
|
|
|
+ </el-form-item>
|
|
|
|
+ <el-form-item label="推广码来源">
|
|
|
|
+ <el-input v-model="state.filter.keywords" placeholder="请输入推广码来源" />
|
|
|
|
+ </el-form-item>
|
|
|
|
+ <el-form-item>
|
|
|
|
+ <el-button type="primary" icon="ele-Search" @click="onQuery"> 查询 </el-button>
|
|
|
|
+ </el-form-item>
|
|
|
|
+ </el-form>
|
|
|
|
+ </el-card>
|
|
|
|
+ <el-card class="my-fill mt8" shadow="never">
|
|
|
|
+ <el-table v-loading="state.loading" :data="state.projectLinkManageListData" row-key="id" height="'100%'" style="width: 100%; height: 100%">
|
|
|
|
+ <el-table-column label="项目名称" prop="projectName" min-width="120" show-overflow-tooltip/>
|
|
|
|
+ <el-table-column label="推广码来源" prop="company" min-width="120" show-overflow-tooltip/>
|
|
|
|
+ <el-table-column label="推广码数量(已使用/总数" prop="projectName" min-width="120" show-overflow-tooltip>
|
|
|
|
+ <template #default="{ row }">
|
|
|
|
+ {{ row.useCount }}/{{ row.count }}
|
|
|
|
+ </template>
|
|
|
|
+ </el-table-column>
|
|
|
|
+ <el-table-column label="操作" width="180" header-align="center" align="center" fixed="right">
|
|
|
|
+ <template #default="{ row }">
|
|
|
|
+ <el-button size="small" text type="primary" @click="onDetail(row)">查看明细</el-button>
|
|
|
|
+ <el-button size="small" text type="primary" @click="onEdit(row)">补充推广码</el-button>
|
|
|
|
+ </template>
|
|
|
|
+ </el-table-column>
|
|
|
|
+ </el-table>
|
|
|
|
+ </el-card>
|
|
|
|
+
|
|
|
|
+ <!-- <LinkForm ref="LinkFormRef" :title="state.linkFormTitle"></LinkForm> -->
|
|
|
|
+ <tenant-form ref="tenantFormRef" :title="state.tenantFormTitle"></tenant-form>
|
|
|
|
+ </div>
|
|
|
|
+</template>
|
|
|
|
+<script lang="ts" setup name="admin/projectlink">
|
|
|
|
+import { ref,onMounted, computed, reactive,onBeforeMount,getCurrentInstance, defineAsyncComponent } from 'vue'
|
|
|
|
+import { pageInputProjectLinkManagePageInput, ProjectLinkManagePageOutput, ProjectSelectOutput } from '/@/api/admin/data-contracts'
|
|
|
|
+import { ProjectLinkApi } from '/@/api/admin/ProjectLink'
|
|
|
|
+import { ProjectApi } from '/@/api/admin/project'
|
|
|
|
+import pinia from '/@/stores/index'
|
|
|
|
+import { useUserInfo } from '/@/stores/userInfo'
|
|
|
|
+import eventBus from '/@/utils/mitt'
|
|
|
|
+import { AxiosResponse } from 'axios'
|
|
|
|
+
|
|
|
|
+// const LinkForm = defineAsyncComponent(() => import('./components/link.vue'))
|
|
|
|
+const TenantForm = defineAsyncComponent(() => import('./components/linktest.vue'))
|
|
|
|
+
|
|
|
|
+const { proxy } = getCurrentInstance() as any
|
|
|
|
+const storesUserInfo = useUserInfo(pinia)
|
|
|
|
+
|
|
|
|
+// const linkFormRef = ref()
|
|
|
|
+const tenantFormRef = ref()
|
|
|
|
+
|
|
|
|
+const state = reactive({
|
|
|
|
+ loading: false,
|
|
|
|
+ tenantFormTitle: '',
|
|
|
|
+ linkFormTitle: '',
|
|
|
|
+ uploadFilter: {
|
|
|
|
+ projectId: 0,
|
|
|
|
+ Company: ''
|
|
|
|
+ },
|
|
|
|
+ filter: {
|
|
|
|
+ projectId: 0,
|
|
|
|
+ keywords:''
|
|
|
|
+ },pageInput: {
|
|
|
|
+ currentPage: 1,
|
|
|
|
+ pageSize: 20,
|
|
|
|
+ } as pageInputProjectLinkManagePageInput,
|
|
|
|
+ total: 0,
|
|
|
|
+ projectLinkManageListData: [] as Array<ProjectLinkManagePageOutput>,
|
|
|
|
+ uploadProjectList: [] as Array<ProjectSelectOutput>,
|
|
|
|
+ queryProjectList: [] as Array<ProjectSelectOutput>,
|
|
|
|
+ LinkLoading: false,
|
|
|
|
+ token: storesUserInfo.getToken()
|
|
|
|
+})
|
|
|
|
+onMounted(() => {
|
|
|
|
+ onProjects();
|
|
|
|
+ onQuery()
|
|
|
|
+ eventBus.off('refreshProjectLink')
|
|
|
|
+ eventBus.on('refreshProjectLink', async () => {
|
|
|
|
+ onQuery()
|
|
|
|
+ })
|
|
|
|
+
|
|
|
|
+})
|
|
|
|
+onBeforeMount(() => {
|
|
|
|
+ eventBus.off('refreshProjectLink')
|
|
|
|
+})
|
|
|
|
+//查询
|
|
|
|
+const onQuery=async () => {
|
|
|
|
+ state.loading = true
|
|
|
|
+ state.pageInput.filter = state.filter
|
|
|
|
+ const res = await new ProjectLinkApi().getPageManage(state.pageInput).catch(() => {
|
|
|
|
+ state.loading = false
|
|
|
|
+ })
|
|
|
|
+ state.projectLinkManageListData = res?.data?.list ?? []
|
|
|
|
+ state.total = res?.data?.total ?? 0
|
|
|
|
+ state.loading = false
|
|
|
|
+}
|
|
|
|
+//项目列表
|
|
|
|
+const onProjects = async () => {
|
|
|
|
+ let input:any = {}
|
|
|
|
+ const res = await new ProjectApi().getAll(input).catch(() => {
|
|
|
|
+
|
|
|
|
+ })
|
|
|
|
+ state.uploadProjectList = res?.data ?? []
|
|
|
|
+ state.queryProjectList = res?.data ?? []
|
|
|
|
+}
|
|
|
|
+//导出推广码模板
|
|
|
|
+const onDownExcel =() => {
|
|
|
|
+ // window.location.href= import.meta.env.VITE_API_URL +'/link/linkcode.xlsx'
|
|
|
|
+ let url= import.meta.env.VITE_API_URL + '/link/linkcode.xlsx'
|
|
|
|
+ window.open(url,'_self');
|
|
|
|
+}
|
|
|
|
+//导入推广码
|
|
|
|
+// 上传推广码请求url
|
|
|
|
+const LinkAction = computed(() => {
|
|
|
|
+ return import.meta.env.VITE_API_URL + '/api/admin/project-link/upload-link'
|
|
|
|
+})
|
|
|
|
+// 上传推广码请求头部
|
|
|
|
+const linkHeaders = computed(() => {
|
|
|
|
+ return { Authorization: 'Bearer ' + state.token }
|
|
|
|
+})
|
|
|
|
+// 上传推广码成功
|
|
|
|
+const onUploadLinkSuccess = (res: AxiosResponse) => {
|
|
|
|
+ state.LinkLoading = false
|
|
|
|
+ if (!res?.success) {
|
|
|
|
+ if (res.msg) {
|
|
|
|
+ proxy.$modal.msgError(res.msg)
|
|
|
|
+ }
|
|
|
|
+ return
|
|
|
|
+ } else {
|
|
|
|
+ eventBus.off('refreshProjectLink')
|
|
|
|
+ }
|
|
|
|
+}
|
|
|
|
+// 上传推广码失败
|
|
|
|
+const onUploadLinkError = (error: any) => {
|
|
|
|
+ state.LinkLoading = false
|
|
|
|
+ let message = ''
|
|
|
|
+ if (error.message) {
|
|
|
|
+ try {
|
|
|
|
+ message = JSON.parse(error.message)?.msg
|
|
|
|
+ } catch (err) {
|
|
|
|
+ message = error.message || ''
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ if (message) proxy.$modal.msgError(message)
|
|
|
|
+}
|
|
|
|
+//上传推广码前
|
|
|
|
+const OnUploadLinkBefore = () => {
|
|
|
|
+ if(state.uploadFilter.projectId <= 0)
|
|
|
|
+ {
|
|
|
|
+ proxy.$modal.msgError("请选择项目");
|
|
|
|
+ return false;
|
|
|
|
+ }
|
|
|
|
+ if (state.uploadFilter.Company.length <= 0) {
|
|
|
|
+ proxy.$modal.msgError("请输入推广码来源");
|
|
|
|
+ return false;
|
|
|
|
+ }
|
|
|
|
+ state.token = storesUserInfo.getToken()
|
|
|
|
+ state.LinkLoading = true
|
|
|
|
+}
|
|
|
|
+const onDetail = (row: ProjectLinkManagePageOutput) => {
|
|
|
|
+ state.tenantFormTitle = '编辑租户'
|
|
|
|
+ tenantFormRef.value.open(row)
|
|
|
|
+
|
|
|
|
+ // state.linkFormTitle = '明细'
|
|
|
|
+ // linkFormRef.value.open(row)
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+</script>
|