Init project
This commit is contained in:
alirezakarari
@@ -0,0 +1,437 @@
|
||||
<template>
|
||||
<a-form :form="form" @submit="handleSubmit">
|
||||
<a-spin type="loading" :spinning="loading">
|
||||
<vx-card title="ویرایش آگهی">
|
||||
<div class="grid grid-cols-1 sm:grid-cols-1 md:grid-cols-2 lg:grid-cols-2 md:gap-2 xl:grid-cols-2 lg:gap-4 xl:gap-4">
|
||||
<a-form-item label="عنوان آگهی">
|
||||
<a-input
|
||||
v-decorator="['title', { rules: [{ required: true, message: 'واردکردن دسته الزامی است.' }] }]"
|
||||
autocomplete="off"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="توضیحات آگهی">
|
||||
<a-textarea
|
||||
v-decorator="['body', { rules: [{ required: false, message: '' }] }]" autocomplete="off"/>
|
||||
</a-form-item>
|
||||
<a-form-item label="همراه آگهی دهنده">
|
||||
<a-input
|
||||
v-decorator="['phone', { rules: [{ required: false, message: 'واردکردن دسته الزامی است.' }] }]"
|
||||
autocomplete="off"
|
||||
:disabled="true"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="همراه بازاریاب">
|
||||
<a-input
|
||||
v-decorator="['marketer.mobile', { rules: [{ required: false, message: 'واردکردن دسته الزامی است.' }] }]"
|
||||
autocomplete="off"
|
||||
:disabled="true"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="دسته">
|
||||
<a-tree-select
|
||||
v-decorator="['collection_id', { rules: [{ required: false, message: 'واردکردن دسته الزامی است.' }] }]"
|
||||
style="width: 100%"
|
||||
:dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
|
||||
:tree-data="collection"
|
||||
placeholder=""
|
||||
tree-default-expand-all
|
||||
:replaceFields="replaceFields"
|
||||
@change="accessIdAdv"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="فروشگاه ثبت کننده">
|
||||
<a-input
|
||||
style="width: 100%"
|
||||
v-decorator="['store.title']" :disabled="true"/>
|
||||
</a-form-item>
|
||||
<a-form-item label="تعداد بازدید">
|
||||
<a-input
|
||||
v-decorator="['view_count', { rules: [{ required: false, message: 'واردکردن دسته الزامی است.' }] }]"
|
||||
autocomplete="off"
|
||||
:disabled="true"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="شهر">
|
||||
<a-select
|
||||
show-search
|
||||
v-decorator="['city_id',{ rules: [{ required: true, message: 'واردکردن دسته الزامی است.' }] }]"
|
||||
option-filter-prop="children"
|
||||
:filter-option="filterOption"
|
||||
>
|
||||
<a-select-option v-for="(item, key, index) in cities" :value="key" :key="index">
|
||||
{{item.join(' , ')}}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
<a-form-item label="شماره نمایش داده شده در آگهی">
|
||||
<a-input
|
||||
v-decorator="['phone', { rules: [{ required: false, message: 'واردکردن دسته الزامی است.' }] }]"
|
||||
autocomplete="off"
|
||||
:disabled="true"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="تاریخ انقضا">
|
||||
<a-input
|
||||
v-decorator="['expired_at', { rules: [{ required: false, message: 'واردکردن دسته الزامی است.' }] }]"
|
||||
autocomplete="off"
|
||||
:disabled="true"
|
||||
/>
|
||||
<!-- <label></label>-->
|
||||
<!-- <date-picker-->
|
||||
<!-- :auto-submit="true"-->
|
||||
<!-- color="#ff9800"-->
|
||||
<!-- v-model="expired_at"-->
|
||||
<!-- style="margin-top: 0.5em"-->
|
||||
<!-- :initial-value="null"-->
|
||||
<!-- />-->
|
||||
</a-form-item>
|
||||
<a-form-item>
|
||||
<a-checkbox :disabled="true" v-decorator="['is_swap',{initialValue:false,valuePropName: 'checked'}]">
|
||||
تمایل به معاوضه
|
||||
</a-checkbox>
|
||||
</a-form-item>
|
||||
<a-form-item>
|
||||
<a-checkbox :disabled="true" v-decorator="['for_store',{initialValue:false,valuePropName: 'checked'}]">
|
||||
ثبت شده برای فروشگاه
|
||||
</a-checkbox>
|
||||
</a-form-item>
|
||||
<a-form-item>
|
||||
<a-checkbox :disabled="true" v-decorator="['for_other',{initialValue:false,valuePropName: 'checked'}]">
|
||||
ثبت آگهی برای شخص دیگر
|
||||
</a-checkbox>
|
||||
</a-form-item>
|
||||
<a-form-item>
|
||||
<a-checkbox :disabled="true" v-decorator="['active_chat',{valuePropName: 'checked'}]">
|
||||
فعال کردن چت
|
||||
</a-checkbox>
|
||||
</a-form-item>
|
||||
<a-form-item label="برچسب ها">
|
||||
<TagCreator></TagCreator>
|
||||
</a-form-item>
|
||||
<!-- <a-checkbox @change="activeImage">تایید تصاویر</a-checkbox>-->
|
||||
<a-form-item label="تصاویر آگهی">
|
||||
<Xupload url="admin/file" v-model="images" @change="changeUploadImage"/>
|
||||
</a-form-item>
|
||||
</div>
|
||||
<AdvAttributeComponent :attributes="attributes" :attr="getAttr" :id="data.collection_id" @handleAdd="saveAttrTable"/>
|
||||
<a-button html-type="submit" type="primary" ghost style="margin-left: 3rem;margin-top: 1rem">
|
||||
ذخیره تغییرات
|
||||
</a-button>
|
||||
</vx-card>
|
||||
</a-spin>
|
||||
|
||||
</a-form>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import axios from '@/axios'
|
||||
import AdvAttributeModal from "./AdvAttributeModal";
|
||||
import AdvAttributeComponent from "./AdvAttributeComponent";
|
||||
import AdvImagesComponent from "./AdvImagesComponent";
|
||||
import TagCreator from '../../components/tag-creator/TagCreator'
|
||||
import * as moment from 'jalali-moment';
|
||||
import Xupload from '../../components/x-upload/XUpload'
|
||||
export default {
|
||||
name: "adv-add",
|
||||
components: {
|
||||
AdvImagesComponent,
|
||||
AdvAttributeComponent,
|
||||
AdvAttributeModal,
|
||||
TagCreator,
|
||||
Xupload
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
activeConfirm:false,
|
||||
activeTitleBtn:false,
|
||||
activeImageBtn:false,
|
||||
attributes: [],
|
||||
collection: [],
|
||||
rejectReason: [],
|
||||
provinces: [],
|
||||
provinceCities: [],
|
||||
images: [],
|
||||
cities: [],
|
||||
stores: [],
|
||||
tags: [],
|
||||
visibleConfirmForm: false,
|
||||
cancelAdv: false,
|
||||
value: this.text,
|
||||
editable: false,
|
||||
tempAttrModel: undefined,
|
||||
count: 2,
|
||||
visibleAdvAttrModal: false,
|
||||
attr: {
|
||||
title: '',
|
||||
type: '',
|
||||
value: '',
|
||||
for_swap: ''
|
||||
},
|
||||
adv_for_other: true,
|
||||
adv_has_store: true,
|
||||
previewVisible: false,
|
||||
previewImage: '',
|
||||
form: this.$form.createForm(this, {name: 'coordinated'}),
|
||||
expired_at:'',
|
||||
replaceFields:{ children:'children', title:'title', key:'key', value: 'id' },
|
||||
receiveAttr:null,
|
||||
getAttr:null,
|
||||
collection_adv:null
|
||||
}
|
||||
},
|
||||
|
||||
methods: {
|
||||
saveAttrTable(value){
|
||||
console.log(value,'valuehjjjjj')
|
||||
this.receiveAttr = value
|
||||
},
|
||||
accessIdAdv(id){
|
||||
this.collection_adv = id
|
||||
},
|
||||
handleSubmit(e) {
|
||||
e.preventDefault();
|
||||
this.form.validateFields((err, values) => {
|
||||
if (!err) {
|
||||
try{
|
||||
const rec_attr = this.receiveAttr
|
||||
values.attributes = rec_attr
|
||||
console.log(rec_attr,'dfffffffffff')
|
||||
values.images = this.images
|
||||
this.$store.dispatch('advModel/save', {
|
||||
id: this.$route.params.id,
|
||||
data:values
|
||||
});
|
||||
this.$ntSet('عملیات با موفقیت انجام شد.')
|
||||
this.$router.push('/adv/list')
|
||||
}catch ({message}) {
|
||||
this.$ntSetError(message)
|
||||
}finally {
|
||||
|
||||
}
|
||||
// this.form.resetFields()
|
||||
}
|
||||
});
|
||||
this.visibleConfirmForm = false;
|
||||
},
|
||||
|
||||
activeTitle(e){
|
||||
this.activeTitleBtn = e.target.checked;
|
||||
if(this.activeTitleBtn === true && this.activeImageBtn === true){
|
||||
this.activeConfirm = true
|
||||
}
|
||||
else {
|
||||
this.activeConfirm = false
|
||||
}
|
||||
console.log('activeConfirm',this.activeConfirm);
|
||||
},
|
||||
|
||||
changeUploadImage(file){
|
||||
file.subject = 1
|
||||
file.alt = null
|
||||
file.description = null
|
||||
file.collection_id = this.collection_adv
|
||||
console.log(file,'fileeee')
|
||||
},
|
||||
|
||||
activeImage(e){
|
||||
this.activeImageBtn = e.target.checked;
|
||||
if(this.activeTitleBtn === true && this.activeImageBtn === true){
|
||||
this.activeConfirm = true
|
||||
}
|
||||
else {
|
||||
this.activeConfirm = false
|
||||
}
|
||||
console.log('activeConfirm',this.activeConfirm);
|
||||
},
|
||||
|
||||
cancellForm() {
|
||||
this.cancelAdv = true;
|
||||
},
|
||||
|
||||
async getCollection() {
|
||||
const {data} = await axios.get('admin/adv/collection')
|
||||
console.log(data,'collection')
|
||||
this.collection = data
|
||||
},
|
||||
|
||||
async getRejectReason() {
|
||||
await axios.get('admin/adv/reject')
|
||||
.then((res) => {
|
||||
console.log(res.data, 'rejectReason')
|
||||
return this.rejectReason = res.data
|
||||
})
|
||||
},
|
||||
|
||||
async getStores() {
|
||||
const {data} = await axios.get('admin/adv/store')
|
||||
this.stores = data
|
||||
},
|
||||
|
||||
async getCity() {
|
||||
const {data} = await axios.get('site/city');
|
||||
console.log(data,'city')
|
||||
this.cities = data;
|
||||
// this.provinces = new Set(Object.values(data).map((item) => item[0]));
|
||||
},
|
||||
|
||||
// async getCity() {
|
||||
// const {data} = await axios.get('site/city');
|
||||
// this.provinceCities = data;
|
||||
// this.provinces = new Set(Object.values(data).map((item) => item[0]));
|
||||
// },
|
||||
//
|
||||
// changeProvinces(value) {
|
||||
// let cities = [];
|
||||
// for (var i in this.provinceCities) {
|
||||
// if (this.provinceCities[i][0] == value) {
|
||||
// cities.push({id: i, title: this.provinceCities[i][1]});
|
||||
// }
|
||||
// }
|
||||
// this.form.setFieldsValue({city: undefined});
|
||||
// this.cities = cities;
|
||||
// },
|
||||
|
||||
successUpload() {
|
||||
console.log('ok')
|
||||
this.$vs.notify({color: 'success', title: 'Upload Success', text: 'Lorem ipsum dolor sit amet, consectetur'})
|
||||
},
|
||||
|
||||
addDomain() {
|
||||
this.dynamicValidateForm.domains.push({
|
||||
value: '',
|
||||
key: Date.now(),
|
||||
});
|
||||
},
|
||||
removeDomain(item) {
|
||||
let index = this.dynamicValidateForm.domains.indexOf(item);
|
||||
if (index !== -1) {
|
||||
this.dynamicValidateForm.domains.splice(index, 1);
|
||||
}
|
||||
},
|
||||
filterOption(input, option) {
|
||||
return (
|
||||
option.componentOptions.children[0].text.indexOf(input) >= 0
|
||||
)
|
||||
},
|
||||
|
||||
},
|
||||
computed: {
|
||||
loading() {
|
||||
return this.$store.state.advModel.loading;
|
||||
},
|
||||
editAdvById() {
|
||||
return this.$route.params && this.$route.params.id !== undefined
|
||||
},
|
||||
data() {
|
||||
console.log('this.$store.state.adv.collectionSingle', this.$store.state.advModel.collectionSingle);
|
||||
return this.$store.state.advModel.collectionSingle
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
this.getCollection();
|
||||
this.getStores();
|
||||
this.getRejectReason();
|
||||
this.getCity();
|
||||
if (this.editAdvById) {
|
||||
this.$store.dispatch('advModel/advId', this.$route.params.id).then(() => {
|
||||
// this.data.tags = `${this.data.tags}`
|
||||
this.data.collection_id = `${this.data.collection_id}`
|
||||
this.data.city_id = `${this.data.city_id}`
|
||||
this.images = this.data.images;
|
||||
this.attributes = this.data.attributes
|
||||
this.getAttr = this.attributes.reduce((obj,item)=> Object.assign(obj,{[item.attribute_id]: item.value}),{});
|
||||
console.log(this.getAttr,'getAttr')
|
||||
this.form.setFieldsValue(this.data);
|
||||
this.tags = this.data.tags
|
||||
if (this.data.marketer_id !== null) {
|
||||
this.adv_for_other = true
|
||||
}
|
||||
if (this.data.store_id !== null) {
|
||||
this.adv_has_store = true
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
|
||||
@media (min-width: 940px) {
|
||||
.checkbox {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, 1fr);
|
||||
}
|
||||
|
||||
[dir] .ant-form-item {
|
||||
margin-bottom: 0
|
||||
}
|
||||
}
|
||||
|
||||
.content-area__content {
|
||||
padding-bottom: 30px;
|
||||
}
|
||||
|
||||
[dir=rtl] .ant-notification {
|
||||
z-index: 100000000 !important;
|
||||
}
|
||||
|
||||
.v-nav-menu .vs-sidebar {
|
||||
z-index: 1 !important;
|
||||
}
|
||||
|
||||
[dir=rtl] .ant-checkbox-wrapper + .ant-checkbox-wrapper {
|
||||
margin-right: 0 !important;
|
||||
}
|
||||
|
||||
.ant-checkbox-wrapper {
|
||||
padding: 10px 0;
|
||||
}
|
||||
|
||||
.ant-input-number {
|
||||
width: 100%
|
||||
}
|
||||
|
||||
.grow-space {
|
||||
padding: 0 10px
|
||||
}
|
||||
|
||||
[dir=rtl] .ant-checkbox-wrapper + .ant-checkbox-wrapper[data-v-6c853ba7] {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.birth-day{
|
||||
margin-top: .3em;
|
||||
}
|
||||
|
||||
.birth-day label{
|
||||
color: rgba(0, 0, 0, 0.85);
|
||||
}
|
||||
|
||||
[dir=rtl] .ant-checkbox-inner::after{
|
||||
right: 55%;
|
||||
top: 35%;
|
||||
border-left: 0 !important;
|
||||
-webkit-transform: rotate(-45deg) scale(0) translate(50%, -50%);
|
||||
transform: rotate(-45deg) scale(0) translate(50%, -50%);
|
||||
}
|
||||
[dir=rtl] .ant-tree-checkbox-checked .ant-tree-checkbox-inner::after{
|
||||
border-left: 0 !important;
|
||||
border-right: 2px solid #fff;
|
||||
}
|
||||
[dir=rtl] .ant-tree-checkbox-checked .ant-tree-checkbox-inner::after {
|
||||
border-left: 0 !important;
|
||||
border-right: 2px solid #fff;
|
||||
-webkit-transform: rotate(25deg) scale(1) translate(50%, -50%);
|
||||
transform: rotate(25deg) scale(1) translate(50%, -50%);
|
||||
}
|
||||
[dir=rtl] .ant-checkbox-checked .ant-checkbox-inner::after {
|
||||
border-right: 2px solid #fff;
|
||||
-webkit-transform: rotate(25deg) scale(1) translate(50%, -50%);
|
||||
transform: rotate(25deg) scale(1) translate(50%, -50%);
|
||||
}
|
||||
</style>
|
||||
|
||||
|
||||
|
||||
|
||||
Reference in New Issue
Block a user