add 产品新增产品介绍和产品图

This commit is contained in:
chenbo 2023-12-15 15:17:06 +08:00
parent e1f6cd3317
commit 3bf466d098
4 changed files with 91 additions and 5 deletions

View File

@ -2,7 +2,9 @@ const config = {
terminal: 1, //终端
title: '后台管理系统', //网站默认标题
version: '1.6.0', //版本号
baseUrl: `${import.meta.env.VITE_APP_BASE_URL || ''}/`, //请求接口域名
baseUrl: `${
import.meta.env.VITE_APP_BASE_URL
}/`, //请求接口域名
// baseUrl: 'http://127.0.0.1:30005/',
urlPrefix: 'adminapi', //请求默认前缀
timeout: 10 * 1000 //请求超时时长

View File

@ -4,7 +4,9 @@ import install from './install'
import './permission'
import './styles/index.scss'
import 'virtual:svg-icons-register'
import configs from './config/index'
const app = createApp(App)
app.use(install)
app.provide('base_url', configs.baseUrl+configs.urlPrefix);
app.mount('#app')

View File

@ -15,6 +15,33 @@
<el-form-item label="产品编号" prop="code">
<el-input v-model="formData.code" clearable disabled placeholder="请输入产品编号" />
</el-form-item>
<el-form-item label="产品介绍" prop="desc">
<el-input v-model="formData.desc" />
</el-form-item>
<el-form-item label="产品图" prop="image">
<el-upload
class="avatar-uploader"
:accept="acceptFileTypes"
v-model="formData.image"
:data="{ cid: 1 }"
:headers="{ Token: userStore.token }"
:action="action"
:show-file-list="false"
:on-success="handleAvatarSuccessAvatar"
>
<img
v-if="formData.image"
:src="formData.image"
class="avatar"
/>
<div v-else class="avatar-uploader-icon">
<el-icon>
<Plus />
</el-icon>
</div>
</el-upload>
</el-form-item>
<el-form-item v-if="formData.root == 1" label="所属用户" prop="user_id">
<el-select
@ -59,24 +86,41 @@
<script lang="ts" setup name="productEdit">
import { useDictOptions } from '@/hooks/useDictOptions'
import type { FormInstance } from 'element-plus'
import { type FormInstance,
type UploadProps,
ElMessage,
} from 'element-plus'
import Popup from '@/components/popup/index.vue'
import { apiProductAdd, apiProductEdit, apiProductDetail, getUserList, getUserInfo, apiLandLists } from '@/api/product'
import { timeFormat } from '@/utils/util'
import useUserStore from "@/stores/modules/user";
import type { PropType } from 'vue'
import {ref} from "vue";
import config from "@/config";
defineProps({
dictData: {
type: Object as PropType<Record<string, any[]>>,
default: () => ({})
}
})
const emit = defineEmits(['success', 'close'])
const formRef = shallowRef<FormInstance>()
const popupRef = shallowRef<InstanceType<typeof Popup>>()
const mode = ref('add')
const acceptFileTypes = ref(".png, .jpg, .jpeg, image/png, image/jpeg")
const action = ref(`${config.baseUrl}${config.urlPrefix}/upload/image`)
const userStore = useUserStore()
const handleAvatarSuccessAvatar: UploadProps["onSuccess"] = (
response,
uploadFile
) => {
if (response.code == 0) {
ElMessage.error(response.msg);
return;
}
formData.image = response.data.uri;
};
//
const popupTitle = computed(() => {
return mode.value == 'edit' ? '编辑产品' : '新增产品'
@ -90,6 +134,8 @@ const formData = reactive({
land_id: '',
code: '',
name: '',
desc: '',
image: '',
status: '',
})
@ -213,3 +259,35 @@ defineExpose({
getDetail
})
</script>
<style scoped>
.avatar-uploader .avatar {
width: 178px;
height: 178px;
display: block;
}
</style>
<style>
.avatar-uploader .el-upload {
width: 200px;
height: 130px;
border: 1px dashed var(--el-border-color);
border-radius: 6px;
cursor: pointer;
position: relative;
overflow: hidden;
transition: var(--el-transition-duration-fast);
}
.avatar-uploader .el-upload:hover {
border-color: var(--el-color-primary);
}
.el-icon.avatar-uploader-icon {
font-size: 28px;
color: #8c939d;
width: 178px;
height: 178px;
text-align: center;
}
</style>

View File

@ -56,6 +56,8 @@ class ProductLogic extends BaseLogic
'user_id' => $userId,
'code' => $params['code'],
'name' => $params['name'],
'desc' => $params['desc'],
'image' => $params['image'],
'status' => $status,
]);
if (!empty($params['land_id'])) {
@ -103,6 +105,8 @@ class ProductLogic extends BaseLogic
'user_id' => $userId,
'code' => $params['code'],
'name' => $params['name'],
'desc' => $params['desc'],
'image' => $params['image'],
'status' => $status,
]);
if (!empty($params['land_id'])) {