Commit d8abaf84 authored by yaya's avatar yaya

feat:钱币设置添加删除功能

parent 1da85189
...@@ -31,3 +31,11 @@ export function saveCroppingRecord(params) { ...@@ -31,3 +31,11 @@ export function saveCroppingRecord(params) {
data: params data: params
}) })
} }
export function deleteGood(params) {
return request({
url: '/item/delete',
method: 'post',
data: params
})
}
<template> <template>
<div ref="scrollRef" class="app-container"> <div ref="scrollRef" class="app-container">
<div ref="top" :class="{fixed: isFixed}" class="op-container" style="margin-bottom: 20px"> <div ref="top" :class="{fixed: isFixed}" class="op-container" style="margin-bottom: 20px">
<el-button round type="danger" @click="handleDelete">删除</el-button>
<el-button round @click="handleCancel">取消</el-button> <el-button round @click="handleCancel">取消</el-button>
<el-button type="primary" round @click="handlePublish">发布</el-button> <el-button type="primary" round @click="handlePublish">发布</el-button>
<el-button type="primary" style="margin-right: 20px" round @click="handleEdit">编辑</el-button> <el-button type="primary" style="margin-right: 20px" round @click="handleEdit">编辑</el-button>
<el-button-group> <el-button-group>
<el-button :disabled="previousDisabled" type="primary" icon="el-icon-arrow-left" @click="handlePrevious">上一个</el-button> <el-button :disabled="previousDisabled" type="primary" icon="el-icon-arrow-left" @click="handlePrevious">上一个
<el-button type="primary" @click="handleNext">下一个<i class="el-icon-arrow-right el-icon--right"/></el-button> </el-button>
<el-button type="primary" @click="handleNext">下一个<i class="el-icon-arrow-right el-icon--right" /></el-button>
</el-button-group> </el-button-group>
</div> </div>
<el-card class="detail-card"> <el-card class="detail-card">
<div class="detail"> <div class="detail">
<div class="desc" > <div class="desc">
<div class="detail_title" style="min-width: 80px; text-align: end">钱币名称:</div> <div class="detail_title" style="min-width: 80px; text-align: end">钱币名称:</div>
<div class="detail_title">{{ goodsParams.name }}</div> <div class="detail_title">{{ goodsParams.name }}</div>
</div> </div>
...@@ -25,7 +27,7 @@ ...@@ -25,7 +27,7 @@
<div class="detail_image"> <div class="detail_image">
<div class="detail_title">{{ `钱币图片:` }}</div> <div class="detail_title">{{ `钱币图片:` }}</div>
<div class="list"> <div class="list">
<div v-for="(item, index) in imageList" :key="item + index" class="select_item" > <div v-for="(item, index) in imageList" :key="item + index" class="select_item">
<img :src="item" class="gallery" @click="handleShowLargeDialog(item)"> <img :src="item" class="gallery" @click="handleShowLargeDialog(item)">
<div class="edit" @click="handlerChangeImage(item)">编辑</div> <div class="edit" @click="handlerChangeImage(item)">编辑</div>
</div> </div>
...@@ -83,7 +85,7 @@ ...@@ -83,7 +85,7 @@
v-if="compositeImageSrc" v-if="compositeImageSrc"
:href="compositeImageSrc" :href="compositeImageSrc"
:style="{'background-image': `url(${compositeImageSrc})`}" :style="{'background-image': `url(${compositeImageSrc})`}"
class="image"/> class="image" />
</div> </div>
</div> </div>
...@@ -102,16 +104,31 @@ ...@@ -102,16 +104,31 @@
:style="{ 'width':'300px' }" :style="{ 'width':'300px' }"
expand-trigger="hover" expand-trigger="hover"
placeholder="请选择钱币分类" placeholder="请选择钱币分类"
@change="handleCategoryChange"/> @change="handleCategoryChange" />
</el-form-item> </el-form-item>
<el-form-item label="直径(mm):" prop="name"> <el-form-item label="直径(mm):" prop="name">
<el-input v-model="goodsParams.diameter" :style="{ 'width':'300px' }" placeholder="请输入直径(mm)" type="number" @input="limitInput($event, 1)"/> <el-input
v-model="goodsParams.diameter"
:style="{ 'width':'300px' }"
placeholder="请输入直径(mm)"
type="number"
@input="limitInput($event, 1)" />
</el-form-item> </el-form-item>
<el-form-item label="厚度(mm):" prop="name"> <el-form-item label="厚度(mm):" prop="name">
<el-input v-model="goodsParams.thickness" :style="{ 'width':'300px' }" placeholder="请输入厚度(mm)" type="number" @input="limitInput($event, 2)"/> <el-input
v-model="goodsParams.thickness"
:style="{ 'width':'300px' }"
placeholder="请输入厚度(mm)"
type="number"
@input="limitInput($event, 2)" />
</el-form-item> </el-form-item>
<el-form-item label="质量(g):" prop="name"> <el-form-item label="质量(g):" prop="name">
<el-input v-model="goodsParams.weight" :style="{ 'width':'300px' }" placeholder="请输入质量(g)" type="number" @input="limitInput($event, 3)"/> <el-input
v-model="goodsParams.weight"
:style="{ 'width':'300px' }"
placeholder="请输入质量(g)"
type="number"
@input="limitInput($event, 3)" />
</el-form-item> </el-form-item>
<el-form-item label="是否作为标准货币:" prop="isOnSale"> <el-form-item label="是否作为标准货币:" prop="isOnSale">
<el-radio-group v-model="goodsParams.isStd"> <el-radio-group v-model="goodsParams.isStd">
...@@ -125,7 +142,7 @@ ...@@ -125,7 +142,7 @@
:rows="5" :rows="5"
maxlength="50" maxlength="50"
type="textarea" type="textarea"
placeholder="请输入备注(最多50个字)"/> placeholder="请输入备注(最多50个字)" />
</el-form-item> </el-form-item>
</el-form> </el-form>
</div> </div>
...@@ -150,14 +167,14 @@ ...@@ -150,14 +167,14 @@
:show-cut-dialog="cutImageDialogVisible" :show-cut-dialog="cutImageDialogVisible"
@cutImageDialogClose="cutImageDialogVisible = false" @cutImageDialogClose="cutImageDialogVisible = false"
@cutSuccess="handleCutSuccess" @cutSuccess="handleCutSuccess"
@uploadImage="handleUploadImage"/> @uploadImage="handleUploadImage" />
<CutEditImageDialog <CutEditImageDialog
v-if="cutEditImageDialogVisible" v-if="cutEditImageDialogVisible"
:edit-image-url="editImageUrl" :edit-image-url="editImageUrl"
:show-cut-dialog="cutImageDialogVisible" :show-cut-dialog="cutImageDialogVisible"
@cutEditImageDialogClose="cutEditImageDialogVisible = false" @cutEditImageDialogClose="cutEditImageDialogVisible = false"
@cutEditSuccess="handleSaveImageBase64" @cutEditSuccess="handleSaveImageBase64"
@uploadEditImage="handleUploadImage"/> @uploadEditImage="handleUploadImage" />
</div> </div>
</template> </template>
...@@ -167,14 +184,22 @@ import { VuePictureCut, VuePictureCutMask, VuePictureCutMenu } from 'vue-picture ...@@ -167,14 +184,22 @@ import { VuePictureCut, VuePictureCutMask, VuePictureCutMenu } from 'vue-picture
import { getToken } from '@/utils/auth' import { getToken } from '@/utils/auth'
import SelectImageDialog from './components/selectImageDialog' import SelectImageDialog from './components/selectImageDialog'
import { listCategories } from '@/api/business/goods' import { listCategories } from '@/api/business/goods'
import { detailGoods, editGoods, saveImageBase64, saveCroppingRecord } from '@/api/business/goodsNew' import { detailGoods, editGoods, saveImageBase64, saveCroppingRecord, deleteGood } from '@/api/business/goodsNew'
import CheckLargeImageDialog from './components/CheckLargeImageDialog' import CheckLargeImageDialog from './components/CheckLargeImageDialog'
import CutImageDialog from './components/CutImageDialog' import CutImageDialog from './components/CutImageDialog'
import CutEditImageDialog from './components/CutEditImageDialog' import CutEditImageDialog from './components/CutEditImageDialog'
export default { export default {
name: 'InfoSet', name: 'InfoSet',
components: { CutEditImageDialog, CutImageDialog, CheckLargeImageDialog, SelectImageDialog, VuePictureCut, VuePictureCutMask, VuePictureCutMenu }, components: {
CutEditImageDialog,
CutImageDialog,
CheckLargeImageDialog,
SelectImageDialog,
VuePictureCut,
VuePictureCutMask,
VuePictureCutMenu
},
filters: { filters: {
trimHtml(html_str) { trimHtml(html_str) {
var text = html_str && html_str.replace(/<[^<>]+>/g, '') || '' var text = html_str && html_str.replace(/<[^<>]+>/g, '') || ''
...@@ -320,6 +345,35 @@ export default { ...@@ -320,6 +345,35 @@ export default {
this.compositeImageSrc = '' this.compositeImageSrc = ''
this.categoryIds = [] this.categoryIds = []
}, },
// 删除
handleDelete() {
this.$confirm('删除后不可恢复!', '是否要删除该藏品?', {
confirmButtonText: '删除',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
const params = {
id: this.goodsParams.id
}
deleteGood(params).then(response => {
this.$message.success('删除成功')
console.log('===原来=list ===', this.goodIdList)
this.goodIdList = this.goodIdList.filter((item) => {
if (item !== this.goodsParams.id) {
return item
}
})
this.currentIndex -= 1
this.handleNext()
console.log('===现在=list ===', this.goodIdList)
}).catch(response => {
this.$notify.error({
title: '失败',
message: response.data.errmsg || '请求失败'
})
})
})
},
// 取消,回到钱币列表页 // 取消,回到钱币列表页
handleCancel() { handleCancel() {
this.$router.push({ path: '/goods/list' }) this.$router.push({ path: '/goods/list' })
...@@ -534,6 +588,7 @@ export default { ...@@ -534,6 +588,7 @@ export default {
.op-container { .op-container {
text-align: right; text-align: right;
} }
.fixed { .fixed {
position: fixed; position: fixed;
top: 20px; top: 20px;
...@@ -552,6 +607,7 @@ export default { ...@@ -552,6 +607,7 @@ export default {
flex-direction: row; flex-direction: row;
align-content: start; align-content: start;
margin-top: 15px; margin-top: 15px;
.detail_desc-content { .detail_desc-content {
font-weight: normal; font-weight: normal;
font-size: 16px; font-size: 16px;
...@@ -560,9 +616,11 @@ export default { ...@@ -560,9 +616,11 @@ export default {
} }
} }
.detail_desc-html { .detail_desc-html {
width: auto; width: auto;
} }
.detail_title { .detail_title {
font-weight: bold; font-weight: bold;
...@@ -572,16 +630,20 @@ export default { ...@@ -572,16 +630,20 @@ export default {
font-weight: normal; font-weight: normal;
font-size: 16px; font-size: 16px;
} }
.detail_image { .detail_image {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
.detail_title { .detail_title {
width: 100px; width: 100px;
font-weight: normal; font-weight: normal;
margin-top: 15px; margin-top: 15px;
} }
.list { .list {
margin-top: 10px; margin-top: 10px;
.select_item { .select_item {
width: 100px; width: 100px;
height: 100px; height: 100px;
...@@ -595,6 +657,7 @@ export default { ...@@ -595,6 +657,7 @@ export default {
height: 100px; height: 100px;
object-fit: contain; object-fit: contain;
} }
.edit { .edit {
position: absolute; position: absolute;
top: 0; top: 0;
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment