1

app/admin/view/shop_purchase/edit.html

@@ -0,0 +1,162 @@
+{extend name="../../admin/view/main"}
+{block name='content'}
+<style>
+    .layui-card-body{
+        background: white;
+    }
+    #newForm{
+        width: 80%;
+    }
+    .image{
+        width: 100px;
+        height: 100px;
+    }
+    .video{
+        width: 200px;
+        height: 200px;
+    }
+    .child-form{
+        width: 500px;
+        background: #f4f4f4;
+        padding: 10px;
+        display: inline-block;
+    }
+</style>
+<div id="newForm">
+    <el-form :model="form" label-width="140px" ref="form" size="medium">
+        <el-form-item label="联系人" prop="real_name" :rules="{message:'此项必须',required:true}">
+            <el-input v-model="form.real_name"></el-input>
+        </el-form-item>
+        <el-form-item label="联系电话" prop="mobile" :rules="{message:'此项必须',required:true}">
+            <el-input v-model="form.mobile"></el-input>
+        </el-form-item>
+
+        <el-form-item label="商品信息：" prop="item" :rules="[{message:'此项必须',required:true},{type:'array',min:1,message:'需要商品信息'}]">
+            <div><el-button @click="addItem">添加</el-button></div>
+            <div v-for="(item,idx) in form.item" class="child-form">
+                <i class="el-icon-delete" @click="deleteItem(idx)"></i>
+                <el-form-item label="商品名称">
+                    <el-input v-model="item.name"></el-input>
+                </el-form-item>
+                <el-form-item label="规格">
+                    <el-input v-model="item.spec"></el-input>
+                </el-form-item>
+                <el-form-item label="数量">
+                    <el-input v-model="item.number"></el-input>
+                </el-form-item>
+                <el-form-item label="质量标准">
+                    <el-input v-model="item.standard"></el-input>
+                </el-form-item>
+                <el-form-item label="采购价">
+                    <el-input v-model="item.price"></el-input>
+                </el-form-item>
+            </div>
+        </el-form-item>
+
+        <el-form-item label="图片视频" prop="files">
+            <el-button @click="addFile('image')">增加图片/视频</el-button>
+            <div>
+                <div v-for="(item,idx) in form.images" :key="idx" style="display: inline-block;">
+                    <el-image v-if="item.type==='image'" :src="item.src" class="video"></el-image>
+                    <video controls v-else :src="item.src" class="video"></video>
+                    <a @click="form.images.splice(idx,1)">删除</a>
+                </div>
+            </div>
+        </el-form-item>
+        <el-form-item label="交货地址" :rules="{message:'此项必须',required:true}" prop="post_address">
+            <el-input v-model="form.post_address"></el-input>
+        </el-form-item>
+        <el-form-item label="交货时间" :rules="{message:'此项必须',required:true}" prop="post_time">
+            <el-date-picker type="datetime" v-model="form.post_time" value-format="yyyy-MM-dd HH:mm:ss"></el-date-picker>
+        </el-form-item>
+        <el-form-item>
+            <el-button type="primary" @click="save" :loading="saving">保存</el-button>
+            <el-button @click="history.back()">取消</el-button>
+        </el-form-item>
+    </el-form>
+    <div style="display: none;">
+        <button data-type="zip" data-file id="fileUpload"></button>
+    </div>
+</div>
+<script>
+    let editorContent;
+    let vo={:json_encode($row?:null,256)};
+    let audit=vo.audit
+    if(audit===1){
+        vo.audit=2
+    }
+    require(['ckeditor'], function () {
+
+    });
+    vo.item=vo.items
+
+    new Vue({
+        el:'#newForm',
+        data:()=>({
+            form:vo||{
+                real_name:null,
+                mobile:null,
+                item:[],
+                images:[],
+            },
+            saving:false,
+        }),
+        methods:{
+            addItem(){
+                this.form.item.push({
+                    name:null,
+                    spec:null,
+                    number:null,
+                    standard:null,
+                    price:null,
+                })
+            },
+            deleteItem (key) {
+                this.form.item.splice(key, 1)
+            },
+            addFile(){
+                $('#fileUpload').unbind('upload.done')
+                $('#fileUpload').on('upload.done',  (e,obj) => {
+                    let type=obj.file.type.split('/')[0]
+                    if(['image','video'].indexOf(type)===-1){
+                        this.$message.error('请上传正确的格式')
+                        return
+                    }
+                    this.form.images.push({
+                        type:type,
+                        src:obj.data.url
+                    })
+                });
+                $('#fileUpload').trigger('click')
+            },
+            save(){
+                let _this=this,
+                    form=this.form
+                this.$refs.form.validate(v=>{
+                    if(!v){
+                        return
+                    }
+                    $.ajax('{:sysuri()}',{
+                        data:form,
+                        type:'post',
+                        beforeSend(){
+                            _this.saving=true
+                        },
+                        success({code,info}){
+                            if(code){
+                                _this.$message.success('保存成功')
+                                window.history.back()
+                            }else{
+                                _this.$message.error(info)
+                            }
+                        },
+                        complete(){
+                            _this.saving=false
+                        }
+                    })
+                })
+            }
+        }
+    })
+</script>
+{/block}