123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812 |
- <!DOCTYPE html>
- <html>
- <head>
- <meta charset="utf-8">
- <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
- <link href="{__FRAME_PATH}css/font-awesome.min.css" rel="stylesheet">
- <link href="{__ADMIN_PATH}plug/umeditor/themes/default/css/umeditor.css" type="text/css" rel="stylesheet">
- <script type="text/javascript" src="{__ADMIN_PATH}plug/umeditor/third-party/jquery.min.js"></script>
- <script type="text/javascript" src="{__ADMIN_PATH}plug/umeditor/third-party/template.min.js"></script>
- <script type="text/javascript" charset="utf-8" src="{__ADMIN_PATH}plug/umeditor/umeditor.config.js"></script>
- <script type="text/javascript" charset="utf-8" src="{__ADMIN_PATH}plug/umeditor/umeditor.min.js"></script>
- <script type="text/javascript" src="{__ADMIN_PATH}plug/umeditor/lang/zh-cn/zh-cn.js"></script>
- <link rel="stylesheet" href="/static/plug/layui/css/layui.css">
- <script src="/static/plug/layui/layui.js"></script>
- <script src="{__PLUG_PATH}vue/dist/vue.min.js"></script>
- <script src="/static/plug/axios.min.js"></script>
- <script src="{__MODULE_PATH}widget/aliyun-oss-sdk-4.4.4.min.js"></script>
- <script src="{__MODULE_PATH}widget/cos-js-sdk-v5.min.js"></script>
- <script src="{__MODULE_PATH}widget/qiniu-js-sdk-2.5.5.js"></script>
- <script src="{__MODULE_PATH}widget/plupload.full.min.js"></script>
- <script src="{__MODULE_PATH}widget/videoUpload.js"></script>
- <style>
- .layui-form-item {
- margin-bottom: 0px;
- }
- .pictrueBox {
- display: inline-block !important;
- }
- .pictrue {
- width: 60px;
- height: 60px;
- border: 1px dotted rgba(0, 0, 0, 0.1);
- margin-right: 15px;
- display: inline-block;
- position: relative;
- cursor: pointer;
- }
- .pictrue img {
- width: 100%;
- height: 100%;
- }
- .upLoad {
- width: 58px;
- height: 58px;
- line-height: 58px;
- border: 1px dotted rgba(0, 0, 0, 0.1);
- border-radius: 4px;
- background: rgba(0, 0, 0, 0.02);
- cursor: pointer;
- display: flex;
- justify-content: center;
- align-items: center;
- }
- .rulesBox {
- display: flex;
- flex-wrap: wrap;
- margin-left: 10px;
- }
- .layui-tab-content {
- margin-top: 15px;
- }
- .ml110 {
- margin: 18px 0 4px 110px;
- }
- .rules {
- display: flex;
- }
- .rules-btn-sm {
- height: 30px;
- line-height: 30px;
- font-size: 12px;
- width: 109px;
- }
- .rules-btn-sm input {
- width: 79% !important;
- height: 84% !important;
- padding: 0 10px;
- }
- .ml10 {
- margin-left: 10px !important;
- }
- .ml40 {
- margin-left: 40px !important;
- }
- .closes {
- position: absolute;
- left: 86%;
- top: -18%;
- }
- .red {
- color: red;
- }
- .layui-input-block .layui-video-box{
- width: 22%;
- height: 180px;
- border-radius: 10px;
- background-color:
- margin-top: 10px;
- position: relative;
- overflow: hidden;
- }
- .layui-input-block .layui-video-box i{
- color:
- line-height: 180px;
- margin: 0 auto;
- width: 50px;
- height: 50px;
- display: inherit;
- font-size: 50px;
- }
- .layui-input-block .layui-video-box .mark{
- position: absolute;
- width: 100%;
- height: 30px;
- top: 0;
- background-color: rgba(0,0,0,.5);
- text-align: center;
- }
- .store_box{
- display: flex;
- }
- .info{
- color:
- padding-left: 10px;
- line-height: 30px;
- }
- </style>
- </head>
- <body>
- <div class="layui-fluid">
- <div class="layui-row layui-col-space15" id="app" v-cloak="">
- <div class="layui-card">
- <div class="layui-card-header">
- <span class="">竞拍添加</span>
- <button style="margin-left: 20px" type="button" class="layui-btn layui-btn-primary layui-btn-xs" @click="goBack">返回列表</button>
- </div>
- <div class="layui-card-body">
- <form class="layui-form" action="" v-cloak="">
- <div class="layui-tab layui-tab-brief" lay-filter="docTabBrief">
- <div class="layui-tab-content">
- <div class="layui-tab-item layui-show">
- <div class="layui-row layui-col-space15">
- <div class="layui-col-xs12 layui-col-sm12 layui-col-md12">
- <div class="grid-demo grid-demo-bg1">
- <div class="layui-form-item">
- <label class="layui-form-label">会官名称<i class="red">*</i></label>
- <div class="layui-input-block">
- <input type="text" name="name" lay-verify="title" autocomplete="off"
- placeholder="场馆名称" class="layui-input" v-model="formData.name" maxlength="100">
- </div>
- </div>
- </div>
- </div>
- <div class="layui-col-xs12 layui-col-sm12 layui-col-md12">
- <div class="grid-demo grid-demo-bg1">
- <div class="layui-form-item">
- <label class="layui-form-label">会馆封面图<i class="red">*</i></label>
- <div class="pictrueBox">
- <div class="pictrue" v-if="formData.image" @click="uploadImage('image')">
- <img :src="formData.image"></div>
- <div class="upLoad" @click="uploadImage('image')" v-else>
- <i class="layui-icon layui-icon-camera" class="iconfont"
- style="font-size: 26px;"></i>
- </div>
- </div>
- </div>
- </div>
- </div>
- {if $admin['roles'] == 1}
- <div class="layui-col-xs12 layui-col-sm12 layui-col-md12">
- <div class="grid-demo grid-demo-bg1">
- <div class="layui-form-item">
- <label class="layui-form-label">绑定用户</label>
- <div class="layui-input-inline">
- <select id="uid" name="uid" lay-verify="title" v-model="formData.uid">
- {foreach $user as $key=>$vo }
- <option value="{$vo.uid}">{$vo.nickname}<option>
- {/foreach}
- </select>
- </div>
- </div>
- </div>
- </div>
- {/if}
- <div class="layui-col-xs12 layui-col-sm12 layui-col-md12">
- <div class="grid-demo grid-demo-bg1">
- <div class="layui-form-item layui-form-text">
- <label class="layui-form-label">会馆简介</label>
- <div class="layui-input-block">
- <textarea name="info" v-model="formData.info"
- placeholder="请输入商品简介" class="layui-textarea"></textarea>
- </div>
- </div>
- </div>
- </div>
- <div class="layui-tab-item">
- <div class="layui-row layui-col-space15">
- <textarea type="text/plain" name="description" id="myEditor" style="width:100%;">{{formData.description}}</textarea>
- </div>
- </div>
- <div class="layui-col-xs12 layui-col-sm12 layui-col-md12">
- <div class="grid-demo grid-demo-bg1">
- <div class="layui-form-item">
- <label class="layui-form-label">排序<i class="red">*</i></label>
- <div class="layui-input-inline">
- <input type="number" name="sort" lay-verify="title" autocomplete="off" class="layui-input" v-model="formData.sort" maxlength="100" value="0">
- </div>
- </div>
- </div>
- </div>
- </div>
- </div>
- <div class="layui-tab-content">
- <div class="layui-row layui-col-space15">
- <div class="layui-col-xs12 layui-col-sm12 layui-col-md12">
- <button class="layui-btn layui-btn-normal layui-btn-sm" id="submit" type="button" @click="handleSubmit()">提交</button>
- </div>
- </div>
- </div>
- </div>
- </form>
- </div>
- </div>
- </div>
- </div>
- <script>
- var id = {$id};
-
- layui.use('form', function(){
- var form = layui.form;
-
- form.on('submit(formDemo)', function(data){
- layer.msg(JSON.stringify(data.field));
- return false;
- });
- });
- new Vue({
- el: '#app',
- data: {
- id:id,
-
- cateList: [],
-
- tempList: [],
- upload:{
- videoIng:false
- },
- formData: {
- name: '',
- image:'',
- sort:'',
- description: '',
- info: '',
- uid:''
- },
- rule: {
- slider_image: {
- maxLength: 1
- }
- },
- attr: [],
- newRule: false,
- radioRule: ['status'],
- ruleList:[],
- ruleIndex:-1,
- progress: 0,
- um: null,
- form: null,
- layTabId: 1,
- ruleBool: id ? true : false,
- },
- watch:{
- 'formData.is_sub':function (n) {
- if (n == 1) {
- this.formHeader.push({title:'一级返佣(元)'});
- this.formHeader.push({title:'二级级返佣(元)'});
- } else {
- this.formHeader.pop();
- this.formHeader.pop();
- }
- },
- 'formData.spec_type':function (n) {
- if (n) {
- this.render();
- }
- },
-
-
-
-
-
-
-
-
- },
- methods: {
- back:function(){
- var that = this;
- layui.use(['element'], function () {
- layui.element.tabChange('docTabBrief', that.layTabId == 1 ? 1 : parseInt(that.layTabId) - 1);
- });
- },
- next:function(){
- var that = this;
- layui.use(['element'], function () {
- layui.element.tabChange('docTabBrief', that.layTabId == 3 ? 3 : parseInt(that.layTabId) + 1);
- });
- },
- goBack:function(){
- location.href = this.U({c:'auction.auction_gu',a:'index'});
- },
- U: function (opt) {
- var m = opt.m || 'admin', c = opt.c || window.controlle || '', a = opt.a || 'index', q = opt.q || '',
- p = opt.p || {};
- var params = Object. keys(p).map(function (key) {
- return key + '/' + p[key];
- }).join('/');
- var gets = Object.keys(q).map(function (key) {
- return key+'='+ q[key];
- }).join('&');
- return '/' + m + '/' + c + '/' + a + (params == '' ? '' : '/' + params) + (gets == '' ? '' : '?' + gets);
- },
-
- showMsg: function (msg, success) {
- $('#submit').removeAttr('disabled').text('提交');
- layui.use(['layer'], function () {
- layui.layer.msg(msg, success);
- });
- },
- addBrokerage:function(){
- if (this.brokerage.brokerage >= 0 && this.brokerage.brokerage_two >= 0){
- var that = this;
- this.$set(this.formData,'attrs',this.formData.attrs.map(function (item) {
- item.brokerage = that.brokerage.brokerage;
- item.brokerage_two = that.brokerage.brokerage_two;
- return item;
- }));
- } else {
- return this.showMsg('请填写返佣金额在进行批量添加');
- }
- },
- batchClear:function(){
- this.$set(this,'batchAttr',{
- pic: '',
- price: 0,
- cost: 0,
- ot_price: 0,
- stock: 0,
- bar_code: '',
- weight: 0,
- volume: 0,
- });
- },
-
- batchAdd:function(){
- var that = this;
- this.$set(this.formData,'attrs',this.formData.attrs.map(function (item) {
- if (that.batchAttr.pic) {
- item.pic = that.batchAttr.pic;
- }
- if (that.batchAttr.price > 0){
- item.price = that.batchAttr.price;
- }
- if (that.batchAttr.cost > 0){
- item.cost = that.batchAttr.cost;
- }
- if (that.batchAttr.ot_price > 0){
- item.ot_price = that.batchAttr.ot_price;
- }
- if (that.batchAttr.stock > 0){
- item.stock = that.batchAttr.stock;
- }
- if (that.batchAttr.bar_code != ''){
- item.bar_code = that.batchAttr.bar_code;
- }
- if (that.batchAttr.weight > 0){
- item.weight = that.batchAttr.weight;
- }
- if (that.batchAttr.volume > 0){
- item.volume = that.batchAttr.volume;
- }
- return item;
- }));
- },
-
- getProductInfo: function () {
- var that = this;
- that.requestGet(that.U({c:"auction.auction_gu",a:'get_auction',q:{id:that.id}})).then(function (res) {
- var productInfo = res.data.productInfo || {};
- if(productInfo.id && that.id){
- that.$set(that,'formData',productInfo);
- that.generate();
- }
- that.getRuleList();
- that.init();
- }).catch(function (res) {
- that.showMsg(res.msg);
- })
- },
-
- addDetail: function (item) {
- if (!item.detailValue) return false;
- if (item.detail.find(function (val) {
- if(item.detailValue == val){
- return true;
- }
- })) {
- return this.showMsg('添加的属性值重复');
- }
- item.detail.push(item.detailValue);
- item.detailValue = '';
- },
-
- deleteValue: function (item, inx) {
- if (item.detail.length > 1) {
- item.detail.splice(inx, 1);
- } else {
- return this.showMsg('请设置至少一个属性');
- }
- },
-
- deleteItem: function (index) {
- this.formData.items.splice(index, 1);
- },
-
- deleteAttrs: function (index) {
- var that = this;
- if(that.id > 0){
- that.requestGet(that.U({c:"store.StoreProduct",a:'check_activity',q:{id:that.id}})).then(function (res) {
- that.showMsg(res.msg);
- }).catch(function (res) {
- if (that.formData.attrs.length > 1) {
- that.formData.attrs.splice(index, 1);
- } else {
- return that.showMsg('请设置至少一个规则');
- }
- })
- }else{
- if (that.formData.attrs.length > 1) {
- that.formData.attrs.splice(index, 1);
- } else {
- return that.showMsg('请设置至少一个规则');
- }
- }
- },
-
- createAttrName: function () {
- if (this.formDynamic.attrsName && this.formDynamic.attrsVal) {
- if (this.formData.items.find(function (val) {
- if (val.value == this.formDynamic.attrsName) {
- return true;
- }
- }.bind(this))) {
- return this.showMsg('添加的属性重复');
- }
- this.formData.items.push({
- value: this.formDynamic.attrsName,
- detailValue: '',
- attrHidden: false,
- detail: [this.formDynamic.attrsVal]
- });
- this.formDynamic.attrsName = '';
- this.formDynamic.attrsVal = '';
- this.newRule = false;
- } else {
- return this.showMsg('请添加完整的规格!');
- }
- },
-
- deleteImage: function (key, index) {
- var that = this;
- if (index != undefined) {
- that.formData[key].splice(index, 1);
- that.$set(that.formData, key, that.formData[key]);
- } else {
- that.$set(that.formData, key, '');
- }
- },
- createFrame: function (title, src, opt) {
- opt === undefined && (opt = {});
- var h = 0;
- if (window.innerHeight < 800 && window.innerHeight >= 700) {
- h = window.innerHeight - 50;
- } else if (window.innerHeight < 900 && window.innerHeight >= 800) {
- h = window.innerHeight - 100;
- } else if (window.innerHeight < 1000 && window.innerHeight >= 900) {
- h = window.innerHeight - 150;
- } else if (window.innerHeight >= 1000) {
- h = window.innerHeight - 200;
- } else {
- h = window.innerHeight;
- }
- var area = [(opt.w || window.innerWidth / 2) + 'px', (!opt.h || opt.h > h ? h : opt.h) + 'px'];
- layui.use('layer',function () {
- return layer.open({
- type: 2,
- title: title,
- area: area,
- fixed: false, //不固定
- maxmin: true,
- moveOut: false,//true 可以拖出窗外 false 只能在窗内拖
- anim: 5,//出场动画 isOutAnim bool 关闭动画
- offset: 'auto',//['100px','100px'],//'auto',//初始位置 ['100px','100px'] t[ 上 左]
- shade: 0,//遮罩
- resize: true,//是否允许拉伸
- content: src,//内容
- move: '.layui-layer-title'
- });
- });
- },
- changeIMG: function (name, value) {
- if (this.getRule(name).maxLength !== undefined) {
- var that = this;
- value.map(function (v) {
- that.formData[name].push(v);
- });
- this.$set(this.formData, name, this.formData[name]);
- } else {
- if(name == 'batchAttr.pic'){
- this.batchAttr.pic = value;
- } else {
- if (name.indexOf('.') !== -1) {
- var key = name.split('.');
- if (key.length == 2){
- this.formData[key[0]][key[1]] = value;
- } else if(key.length == 3){
- this.formData[key[0]][key[1]][key[2]] = value;
- } else if(key.length == 4){
- this.$set(this.formData[key[0]][key[1]][key[2]],key[3],value)
- }
- } else {
- this.formData[name] = value;
- }
- }
- }
- },
- getRule: function (name) {
- return this.rule[name] || {};
- },
- uploadImage: function (name) {
- return this.createFrame('选择图片',this.U({c:"widget.images",a:'index',p:{fodder:name}}),{h:545,w:900});
- },
- uploadVideo: function () {
- if (this.videoLink) {
- this.formData.video_link = this.videoLink;
- } else {
- $(this.$refs.filElem).click();
- }
- },
- delVideo: function () {
- var that = this;
- that.$set(that.formData, 'video_link', '');
- },
- insertEditor: function (list) {
- this.um.execCommand('insertimage', list);
- },
- insertEditorVideo: function (src) {
- this.um.setContent('<div><video style="width: 99%" src="'+src+'" class="video-ue" controls="controls" width="100"><source src="'+src+'"></source></video></div><br>',true);
- },
-
- eeventRadio: function () {
- var that = this;
- that.radioRule.map(function (val) {
- that.form.on('radio(' + val + ')', function (res) {
- that.formData[val] = res.value;
- });
- })
- },
- init: function () {
- var that = this;
- window.UMEDITOR_CONFIG.toolbar = [
-
- 'source | undo redo | bold italic underline strikethrough | superscript subscript | forecolor backcolor | removeformat |',
- 'insertorderedlist insertunorderedlist | selectall cleardoc paragraph | fontfamily fontsize',
- '| justifyleft justifycenter justifyright justifyjustify |',
- 'link unlink | emotion selectimgs video | map',
- '| horizontal print preview fullscreen', 'drafts', 'formula'
- ];
- UM.registerUI('selectimgs', function (name) {
- var me = this;
- var $btn = $.eduibutton({
- icon: 'image',
- click: function () {
- that.createFrame('选择图片', "{:Url('widget.images/index',['fodder'=>'editor'])}");
- },
- title: '选择图片'
- });
- this.addListener('selectionchange', function () {
-
- var state = this.queryCommandState(name);
- $btn.edui().disabled(state == -1).active(state == 1)
- });
- return $btn;
- });
- UM.registerUI('video', function (name) {
- var me = this;
- var $btn = $.eduibutton({
- icon: 'video',
- click: function () {
- that.createFrame('选择视频', "{:Url('widget.video/index',['fodder'=>'video'])}");
- },
- title: '选择视频'
- });
- this.addListener('selectionchange', function () {
-
- var state = this.queryCommandState(name);
- $btn.edui().disabled(state == -1).active(state == 1)
- });
- return $btn;
- });
-
- this.um = UM.getEditor('myEditor', {initialFrameWidth: '99%', initialFrameHeight: 400});
- this.um.setContent(that.formData.description);
- that.$nextTick(function () {
- layui.use(['form','element'], function () {
- that.form = layui.form;
- that.form.render();
- that.form.on('select(temp_id)', function (data) {
- that.$set(that.formData, 'temp_id', data.value);
- });
- that.form.on('select(rule_index)', function (data) {
- that.ruleIndex = data.value;
- });
- layui.element.on('tab(docTabBrief)', function(){
- that.layTabId = this.getAttribute('lay-id');
- });
- that.eeventRadio();
- });
- })
- },
- requestPost: function (url, data) {
- return new Promise(function (resolve, reject) {
- axios.post(url, data).then(function (res) {
- if (res.status == 200 && res.data.code == 200) {
- resolve(res.data)
- } else {
- reject(res.data);
- }
- }).catch(function (err) {
- reject({msg:err})
- });
- })
- },
- requestGet: function (url) {
- return new Promise(function (resolve, reject) {
- axios.get(url).then(function (res) {
- if (res.status == 200 && res.data.code == 200) {
- resolve(res.data)
- } else {
- reject(res.data);
- }
- }).catch(function (err) {
- reject({msg:err})
- });
- })
- },
- generates: function () {
- var that = this;
- that.generate(1);
- },
- handleSubmit:function () {
- var that = this;
- var that = this;
- var uid = $('#uid').val();
- console.log(uid);
- that.formData.uid = uid;
- if (!that.formData['uid']){
- return that.showMsg('请绑定用户');
- }
- if (!that.formData['name']){
- return that.showMsg('请填写名称');
- }
- if (!that.formData['image']){
- return that.showMsg('请上传图片');
- }
- $('#submit').attr('disabled', 'disabled').text('修改中...');
- that.requestPost(that.U({c:'auction.auction_gu',a:'update',p:{id:that.id}}),that.formData).then(function (res) {
- that.confirm();
- }).catch(function (res) {
- that.showMsg(res.msg);
- });
- },
- confirm: function(){
- var that = this;
- layui.use(['layer'], function () {
- var layer = layui.layer;
- layer.confirm(that.id ? '修改成功是否返回产品列表' : '修改成功是否返回产品列表', {
- btn: ['返回列表',that.id ? '继续修改' : '继续修改']
- }, function(){
- location.href = that.U({c:'auction.auction_gu',a:'index'});
- }, function(){
- location.reload();
- });
- });
- },
- render:function(){
- this.$nextTick(function(){
- layui.use(['form'], function () {
- layui.form.render('select');
- });
- })
- },
-
- handleDragStart (e, item) {
- this.dragging = item;
- },
- handleDragEnd (e, item) {
- this.dragging = null
- },
- handleDragOver (e) {
- e.dataTransfer.dropEffect = 'move'
- },
- handleDragEnter (e, item) {
- e.dataTransfer.effectAllowed = 'move'
- if (item === this.dragging) {
- return
- }
- var newItems = [...this.formData.activity];
- var src = newItems.indexOf(this.dragging);
- var dst = newItems.indexOf(item);
- newItems.splice(dst, 0, ...newItems.splice(src, 1))
- this.formData.activity = newItems;
- },
- addRule:function(){
- return this.createFrame('添加商品规则',this.U({c:'store.StoreProductRule',a:'create'}));
- },
- allRule:function () {
- if (this.ruleIndex != -1) {
- var rule = this.ruleList[this.ruleIndex];
- if (rule) {
- this.ruleBool = true;
- var rule_value = rule.rule_value.map(function (item) {
- return item;
- });
- this.$set(this.formData,'items',rule_value);
- this.$set(this.formData,'attrs',[]);
- this.$set(this,'formHeader',[]);
- return true;
- }
- }
- this.showMsg('选择的属性无效');
- }
- },
- mounted: function () {
- var that = this;
- that.getProductInfo();
- window.changeIMG = that.changeIMG;
- window.$vm = that;
- }
- });
- </script>
- </body>
- </html>
- <script>
- </script>
|