|
|
@@ -0,0 +1,268 @@
|
|
|
+<template>
|
|
|
+ <view class="app-content">
|
|
|
+ <form @submit="formSubmit">
|
|
|
+ <div class="module-com input-line-wrap">
|
|
|
+
|
|
|
+ <tui-list-cell class="line-cell" :hover="false">
|
|
|
+ <div class="tui-title">名称</div>
|
|
|
+ <input v-model="form.name" placeholder-class="phcolor" class="tui-input" name="name" placeholder="产品名称" maxlength="50" type="text" />
|
|
|
+ </tui-list-cell>
|
|
|
+
|
|
|
+ <tui-list-cell class="line-cell" :hover="false">
|
|
|
+ <div class="tui-title">初始名称</div>
|
|
|
+ <view style="color:#CCCCCC;width:450upx;height:45upx;" @click.stop="notModify">
|
|
|
+ {{form.name}}
|
|
|
+ </view>
|
|
|
+ </tui-list-cell>
|
|
|
+
|
|
|
+ <tui-list-cell class="line-cell" :hover="false" :arrow="true">
|
|
|
+ <div class="tui-title">分类</div>
|
|
|
+ <input v-model="form.classId" name="classId" type="text" hidden />
|
|
|
+ <view style="color:#CCCCCC;width:450upx;height:45upx;" @click.stop="changeClass()" v-if="form.classId == 0">
|
|
|
+ 请选择分类
|
|
|
+ </view>
|
|
|
+ <view @click.stop="changeClass()" style="width:450upx;height:45upx;" v-else>
|
|
|
+ {{form.className}}
|
|
|
+ </view>
|
|
|
+ </tui-list-cell>
|
|
|
+
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="module-com input-line-wrap goods-wrap">
|
|
|
+ <div class="module-tit">
|
|
|
+ <span>产品图片</span>
|
|
|
+ <span class="app-color-3"></span>
|
|
|
+ </div>
|
|
|
+ <view class="module-det">
|
|
|
+ <htz-image-upload :max="1" :compress="true" v-model="currentImgData" :headers="headers"
|
|
|
+ @uploadSuccess="imgUploadSuccess" @imgDelete="imgDeleteFn" :action="getLoginInfo.imgUploadApi">
|
|
|
+ </htz-image-upload>
|
|
|
+ </view>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <view class="module-com input-line-wrap">
|
|
|
+ <tui-list-cell class="line-cell" :hover="false">
|
|
|
+ <view class="tui-title">顺序值</view>
|
|
|
+ <input v-model="form.inTurn" placeholder-class="phcolor" class="tui-input" name="inTurn" @focus="form.inTurn=''" placeholder="请填写数字" type="number" />
|
|
|
+ </tui-list-cell>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="app-footer">
|
|
|
+ <button class="admin-button-com big default" @click="goBack()">取消</button>
|
|
|
+ <button v-if="option.ptItemId" class="admin-button-com big blue" formType="submit" @click="status = 1">添加</button>
|
|
|
+ <button v-else class="admin-button-com big blue" formType="submit" @click="status = 1">确认</button>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ </form>
|
|
|
+
|
|
|
+ <uni-popup ref="classRef" background-color="#fff" type="center" :animation="false" class="class-popup-style">
|
|
|
+ <view style="margin-left:30upx;margin-top:15upx;font-size:26upx;font-weight:bold;">请选择分类：</view>
|
|
|
+ <view style="display:flex;padding:20upx;height:auto;justify-content: space-between;align-items:center;flex-wrap:wrap;max-height:100vh;overflow:auto;">
|
|
|
+ <view v-for="(item, index) in cpClassList" :key="index" @tap.stop="setThisClass(item)" style="margin-bottom:20upx;margin-left:3upx;">
|
|
|
+ <image :src="item.cover" style="width:120upx;height:120upx;border-radius:10upx;"></image>
|
|
|
+ <view style="margin-top:5upx;overflow: hidden;white-space: nowrap;width:120upx;text-align:center;">{{item.name}}</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </uni-popup>
|
|
|
+
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+<script>
|
|
|
+ import TuiListCell from "@/components/plugin/list-cell";
|
|
|
+ const form = require("@/utils/formValidation.js");
|
|
|
+ import { getAllItemClass } from "@/api/item-class";
|
|
|
+ import { getAllUnit } from "@/api/unit";
|
|
|
+ import { getAllCpClass,addCpFn,updateCpFn,getCpDetail } from "@/api/cp"
|
|
|
+ import { addProduct,updateProduct,getProductDetail } from "@/api/product";
|
|
|
+ import { getPtItemDetail } from "@/api/pt-item";
|
|
|
+ import { mapGetters } from "vuex"
|
|
|
+ //图片上传插件来源：https://ext.dcloud.net.cn/plugin?id=2922 已改造，不能再升级 shish 20211228
|
|
|
+ import htzImageUpload from '@/components/htz-image-upload/htz-image-upload.vue'
|
|
|
+ export default {
|
|
|
+ name: "addCp",
|
|
|
+ components: {
|
|
|
+ TuiListCell,
|
|
|
+ htzImageUpload
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ status: 1,
|
|
|
+ pcClassList:[],
|
|
|
+ currentImgData: [],
|
|
|
+ cpClassList:[],
|
|
|
+ form: {
|
|
|
+ id:0,
|
|
|
+ name:"",
|
|
|
+ classId:0,
|
|
|
+ className:'',
|
|
|
+ cover:[],
|
|
|
+ inTurn:100
|
|
|
+ },
|
|
|
+ itemClassSelectedData:{},
|
|
|
+ itemClassData:[],
|
|
|
+ unitData:[],
|
|
|
+ smallUnitSelectedData:{},
|
|
|
+ bigUnitSelectedData:{},
|
|
|
+ hasRequest:0,
|
|
|
+ cpData:{id:0},
|
|
|
+ headers:{token:''}
|
|
|
+ };
|
|
|
+ },
|
|
|
+ computed:{
|
|
|
+ ...mapGetters(["getLoginInfo","getDictionariesInfo"])
|
|
|
+ },
|
|
|
+ onLoad(option) {
|
|
|
+ if(option.id){
|
|
|
+ this.form.id = this.option.id
|
|
|
+ }
|
|
|
+ const token = uni.getStorageSync('token')
|
|
|
+ this.headers.token = token
|
|
|
+ },
|
|
|
+ watch:{
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ changeClass(item){
|
|
|
+ this.$refs.classRef.open('center')
|
|
|
+ },
|
|
|
+ setThisClass(info){
|
|
|
+ this.$refs.classRef.close()
|
|
|
+ this.form.classId = info.id ? info.id : 0
|
|
|
+ this.form.className = info.name ? info.name : ''
|
|
|
+ this.$forceUpdate()
|
|
|
+ },
|
|
|
+ notModify(){
|
|
|
+ this.$msg('不可修改')
|
|
|
+ },
|
|
|
+ goStockDetail(item){
|
|
|
+ this.$util.pageTo({url: "/pagesStorehouse/stockWarn/detailed?id="+item.id+'&name='+item.name})
|
|
|
+ },
|
|
|
+ goBack(){
|
|
|
+ uni.navigateBack({ delta: 1 })
|
|
|
+ },
|
|
|
+ getDetail() {
|
|
|
+ return getCpDetail({ id: this.option.id }).then(res => {
|
|
|
+ if (this.$util.isEmpty(res.data)) {
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ Object.keys(this.form).forEach((i, index) => {
|
|
|
+ this.form[i] = res.data[i];
|
|
|
+ });
|
|
|
+ this.currentImgData.push(res.data.cover)
|
|
|
+ this.form.cover = [res.data.shortCover]
|
|
|
+ this.cpData = res.data
|
|
|
+ });
|
|
|
+ },
|
|
|
+ imgUploadSuccess(res) {
|
|
|
+ var _res = JSON.parse(res.data)
|
|
|
+ if(_res.code == 1){
|
|
|
+ this.currentImgData.push(_res.data.smallUrl)
|
|
|
+ this.form.cover.push(_res.data.shortUrl)
|
|
|
+ }
|
|
|
+ },
|
|
|
+ imgDeleteFn(res){
|
|
|
+ const index = res.index
|
|
|
+ this.form.cover.splice(index,1)
|
|
|
+ },
|
|
|
+ init() {
|
|
|
+ let that = this
|
|
|
+ if(this.hasRequest == 1){
|
|
|
+ return
|
|
|
+ }
|
|
|
+ this.getDetail();
|
|
|
+ this.hasRequest = 1
|
|
|
+ getAllCpClass().then(res => {
|
|
|
+ that.cpClassList = res.data.list ? res.data.list : []
|
|
|
+ })
|
|
|
+ },
|
|
|
+ confirmFn() {
|
|
|
+ if (this.$util.isEmpty(this.form.cover)) {
|
|
|
+ this.$msg("请上传图片")
|
|
|
+ return false
|
|
|
+ }
|
|
|
+ let requestHost = addCpFn
|
|
|
+ if(this.form.id && this.form.id != 0){
|
|
|
+ requestHost = updateCpFn;
|
|
|
+ }else{
|
|
|
+
|
|
|
+ }
|
|
|
+ let form = JSON.parse(JSON.stringify(this.form))
|
|
|
+ uni.showLoading({mask:true})
|
|
|
+ requestHost({...form,cover:this.form.cover[0]}).then(res => {
|
|
|
+ uni.hideLoading()
|
|
|
+ if(res.code == 1){
|
|
|
+ this.$msg(res.msg)
|
|
|
+ uni.navigateBack({})
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ formSubmit(e) {
|
|
|
+ let rules = [
|
|
|
+ {
|
|
|
+ name: "name",
|
|
|
+ rule: ["required"],
|
|
|
+ msg: ["请填写名称"]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "classId",
|
|
|
+ rule: ["required"],
|
|
|
+ msg: ["请选择分类"]
|
|
|
+ }
|
|
|
+ ];
|
|
|
+ let formData = e.detail.value;
|
|
|
+ let checkRes = form.validation(formData, rules);
|
|
|
+ if (!checkRes) {
|
|
|
+ this.confirmFn()
|
|
|
+ } else {
|
|
|
+ this.$msg(checkRes);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ };
|
|
|
+ </script>
|
|
|
+ <style lang="scss" scoped>
|
|
|
+ .app-content {
|
|
|
+ min-height: calc(100vh - 100upx);
|
|
|
+ padding-bottom: 150upx;
|
|
|
+ }
|
|
|
+ .module-com {
|
|
|
+ margin-bottom: 20upx;
|
|
|
+ background-color: #fff;
|
|
|
+ color: $fontColor2;
|
|
|
+ .module-tit {
|
|
|
+ padding: 20upx 30upx;
|
|
|
+ font-size: 28upx;
|
|
|
+ }
|
|
|
+ .module-det {
|
|
|
+ padding: 0 30upx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .category-wrap {
|
|
|
+ align-items: flex-start;
|
|
|
+ padding-bottom: 0 !important;
|
|
|
+ .tui-input {
|
|
|
+ @include disFlex(center, flex-start);
|
|
|
+ flex-wrap: wrap;
|
|
|
+ .admin-button-com {
|
|
|
+ margin-right: 20upx;
|
|
|
+ margin-bottom: 20upx;
|
|
|
+ position: relative;
|
|
|
+ z-index: 9999;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .summary-wrap {
|
|
|
+ .goods-summary {
|
|
|
+ height: 400upx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .app-footer {
|
|
|
+ justify-content: space-evenly;
|
|
|
+ z-index: 95;
|
|
|
+ .admin-button-com {
|
|
|
+ width: 46%;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .class-popup-style{
|
|
|
+ z-index:9999;
|
|
|
+ }
|
|
|
+ </style>
|
