|
@@ -1,220 +0,0 @@
|
|
|
-<template>
|
|
|
- <!-- 对话框表单 -->
|
|
|
- <el-dialog custom-class="ba-operate-dialog" :close-on-click-modal="false"
|
|
|
- :model-value="baTable.form.operate ? true : false" @close="baTable.toggleForm">
|
|
|
- <template #header>
|
|
|
- <div class="title" v-drag="['.ba-operate-dialog', '.el-dialog__header']" v-zoom="'.ba-operate-dialog'">
|
|
|
- {{ baTable.form.operate ? baTable.form.operate == 'edit' ? '编辑' : '添加' : '无标题' }}
|
|
|
- </div>
|
|
|
- </template>
|
|
|
- <el-scrollbar v-loading="baTable.form.loading" class="ba-table-form-scrollbar">
|
|
|
- <div class="ba-operate-form" :class="'ba-' + baTable.form.operate + '-form'"
|
|
|
- :style="'width: calc(100% - ' + baTable.form.labelWidth! / 2 + 'px)'">
|
|
|
- <el-form ref="formRef" @keyup.enter="baTable.onSubmit(formRef)" :model="baTable.form.items"
|
|
|
- label-position="right" :label-width="baTable.form.labelWidth + 'px'" :rules="rules"
|
|
|
- v-if="!baTable.form.loading">
|
|
|
- <el-form-item prop="adTitle" label="广告标题">
|
|
|
- <el-input v-model="baTable.form.items!.adTitle"></el-input>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item prop="sceneType" label="场景">
|
|
|
- <el-select v-model="baTable.form.items!.sceneType" placeholder="请选择场景" style="width: 100%"
|
|
|
- clearable>
|
|
|
- <el-option label="开机" :value="0"/>
|
|
|
- <el-option label="轮播" :value="1"/>
|
|
|
- </el-select>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item prop="adType" label="类型">
|
|
|
- <el-select v-model="baTable.form.items!.adType" placeholder="请选择类型" style="width: 100%"
|
|
|
- clearable
|
|
|
- @change="onChange">
|
|
|
- <el-option label="展示" :value="0"/>
|
|
|
- <el-option label="推广" :value="1"/>
|
|
|
- <el-option label="好物" :value="2"/>
|
|
|
- </el-select>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item prop="documentId" label="关联" v-if="baTable.form.items.adType>0">
|
|
|
- <el-select v-model="baTable.form.items!.documentId" placeholder="请选择关联" style="width: 100%"
|
|
|
- clearable
|
|
|
- filterable>
|
|
|
- <el-option v-for="(item,index) in datas.selectList" :label="item.label" :value="item.value"
|
|
|
- :key="index"/>
|
|
|
- </el-select>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item prop="adStatus" label="状态">
|
|
|
- <el-select v-model="baTable.form.items!.adStatus" placeholder="请选择状态" style="width: 100%"
|
|
|
- clearable>
|
|
|
- <el-option label="下架" :value="1"/>
|
|
|
- <el-option label="上架" :value="0"/>
|
|
|
- </el-select>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item prop="screenDisplayHorizontalUrl" label="大屏横屏展示"
|
|
|
- v-if="baTable.form.items!.sceneType==0">
|
|
|
- <pictureUpload v-model:fileUrl="baTable.form.items!.screenDisplayHorizontalUrl"></pictureUpload>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item prop="screenDisplayVerticalUrl" label="大屏竖屏展示"
|
|
|
- v-if="baTable.form.items!.sceneType==0">
|
|
|
- <pictureUpload v-model:fileUrl="baTable.form.items!.screenDisplayVerticalUrl"></pictureUpload>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item prop="screenDisplayHorizontalUrl" label="大屏轮播展示"
|
|
|
- v-if="baTable.form.items!.sceneType==1">
|
|
|
- <pictureUpload v-model:fileUrl="baTable.form.items!.screenDisplayHorizontalUrl"></pictureUpload>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item prop="appDisplayUrl" label="移动APP展示">
|
|
|
- <pictureUpload v-model:fileUrl="baTable.form.items!.appDisplayUrl"></pictureUpload>
|
|
|
- </el-form-item>
|
|
|
- <div style="font-size: 10px;color: #92969a;margin-left: 150px">
|
|
|
- 仅限jpg/png格式文件,大小不超过1MB
|
|
|
- </div>
|
|
|
- </el-form>
|
|
|
- </div>
|
|
|
- </el-scrollbar>
|
|
|
- <template #footer>
|
|
|
- <div :style="'width: calc(100% - ' + baTable.form.labelWidth! / 1.8 + 'px)'">
|
|
|
- <el-button @click="baTable.toggleForm('')">取消</el-button>
|
|
|
- <el-button v-blur :loading="baTable.form.submitLoading" @click="baTable.onSubmit(formRef)"
|
|
|
- type="primary">
|
|
|
- {{ baTable.form.operateIds && baTable.form.operateIds.length > 1 ? '保存并编辑下一项' : '保存' }}
|
|
|
- </el-button>
|
|
|
- </div>
|
|
|
- </template>
|
|
|
- </el-dialog>
|
|
|
-</template>
|
|
|
-
|
|
|
-<script setup lang="ts">
|
|
|
-import {ref, reactive, inject, onMounted, watch} from 'vue'
|
|
|
-
|
|
|
-import type baTableClass from '/@/utils/baTable'
|
|
|
-import {regularPassword, validatorAccount, validatorMobile} from '/@/utils/validate'
|
|
|
-import type {ElForm, FormItemRule} from 'element-plus'
|
|
|
-import FormItem from '/@/components/formItem/index.vue'
|
|
|
-import {getOrgTree, getEmployees} from '/@/api/backend/auth/account'
|
|
|
-import {authGroup, sysConfig} from '/@/api/controllerUrls'
|
|
|
-import editor from '/@/components/editor/index.vue'
|
|
|
-import request from '/@/api/request'
|
|
|
-import {ElNotification} from 'element-plus/es'
|
|
|
-import {document} from '/@/api/controllerUrls'
|
|
|
-import pictureUpload from '/@/components/pictureUpload/index.vue'
|
|
|
-import {getRecommendList} from '/@/api/backend/enterprise/advertisement'
|
|
|
-
|
|
|
-const formRef = ref<InstanceType<typeof ElForm>>()
|
|
|
-const baTable = inject('baTable') as baTableClass
|
|
|
-
|
|
|
-onMounted(() => {
|
|
|
- getDocList()
|
|
|
-})
|
|
|
-
|
|
|
-let datas = reactive({
|
|
|
- selectList: [],
|
|
|
-})
|
|
|
-
|
|
|
-function getDocList() {
|
|
|
- request.index(document, undefined, 'list').then((res) => {
|
|
|
- datas.selectList = []
|
|
|
- baTable.form.items!.documentId = ''
|
|
|
- res.data.map((item: any) => {
|
|
|
- let selectItem = {
|
|
|
- label: item.documentTitle,
|
|
|
- value: item.id,
|
|
|
- }
|
|
|
- datas.selectList.push(selectItem)
|
|
|
- })
|
|
|
-
|
|
|
- })
|
|
|
-}
|
|
|
-
|
|
|
-const onChange = (val: any) => {
|
|
|
- if (val === 1) {
|
|
|
- getDocList()
|
|
|
- }
|
|
|
-
|
|
|
- if (val === 2) {
|
|
|
- getRecommendList().then((res) => {
|
|
|
- datas.selectList = []
|
|
|
- baTable.form.items!.documentId = ''
|
|
|
- res.data.map((item: any) => {
|
|
|
- let selectItem = {
|
|
|
- label: item.recommendTitle,
|
|
|
- value: item.id,
|
|
|
- }
|
|
|
-
|
|
|
- datas.selectList.push(selectItem)
|
|
|
- })
|
|
|
- })
|
|
|
- }
|
|
|
-}
|
|
|
-
|
|
|
-const rules: Partial<Record<string, FormItemRule[]>> = reactive({
|
|
|
- adTitle: [
|
|
|
- {
|
|
|
- required: true,
|
|
|
- message: '请输入标题',
|
|
|
- trigger: 'blur',
|
|
|
- },
|
|
|
- ],
|
|
|
- sceneType: [
|
|
|
- {
|
|
|
- required: true,
|
|
|
- message: '请选择场景',
|
|
|
- trigger: 'blur',
|
|
|
- },
|
|
|
- ],
|
|
|
- adType: [
|
|
|
- {
|
|
|
- required: true,
|
|
|
- message: '请选择类型',
|
|
|
- trigger: 'blur',
|
|
|
- },
|
|
|
- ],
|
|
|
- documentId: [
|
|
|
- {
|
|
|
- required: true,
|
|
|
- message: '请选择关联',
|
|
|
- trigger: 'blur',
|
|
|
- },
|
|
|
- ],
|
|
|
- adStatus: [
|
|
|
- {
|
|
|
- required: true,
|
|
|
- message: '请选择状态',
|
|
|
- trigger: 'blur',
|
|
|
- },
|
|
|
- ],
|
|
|
-})
|
|
|
-</script>
|
|
|
-
|
|
|
-<style scoped lang="scss">
|
|
|
-.avatar-uploader {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: center;
|
|
|
- position: relative;
|
|
|
- border-radius: var(--el-border-radius-small);
|
|
|
- box-shadow: var(--el-box-shadow-light);
|
|
|
- border: 1px dashed var(--color-sub-1);
|
|
|
- cursor: pointer;
|
|
|
- overflow: hidden;
|
|
|
- width: 110px;
|
|
|
- height: 110px;
|
|
|
-}
|
|
|
-
|
|
|
-.avatar-uploader:hover {
|
|
|
- border-color: var(--color-primary);
|
|
|
-}
|
|
|
-
|
|
|
-.avatar {
|
|
|
- width: 110px;
|
|
|
- height: 110px;
|
|
|
- display: block;
|
|
|
-}
|
|
|
-
|
|
|
-.image-slot {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: center;
|
|
|
- height: 100%;
|
|
|
-}
|
|
|
-</style>
|
|
|
-
|
|
|
-function getRecommendList() {
|
|
|
-throw new Error('Function not implemented.')
|
|
|
-}
|