init
This commit is contained in:
413
pages/config/goodsAdd.vue
Normal file
413
pages/config/goodsAdd.vue
Normal file
@@ -0,0 +1,413 @@
|
||||
<template>
|
||||
|
||||
<view class="page-content">
|
||||
<view style=" padding: 20rpx;">
|
||||
<nut-form>
|
||||
<nut-form-item label="名称">
|
||||
<nut-input v-model="form.goods_name" class="nut-input-text" placeholder="请输入名称" type="text" />
|
||||
</nut-form-item>
|
||||
|
||||
<nut-form-item label="串号">
|
||||
<nut-input v-model="form.goods_no" class="nut-input-text" placeholder="请输入串号" type="text">
|
||||
<template #right>
|
||||
<nut-icon @click="onScan" name="scan2" size="30" custom-color="#000000" />
|
||||
</template>
|
||||
</nut-input>
|
||||
</nut-form-item>
|
||||
|
||||
<nut-form-item label="售价">
|
||||
<nut-input v-model="form.goods_price" class="nut-input-text" placeholder="请输入售价" type="nubmer" />
|
||||
</nut-form-item>
|
||||
|
||||
|
||||
<nut-form-item label="说明">
|
||||
<nut-textarea v-model="form.content" autosize placeholder="请输入说明" type="text" />
|
||||
</nut-form-item>
|
||||
|
||||
<nut-form-item label="介绍">
|
||||
<nut-textarea v-model="form.details_content" autosize placeholder="请输入介绍" type="text" />
|
||||
</nut-form-item>
|
||||
|
||||
|
||||
<!-- <nut-form-item label="上架人">
|
||||
<nut-input v-model="form.add_person" class="nut-input-text" placeholder="请输入上架人" type="text" />
|
||||
</nut-form-item> -->
|
||||
<!-- <nut-form-item label="排序">
|
||||
<nut-input v-model="form.goods_sort" class="nut-input-text" placeholder="请输入排序" type="number" />
|
||||
</nut-form-item> -->
|
||||
|
||||
|
||||
|
||||
<nut-form-item label="状态">
|
||||
<nut-radio-group direction="horizontal" v-model="form.status">
|
||||
<nut-radio label="10">下架</nut-radio>
|
||||
<nut-radio label="20">上架</nut-radio>
|
||||
</nut-radio-group>
|
||||
</nut-form-item>
|
||||
|
||||
<nut-form-item>
|
||||
<template v-slot:label>成色</template>
|
||||
<template v-slot:default>
|
||||
<view style="color: black;" @click="show_degree_popup = true">
|
||||
<text>{{form.degree_name}}</text>
|
||||
</view>
|
||||
</template>
|
||||
</nut-form-item>
|
||||
|
||||
|
||||
<nut-form-item>
|
||||
<template v-slot:label>机型</template>
|
||||
<template v-slot:default>
|
||||
<view style="color: black;" @click="show_product_cascader = true">
|
||||
<text>{{form.type_name}},{{form.brand_name}},{{form.product_name}}</text>
|
||||
</view>
|
||||
</template>
|
||||
</nut-form-item>
|
||||
|
||||
<nut-form-item>
|
||||
<template v-slot:label>商品图片</template>
|
||||
<template v-slot:default>
|
||||
<shmily-drag-image v-model="form.images" :number=9 :add-image="addGoodsImg"
|
||||
keyName="file_path"></shmily-drag-image></template>
|
||||
</nut-form-item>
|
||||
|
||||
|
||||
<!-- <nut-form-item>
|
||||
<template v-slot:label>商品视频</template>
|
||||
<template v-slot:default>
|
||||
<nut-uploader :url="uploadVideoUrl" name="iFile" v-model:file-list="uploadVideoList"
|
||||
:source-type="['album','camera']" :media-type="['video']" maximum="1" :multiple="false"
|
||||
@success="onUploadSuccess" @fail="onUploadFail" @delete="onDeleteFile" :timeout="1000*60">
|
||||
</nut-uploader>
|
||||
</template>
|
||||
</nut-form-item> -->
|
||||
|
||||
|
||||
<view style="align-items: center;text-align: center; padding: 20rpx 60rpx;">
|
||||
<nut-button type="primary" block @click="onSubmit">
|
||||
新增商品
|
||||
</nut-button>
|
||||
</view>
|
||||
</nut-form>
|
||||
|
||||
</view>
|
||||
|
||||
<nut-popup v-model:visible="show_degree_popup" position="bottom" safe-area-inset-bottom>
|
||||
<nut-picker v-model="popup_degree_val" :columns="filter_params.degree_list"
|
||||
:field-names="{text:'degree_name',value:'degree_id'}" title="选择成色" @confirm="onConfirmDegree"
|
||||
@cancel="show_degree_popup = false">
|
||||
</nut-picker>
|
||||
</nut-popup>
|
||||
|
||||
<nut-cascader title="机型选择" v-model:visible="show_product_cascader" v-model="cascader_product_val"
|
||||
@change="onProductChange" @pathChange="onProcutPathChange" text-key="label" value-key="value"
|
||||
:title-ellipsis="false" children-key="children" :options="filter_params.drop_down_options"></nut-cascader>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {
|
||||
onMounted,
|
||||
reactive,
|
||||
ref,
|
||||
toValue
|
||||
} from 'vue';
|
||||
import {
|
||||
fetchFilterParmas,
|
||||
fetchGoodsAdd,
|
||||
} from '@/api/goods';
|
||||
import {
|
||||
getUploadImageUrl,
|
||||
} from '@/api/request';
|
||||
|
||||
|
||||
// import {
|
||||
// fetchControlAddGoods,
|
||||
// } from '@/api/control';
|
||||
|
||||
|
||||
// const uploadVideoUrl = ref('')
|
||||
// uploadVideoUrl.value = getUploadVideoUrl()
|
||||
// const uploadVideoOk = ref('https://qnxsd.19year.cn/wechat_2025-08-12_130250_716.png')
|
||||
// const uploadVideoList = ref([])
|
||||
// const videoUrl = ref('')
|
||||
|
||||
// const onUploadSuccess = (res) => {
|
||||
// uploadVideoList.value[0].url = uploadVideoOk
|
||||
// let respStr = res.data.data
|
||||
// let resp = JSON.parse(respStr)
|
||||
// if (resp.code === 1) {
|
||||
// form.video_url = resp.data.url
|
||||
// uni.showToast({
|
||||
// title: '上传成功',
|
||||
// icon: 'success'
|
||||
// })
|
||||
// } else {
|
||||
// uni.showToast({
|
||||
// title: '上传失败',
|
||||
// icon: 'none'
|
||||
// })
|
||||
// }
|
||||
// }
|
||||
|
||||
// const onDeleteFile = (files, fileList, index) => {
|
||||
// uploadVideoList.value = []
|
||||
// form.video_url = ""
|
||||
// console.log('uploadVideoList3', uploadVideoList)
|
||||
// console.log('form3', form)
|
||||
// }
|
||||
// const onUploadFail = (err) => {
|
||||
// console.error('上传失败:', err)
|
||||
// uni.showToast({
|
||||
// title: '上传失败',
|
||||
// icon: 'none'
|
||||
// })
|
||||
// }
|
||||
|
||||
|
||||
|
||||
// 扫码
|
||||
const onScan = () => {
|
||||
uni.scanCode({
|
||||
onlyFromCamera: true,
|
||||
success: (res) => {
|
||||
console.log(res);
|
||||
form.goods_no = res.result
|
||||
},
|
||||
fail: () => {
|
||||
uni.showToast({
|
||||
icon: 'none',
|
||||
title: '扫码失败'
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
|
||||
const filter_params = reactive({})
|
||||
|
||||
|
||||
|
||||
// const report_tags = reactive([])
|
||||
|
||||
// const all_report_tag_ids = ref([])
|
||||
|
||||
// 默认展开
|
||||
// const defaultExpandKeys = ref([0])
|
||||
|
||||
// 显示机型选择
|
||||
const show_product_cascader = ref(false)
|
||||
// 显示成色
|
||||
const show_degree_popup = ref(false)
|
||||
|
||||
// const show_disk_popup = ref(false)
|
||||
// 显示验机报告
|
||||
// const show_report_tags_popup = ref(false)
|
||||
|
||||
|
||||
const popup_degree_val = ref([])
|
||||
const cascader_product_val = ref([])
|
||||
|
||||
// const popup_disk_val = ref(["未选择"])
|
||||
|
||||
|
||||
|
||||
const form = reactive({
|
||||
// goods_id: 0,
|
||||
goods_name: '',
|
||||
goods_no: '',
|
||||
|
||||
|
||||
goods_price: '',
|
||||
goods_stock: '',
|
||||
content: '',
|
||||
details_content: '',
|
||||
status: '10',
|
||||
images: [],
|
||||
add_person: '',
|
||||
|
||||
// disk: '未选择',
|
||||
|
||||
degree_id: 0,
|
||||
degree_name: '未选择',
|
||||
type_id: 0,
|
||||
type_name: '未选择',
|
||||
brand_id: 0,
|
||||
brand_name: '未选择',
|
||||
product_id: 0,
|
||||
product_name: '未选择',
|
||||
|
||||
|
||||
|
||||
// video_url: ''
|
||||
|
||||
|
||||
// goods_no: '',
|
||||
|
||||
|
||||
// goods_status: '10',
|
||||
// goods_sort: 0,
|
||||
|
||||
|
||||
|
||||
|
||||
})
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
const onProductChange = (...args) => {
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
const onSubmit = () => {
|
||||
console.log('form====>', form);
|
||||
fetchGoodsAdd(form).then(res => {
|
||||
uni.showToast({
|
||||
icon: 'none',
|
||||
title: '新增商品成功'
|
||||
})
|
||||
// setTimeout(() => {
|
||||
// uni.switchTab({
|
||||
// url: '/pages/mine/index'
|
||||
// });
|
||||
// }, 500)
|
||||
|
||||
setTimeout(() => {
|
||||
// uni.switchTab({
|
||||
// url: '/pages/mine/index'
|
||||
// });
|
||||
uni.navigateBack({
|
||||
delta: 1 // 返回上一页
|
||||
});
|
||||
}, 500)
|
||||
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
|
||||
// 选择机型
|
||||
const onProcutPathChange = (args) => {
|
||||
console.log(args);
|
||||
form.type_id = 0
|
||||
form.type_name = ''
|
||||
form.brand_id = 0
|
||||
form.brand_name = ''
|
||||
form.product_id = 0
|
||||
form.product_name = ''
|
||||
if (args.length >= 1 && args[0] !== null) {
|
||||
form.type_id = args[0].value
|
||||
form.type_name = args[0].text
|
||||
}
|
||||
if (args.length >= 2 && args[1] !== null) {
|
||||
form.brand_id = args[1].value
|
||||
form.brand_name = args[1].text
|
||||
}
|
||||
if (args.length >= 3 && args[2] !== null) {
|
||||
form.product_id = args[2].value
|
||||
form.product_name = args[2].text
|
||||
}
|
||||
}
|
||||
// 选择成色
|
||||
const onConfirmDegree = () => {
|
||||
form.degree_id = popup_degree_val.value[0]
|
||||
filter_params.degree_list.forEach(item => {
|
||||
if (item.degree_id === form.degree_id) {
|
||||
form.degree_name = item.degree_name
|
||||
}
|
||||
})
|
||||
show_degree_popup.value = false
|
||||
}
|
||||
// const onConfirmDisk = () => {
|
||||
// form.disk = popup_disk_val.value[0]
|
||||
// console.log('form.disk', form.disk);
|
||||
// console.log('popup_disk_val.value', popup_disk_val.value);
|
||||
// // filter_params.disk_list.forEach(item => {
|
||||
// // if (item.value === form.disk) {
|
||||
// // form.disk = item.value
|
||||
// // }
|
||||
// // })
|
||||
// show_disk_popup.value = false
|
||||
// }
|
||||
|
||||
onMounted(() => {
|
||||
fetchFilterParmas(1).then(res => {
|
||||
Object.assign(filter_params, res)
|
||||
filter_params.degree_list.unshift({
|
||||
degree_id: 0,
|
||||
degree_name: '未选择'
|
||||
})
|
||||
console.log('filter_params', filter_params)
|
||||
// console.log('filter_params.disk_list', filter_params.disk_list)
|
||||
|
||||
|
||||
// filter_params.disk_list.unshift({
|
||||
// // id: 0,
|
||||
// value: '未选择'
|
||||
// })
|
||||
|
||||
|
||||
})
|
||||
})
|
||||
|
||||
// 上传商品图片
|
||||
const addGoodsImg = () => {
|
||||
uni.chooseImage({
|
||||
count: 9 - (form.image?.length || 0),
|
||||
sourceType: ['album', 'camera'],
|
||||
success: res => {
|
||||
res.tempFiles.forEach(file => {
|
||||
uni.uploadFile({
|
||||
url: getUploadImageUrl(),
|
||||
filePath: file.path,
|
||||
name: 'iFile',
|
||||
formData: {
|
||||
group_id: 1,
|
||||
},
|
||||
success: (res) => {
|
||||
let data = JSON.parse(res.data).data
|
||||
form.images.push({
|
||||
id: parseInt(data.file_id),
|
||||
file_path: data.file_path,
|
||||
})
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.page-content {
|
||||
min-height: 100vh;
|
||||
background-color: #f2f3f5;
|
||||
|
||||
}
|
||||
|
||||
|
||||
.list {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
background: #ffffff;
|
||||
align-items: center;
|
||||
max-height: 300rpx;
|
||||
overflow-y: scroll;
|
||||
padding: 10px;
|
||||
|
||||
.list-item {
|
||||
border-bottom: 1px solid #eee;
|
||||
padding: 20rpx 10rpx;
|
||||
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user