374 lines
14 KiB
Vue
374 lines
14 KiB
Vue
<template>
|
|
<div>
|
|
<a-card>
|
|
|
|
<a-tabs default-active-key="1" style="direction: ltr" @change="changeTab()">
|
|
|
|
<a-tab-pane key="2" tab="مدیریت شهرها">
|
|
<div>
|
|
<a-card title="شهرهای محل همکاری" :bordered="true" >
|
|
<div class="grid grid-cols-6 gap-4">
|
|
<div>
|
|
<a-button type="primary" class="mt-5">
|
|
ذخیره شهر ها
|
|
</a-button>
|
|
</div>
|
|
|
|
<div class="col-span-5">
|
|
<a-select
|
|
class="mt-3"
|
|
mode="multiple"
|
|
:default-value="[]"
|
|
style="width: 100%;direction: rtl !important;"
|
|
size="large"
|
|
placeholder="انتخاب شهر"
|
|
>
|
|
<a-select-option v-for="item,index in cities" :key="item.id">
|
|
{{item.title}}
|
|
</a-select-option>
|
|
</a-select>
|
|
</div>
|
|
|
|
<a-modal
|
|
v-model="showAddJob"
|
|
okText="ثبت تغییرات "
|
|
@ok="handleSubmit"
|
|
cancelText="بستن"
|
|
title="افزودن شغل" >
|
|
<a-form :form="form" @submit="handleSubmit">
|
|
|
|
<a-form-item label="شغل">
|
|
<a-input
|
|
v-decorator="['title',{rules: [{ required: false, message: 'وارد کردن شغل الزامی است' }]}]"/>
|
|
</a-form-item>
|
|
<a-form-item label="شهر های همکاری">
|
|
|
|
<a-select
|
|
class="mt-3"
|
|
mode="multiple"
|
|
size="large"
|
|
placeholder="انتخاب شهر"
|
|
v-decorator="['cities',{rules: [{ required: false, message: 'وارد کردن شهر های همکاری الزامی است' }]}]"
|
|
>
|
|
<a-select-option v-for="item,index in cities" :key="`${item.id}`">
|
|
{{item.title}}
|
|
</a-select-option>
|
|
</a-select>
|
|
</a-form-item>
|
|
|
|
</a-form>
|
|
</a-modal>
|
|
|
|
|
|
</div>
|
|
</a-card>
|
|
</div>
|
|
<a-button @click="showAddJob =true" type="primary" class="mt-5">
|
|
افزودن شغل
|
|
</a-button>
|
|
<br/>
|
|
<ATable
|
|
class="mt-5"
|
|
:pagination="true"
|
|
bordered
|
|
:locale="{emptyText:'داده ای یافت نشد'}"
|
|
:columns="cols" :data-source="jobs">
|
|
|
|
|
|
<template slot="cities_str_slot" slot-scope="items">
|
|
<a-tag v-for="item,index in items" >{{item}}</a-tag>
|
|
</template>
|
|
|
|
<template slot="operator" slot-scope="id">
|
|
|
|
<a-tooltip placement="bottomLeft">
|
|
<template slot="title">
|
|
<span>حذف</span>
|
|
</template>
|
|
<a-popconfirm
|
|
title="آیا می خواهید حذف کنید؟"
|
|
ok-text="بله"
|
|
cancel-text="خیر"
|
|
@confirm="okDelete(id)"
|
|
>
|
|
<a-button type="danger" class="mr-3">
|
|
حذف
|
|
</a-button>
|
|
</a-popconfirm>
|
|
</a-tooltip>
|
|
|
|
<a-button type="primary" @click="showEditModal(id)" >
|
|
ویرایش
|
|
</a-button>
|
|
</template>
|
|
<a-button type="primary">
|
|
Primary
|
|
</a-button>
|
|
|
|
</ATable>
|
|
|
|
|
|
</a-tab-pane>
|
|
<a-tab-pane key="1" tab="پیکربندی سیستم">
|
|
|
|
<a-checkbox v-model="global" style="direction: rtl">
|
|
ثبت نام در تمامی شهر ها
|
|
</a-checkbox>
|
|
<br>
|
|
<a-button type="primary" class="mt-5" @click="setConfig()">
|
|
ثبت اطلاعات
|
|
</a-button>
|
|
</a-tab-pane>
|
|
</a-tabs>
|
|
|
|
|
|
<a-modal
|
|
v-model="showJobEditModal"
|
|
okText="ثبت تغییرات "
|
|
@ok="saveEditJob"
|
|
cancelText="بستن"
|
|
title="ویرایش شفل" >
|
|
<a-form :form="fromJobEdit" @submit="saveEditJob" >
|
|
|
|
<a-form-item label="شغل">
|
|
<a-input
|
|
v-decorator="['title',{rules: [{ required: false, message: 'وارد کردن شغل الزامی است' }]}]"/>
|
|
</a-form-item>
|
|
<a-form-item label="شهر های همکاری">
|
|
|
|
<a-select
|
|
class="mt-3"
|
|
mode="multiple"
|
|
style="width: 100%;direction: rtl !important;"
|
|
size="large"
|
|
placeholder="انتخاب شهر"
|
|
v-decorator="['cities',{rules: [{ required: false, message: 'وارد کردن شهر های همکاری الزامی است' }],},]"
|
|
>
|
|
<a-select-option v-for="item,index in cities" :key="`${item.id}`">
|
|
{{item.title}}
|
|
</a-select-option>
|
|
</a-select>
|
|
|
|
</a-form-item>
|
|
|
|
</a-form>
|
|
</a-modal>
|
|
|
|
|
|
|
|
</a-card>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import * as TableCol from "./jobCols";
|
|
/*import * as TableCol from './jobTbl';*/
|
|
import XTable from "@/components/x-table/XTable";
|
|
import axios from "@/axios";
|
|
|
|
export default {
|
|
data() {
|
|
return {
|
|
titleJobModal: '',
|
|
col: null,
|
|
global: false,
|
|
showAddJob: false,
|
|
showJobModal: false,
|
|
showJobEditModal:false,
|
|
personelPerMonth: [],
|
|
activeTab: 1,
|
|
currentJobID:null,
|
|
jobs: [],
|
|
cities: [],
|
|
username: '',
|
|
form: this.$form.createForm(this, {name: 'coordinated'}),
|
|
fromJobEdit: this.$form.createForm(this, {name: 'coordinated'}),
|
|
defaultCity:[]
|
|
}
|
|
},
|
|
components: {
|
|
XTable,
|
|
},
|
|
computed:{
|
|
/*modeEdit(){
|
|
return this.$route.params && this.$route.params.id != undefined
|
|
}*/
|
|
},
|
|
methods: {
|
|
async getJobs()
|
|
{
|
|
await axios.get('/jobs')
|
|
.then((res) => {
|
|
this.jobs = res.data;
|
|
}).catch((error) => {
|
|
this.$message.error('خطا در دریافت اطلاعات');
|
|
});
|
|
},
|
|
showEditModal(id)
|
|
{
|
|
this.showJobEditModal=true;
|
|
var item=this.jobs.find((item) => item.id==id);
|
|
this.$nextTick(()=>{
|
|
this.currentJobID=item.id;
|
|
this.fromJobEdit.setFieldsValue(item);
|
|
})
|
|
},
|
|
saveEditJob(e)
|
|
{
|
|
e.preventDefault();
|
|
this.fromJobEdit.validateFields((err, values) => {
|
|
if (!err) {
|
|
values.id=this.currentJobID;
|
|
axios.post('/jobs',values)
|
|
.then((res)=>{
|
|
//console.log(res.data);
|
|
this.$message.success('اطلاعات با موفقیت ثبت شد');
|
|
this.getJobs();
|
|
this.showAddJob=false;
|
|
}).catch((error)=>{
|
|
this.$message.error('خطا در دریافت اطلاعات');
|
|
});
|
|
// console.log('Received values of form: ', values);
|
|
//this.$store.commit('update', values);
|
|
}
|
|
});
|
|
},
|
|
handleSubmit(e) {
|
|
e.preventDefault();
|
|
this.form.validateFields((err, values) => {
|
|
if (!err) {
|
|
axios.post('/jobs',values)
|
|
.then((res)=>{
|
|
//console.log(res.data);
|
|
this.$message.success('اطلاعات با موفقیت ثبت شد');
|
|
this.getJobs();
|
|
this.showAddJob=false;
|
|
}).catch((error)=>{
|
|
this.$message.error('خطا در دریافت اطلاعات');
|
|
});
|
|
//console.log('Received values of form: ', values);
|
|
//this.$store.commit('update', values);
|
|
}
|
|
});
|
|
},
|
|
async changeTab() {
|
|
/* switch (this.activeTab)
|
|
{
|
|
case 1:
|
|
alert('dfdsfdsf')
|
|
await ax().get('/config')
|
|
.then((res)=>{
|
|
//console.log(res.data);
|
|
for (const item in res.data) {
|
|
if(res.data[item].key=='global')
|
|
{
|
|
this.global= res.data[item].value ? true:false;
|
|
}
|
|
}
|
|
// this.global=
|
|
|
|
//console.log('sss',res.data[0]);
|
|
}).catch((error)=>{
|
|
this.$message.error('خطا در دریافت اطلاعات');
|
|
});
|
|
break
|
|
case 2:
|
|
|
|
break
|
|
}*/
|
|
},
|
|
async setConfig() {
|
|
//this.$message.error({content:'dfsdfsdfsdfsdfdsf',duration:20});
|
|
await axios.post('/config', {global: this.global})
|
|
.then((res) => {
|
|
this.$message.success('اطلاعات با موفقیت ثبت شد');
|
|
}).catch((error) => {
|
|
this.$message.error('خطا در ثبت اطلاعات');
|
|
});
|
|
},
|
|
|
|
async okDelete(id){
|
|
try{
|
|
await axios.post('/jobs',{ id:id , delete:true })
|
|
this.getJobs()
|
|
}catch (e) {
|
|
|
|
}finally {
|
|
|
|
}
|
|
}
|
|
},
|
|
async created() {
|
|
this.cols = TableCol.default
|
|
|
|
await axios.get('/config')
|
|
.then((res) => {
|
|
//console.log(res.data);
|
|
for (const item in res.data) {
|
|
if (res.data[item].key == 'global') {
|
|
this.global = res.data[item].value ? true : false;
|
|
}
|
|
}
|
|
}).catch((error) => {
|
|
this.$message.error('خطا در دریافت اطلاعات');
|
|
});
|
|
|
|
await axios.get('/cities')
|
|
.then((res) => {
|
|
this.cities = res.data;
|
|
console.log(res.data);
|
|
}).catch((error) => {
|
|
this.$message.error('خطا در دریافت اطلاعات');
|
|
});
|
|
|
|
this.getJobs();
|
|
|
|
},
|
|
mounted() {
|
|
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
.ant-pagination
|
|
{
|
|
direction: ltr !important;
|
|
}
|
|
td,th{
|
|
text-align: right !important;
|
|
}
|
|
.ant-tabs-nav-wrap
|
|
{
|
|
float: right !important;
|
|
}
|
|
.ant-tabs-content
|
|
{
|
|
text-align: right !important;
|
|
}
|
|
.ant-modal-mask
|
|
{
|
|
z-index: 9999999 !important;
|
|
}
|
|
.ant-modal-wrap
|
|
{
|
|
z-index: 999999999 !important;
|
|
}
|
|
.ant-select-dropdown{
|
|
z-index: 999999999!important;
|
|
}
|
|
.ant-modal-content
|
|
{
|
|
direction: ltr !important;
|
|
}
|
|
.ant-modal-body
|
|
{
|
|
direction: rtl !important;
|
|
}
|
|
.ant-modal-header
|
|
{
|
|
direction: rtl;
|
|
margin-right: 25px;
|
|
}
|
|
</style>
|