diff --git a/sub/subService.go b/sub/subService.go
index 332f8150..ddf9692b 100644
--- a/sub/subService.go
+++ b/sub/subService.go
@@ -20,6 +20,7 @@ type SubService struct {
 	address        string
 	showInfo       bool
 	remarkModel    string
+	datepicker     string
 	inboundService service.InboundService
 	settingService service.SettingService
 }
@@ -39,6 +40,10 @@ func (s *SubService) GetSubs(subId string, host string, showInfo bool) ([]string
 	if err != nil {
 		s.remarkModel = "-ieo"
 	}
+	s.datepicker, err = s.settingService.GetDatepicker()
+    if err != nil {
+        s.datepicker = "gregorian"
+    }
 	for _, inbound := range inbounds {
 		clients, err := s.inboundService.GetClients(inbound)
 		if err != nil {
diff --git a/web/assets/js/model/setting.js b/web/assets/js/model/setting.js
index 86bea983..3ddddb18 100644
--- a/web/assets/js/model/setting.js
+++ b/web/assets/js/model/setting.js
@@ -12,6 +12,7 @@ class AllSetting {
         this.expireDiff = "";
         this.trafficDiff = "";
         this.remarkModel = "-ieo";
+        this.datepicker = "gregorian";
         this.tgBotEnable = false;
         this.tgBotToken = "";
         this.tgBotChatId = "";
diff --git a/web/entity/entity.go b/web/entity/entity.go
index 69e5b2d4..5b09400c 100644
--- a/web/entity/entity.go
+++ b/web/entity/entity.go
@@ -47,6 +47,7 @@ type AllSetting struct {
 	SubEncrypt       bool   `json:"subEncrypt" form:"subEncrypt"`
 	SubShowInfo      bool   `json:"subShowInfo" form:"subShowInfo"`
 	SubURI           string `json:"subURI" form:"subURI"`
+	Datepicker       string `json:"datepicker" form:"datepicker"`
 }
 
 func (s *AllSetting) CheckValid() error {
diff --git a/web/html/xui/client_bulk_modal.html b/web/html/xui/client_bulk_modal.html
index 75e9bf6b..c951bc8d 100644
--- a/web/html/xui/client_bulk_modal.html
+++ b/web/html/xui/client_bulk_modal.html
@@ -104,8 +104,10 @@
                     <a-icon type="question-circle"></a-icon>
                 </a-tooltip>
             </template>
-            <a-date-picker :show-time="{ format: 'HH:mm:ss' }" format="YYYY-MM-DD HH:mm:ss"
+            <a-date-picker v-if="datepicker == 'gregorian'" :show-time="{ format: 'HH:mm:ss' }" format="YYYY-MM-DD HH:mm:ss"
                 :dropdown-class-name="themeSwitcher.currentTheme" v-model="clientsBulkModal.expiryTime"></a-date-picker>
+            <persian-datepicker v-else :dropdown-class-name="themeSwitcher.currentTheme"
+                                value="clientsBulkModal.expiryTime" v-model="clientsBulkModal.expiryTime"></persian-datepicker>
         </a-form-item>
         <a-form-item v-if="clientsBulkModal.expiryTime != 0">
             <template slot="label">
@@ -234,6 +236,9 @@
             get delayedExpireDays() {
                 return this.clientsBulkModal.expiryTime < 0 ? this.clientsBulkModal.expiryTime / -86400000 : 0;
             },
+            get datepicker() {
+                return app.datepicker;
+            },
             set delayedExpireDays(days) {
                 this.clientsBulkModal.expiryTime = -86400000 * days;
             },
diff --git a/web/html/xui/client_modal.html b/web/html/xui/client_modal.html
index 1bc48a6a..4b270607 100644
--- a/web/html/xui/client_modal.html
+++ b/web/html/xui/client_modal.html
@@ -94,6 +94,9 @@
             get isEdit() {
                 return this.clientModal.isEdit;
             },
+            get datepicker() {
+                return app.datepicker;
+            },
             get isTrafficExhausted() {
                 if (!clientStats) return false
                 if (clientStats.total <= 0) return false
diff --git a/web/html/xui/form/client.html b/web/html/xui/form/client.html
index dff1dd5c..f6335915 100644
--- a/web/html/xui/form/client.html
+++ b/web/html/xui/form/client.html
@@ -150,8 +150,10 @@
                 <a-icon type="question-circle"></a-icon>
             </a-tooltip>
         </template>
-        <a-date-picker :show-time="{ format: 'HH:mm:ss' }" format="YYYY-MM-DD HH:mm:ss"
+        <a-date-picker v-if="datepicker == 'gregorian'" :show-time="{ format: 'HH:mm:ss' }" format="YYYY-MM-DD HH:mm:ss"
             :dropdown-class-name="themeSwitcher.currentTheme" v-model="client._expiryTime"></a-date-picker>
+        <persian-datepicker v-else :dropdown-class-name="themeSwitcher.currentTheme"
+                            value="client._expiryTime" v-model="client._expiryTime"></persian-datepicker>
         <a-tag color="red" v-if="isEdit && isExpiry">Expired</a-tag>
     </a-form-item>
     <a-form-item v-if="client.expiryTime != 0">
diff --git a/web/html/xui/form/inbound.html b/web/html/xui/form/inbound.html
index 6f0480c3..5da8ec56 100644
--- a/web/html/xui/form/inbound.html
+++ b/web/html/xui/form/inbound.html
@@ -54,9 +54,11 @@
                 <a-icon type="question-circle"></a-icon>
             </a-tooltip>
         </template>
-            <a-date-picker :show-time="{ format: 'HH:mm:ss' }" format="YYYY-MM-DD HH:mm:ss"
+            <a-date-picker v-if="datepicker == 'gregorian'" :show-time="{ format: 'HH:mm:ss' }" format="YYYY-MM-DD HH:mm:ss"
                 :dropdown-class-name="themeSwitcher.currentTheme"
                 v-model="dbInbound._expiryTime"></a-date-picker>
+            <persian-datepicker v-else :dropdown-class-name="themeSwitcher.currentTheme"
+                                value="dbInbound._expiryTime" v-model="dbInbound._expiryTime"></persian-datepicker>
         </a-form-item>
 </a-form>
 
diff --git a/web/html/xui/inbound_modal.html b/web/html/xui/inbound_modal.html
index f7f9d727..ab42e09c 100644
--- a/web/html/xui/inbound_modal.html
+++ b/web/html/xui/inbound_modal.html
@@ -63,6 +63,9 @@
             get client() {
                 return inModal.inbound.clients[0];
             },
+            get datepicker() {
+                return app.datepicker;
+            },
             get delayedExpireDays() {
                 return this.client && this.client.expiryTime < 0 ? this.client.expiryTime / -86400000 : 0;
             },
diff --git a/web/html/xui/inbounds.html b/web/html/xui/inbounds.html
index 2be031e5..8d1da2f4 100644
--- a/web/html/xui/inbounds.html
+++ b/web/html/xui/inbounds.html
@@ -446,6 +446,7 @@
 <script src="{{ .base_path }}assets/js/model/xray.js?{{ .cur_ver }}"></script>
 <script src="{{ .base_path }}assets/js/model/dbinbound.js?{{ .cur_ver }}"></script>
 {{template "component/themeSwitcher" .}}
+{{template "component/persianDatepicker" .}}
 <script>
     const columns = [{
         title: "ID",
@@ -539,6 +540,7 @@
         data: {
             siderDrawer,
             themeSwitcher,
+            persianDatepicker,
             spinning: false,
             inbounds: [],
             dbInbounds: [],
@@ -560,6 +562,7 @@
                 subURI : ''
             },
             remarkModel: '-ieo',
+            datepicker: 'gregorian',
             tgBotEnable: false,
             pageSize: 0,
             isMobile: window.innerWidth <= 768,
@@ -605,6 +608,7 @@
                     };
                     this.pageSize = pageSize;
                     this.remarkModel = remarkModel;
+                    this.datepicker = datepicker;
                 }
             },
             setInbounds(dbInbounds) {
diff --git a/web/html/xui/settings.html b/web/html/xui/settings.html
index 38037764..1e690a0b 100644
--- a/web/html/xui/settings.html
+++ b/web/html/xui/settings.html
@@ -138,6 +138,27 @@
                                 <setting-list-item type="number" title='{{ i18n "pages.settings.expireTimeDiff" }}' desc='{{ i18n "pages.settings.expireTimeDiffDesc" }}' v-model="allSetting.expireDiff" :min="0"></setting-list-item>
                                 <setting-list-item type="number" title='{{ i18n "pages.settings.trafficDiff" }}' desc='{{ i18n "pages.settings.trafficDiffDesc" }}' v-model="allSetting.trafficDiff" :min="0"></setting-list-item>
                                 <setting-list-item type="text" title='{{ i18n "pages.settings.timeZone"}}' desc='{{ i18n "pages.settings.timeZoneDesc"}}' v-model="allSetting.timeLocation"></setting-list-item>
+                                <a-list-item>
+                                    <a-row style="padding: 20px">
+                                        <a-col :lg="24" :xl="12">
+                                            <a-list-item-meta title='{{ i18n "pages.settings.datepicker"}}'>
+                                                <template slot="description">{{ i18n "pages.settings.datepickerDescription"}}</template>
+                                            </a-list-item-meta>
+                                        </a-col>
+
+                                        <a-col :lg="24" :xl="12">
+                                            <template>
+                                                <a-select style="width: 100%"
+                                                          :dropdown-class-name="themeSwitcher.currentTheme"
+                                                          v-model="datepicker">
+                                                    <a-select-option v-for="item in datepickerList" :value="item.value">
+                                                        <span v-text="item.name"></span>
+                                                    </a-select-option>
+                                                </a-select>
+                                            </template>
+                                        </a-col>
+                                    </a-row>
+                                </a-list-item>
                                 <a-list-item>
                                     <a-row style="padding: 20px">
                                         <a-col :lg="24" :xl="12">
@@ -311,6 +332,7 @@
             showAlert: false,
             remarkModels: {i:'Inbound',e:'Email',o:'Other'},
             remarkSeparators: [' ','-','_','@',':','~','|',',','.','/'],
+            datepickerList: [{name:'Gregorian (Standard)', value: 'gregorian'}, {name:'Jalalian (شمسی)', value: 'jalalian'}],
             remarkSample: '',
             get remarkModel() {
                 rm = this.allSetting.remarkModel;
@@ -328,6 +350,12 @@
                 this.allSetting.remarkModel = value + this.allSetting.remarkModel.substring(1);
                 this.changeRemarkSample();
             },
+            get datepicker() {
+                return this.allSetting.datepicker ? this.allSetting.datepicker : 'gregorian';
+            },
+            set datepicker(value) {
+                this.allSetting.datepicker = value;
+            },
             changeRemarkSample(){
                 sample = []
                 this.remarkModel.forEach(r => sample.push(this.remarkModels[r]));
diff --git a/web/service/setting.go b/web/service/setting.go
index 8b60d166..89d3f400 100644
--- a/web/service/setting.go
+++ b/web/service/setting.go
@@ -56,6 +56,7 @@ var defaultValueMap = map[string]string{
 	"subEncrypt":         "true",
 	"subShowInfo":        "true",
 	"subURI":             "",
+	"datepicker":         "gregorian",
 }
 
 type SettingService struct {
@@ -417,6 +418,10 @@ func (s *SettingService) GetSubURI() (string, error) {
 	return s.getString("subURI")
 }
 
+func (s *SettingService) GetDatepicker() (string, error) {
+	return s.getString("datepicker")
+}
+
 func (s *SettingService) GetPageSize() (int, error) {
 	return s.getInt("pageSize")
 }
@@ -463,6 +468,7 @@ func (s *SettingService) GetDefaultSettings(host string) (interface{}, error) {
 		"subEnable":   func() (interface{}, error) { return s.GetSubEnable() },
 		"subURI":      func() (interface{}, error) { return s.GetSubURI() },
 		"remarkModel": func() (interface{}, error) { return s.GetRemarkModel() },
+		"datepicker":  func() (interface{}, error) { return s.GetDatepicker() },
 	}
 
 	result := make(map[string]interface{})
diff --git a/web/translation/translate.en_US.toml b/web/translation/translate.en_US.toml
index 88ef99e8..3f38f1d6 100644
--- a/web/translation/translate.en_US.toml
+++ b/web/translation/translate.en_US.toml
@@ -246,6 +246,8 @@
 "pageSize" = "Pagination Size"
 "pageSizeDesc" = "Define page size for inbounds table. Set 0 to disable"
 "remarkModel" = "Remark Model and Seperation Charachter"
+"datepicker" = "Datepicker"
+"datepickerDescription" = "Selector calendar type specifies the expiration date"
 "sampleRemark" = "Sample Remark"
 "oldUsername" = "Current Username"
 "currentPassword" = "Current Password"
diff --git a/web/translation/translate.es_ES.toml b/web/translation/translate.es_ES.toml
index ed3f7b79..1c7db303 100644
--- a/web/translation/translate.es_ES.toml
+++ b/web/translation/translate.es_ES.toml
@@ -246,6 +246,8 @@
 "pageSize" = "Tamaño de paginación"
 "pageSizeDesc" = "Defina el tamaño de página para la tabla de entradas. Establezca 0 para desactivar"
 "remarkModel" = "Modelo de observación y carácter de separación"
+"datepicker" = "selector de fechas"
+"datepickerDescription" = "El tipo de calendario selector especifica la fecha de vencimiento"
 "sampleRemark" = "Observación de muestra"
 "oldUsername" = "Nombre de Usuario Actual"
 "currentPassword" = "Contraseña Actual"
diff --git a/web/translation/translate.fa_IR.toml b/web/translation/translate.fa_IR.toml
index f6b3c260..b535ba87 100644
--- a/web/translation/translate.fa_IR.toml
+++ b/web/translation/translate.fa_IR.toml
@@ -246,6 +246,8 @@
 "pageSize" = "اندازه صفحه بندی جدول"
 "pageSizeDesc" = "اندازه صفحه را برای جدول سرویس ها تعریف کنید. 0: غیرفعال"
 "remarkModel" = "نام کانفیگ و جداکننده"
+"datepicker" = "انتخاب کننده تاریخ"
+"datepickerDescription" = "نوع تقویم انتخاب کننده تاریخ انقضا را مشخص میکند "
 "sampleRemark" = "نمونه نام"
 "oldUsername" = "نام کاربری فعلی"
 "currentPassword" = "رمز عبور فعلی"
diff --git a/web/translation/translate.ru_RU.toml b/web/translation/translate.ru_RU.toml
index 228485ac..83d28065 100644
--- a/web/translation/translate.ru_RU.toml
+++ b/web/translation/translate.ru_RU.toml
@@ -246,6 +246,8 @@
 "pageSize" = "Размер нумерации страниц"
 "pageSizeDesc" = "Определить размер страницы для входящей таблицы. Установите 0, чтобы отключить"
 "remarkModel" = "Модель примечания и символ разделения"
+"datepicker" = "выбор даты"
+"datepickerDescription" = "Тип календаря выбора указывает дату истечения срока действия."
 "sampleRemark" = "Пример замечания"
 "oldUsername" = "Текущее имя пользователя"
 "currentPassword" = "Текущий пароль"
diff --git a/web/translation/translate.vi_VN.toml b/web/translation/translate.vi_VN.toml
index 9e21af58..b71ae276 100644
--- a/web/translation/translate.vi_VN.toml
+++ b/web/translation/translate.vi_VN.toml
@@ -246,6 +246,8 @@
 "pageSize" = "Kích thước phân trang"
 "pageSizeDesc" = "Xác định kích thước trang cho bảng gửi đến. Đặt 0 để tắt"
 "remarkModel" = "Ghi chú mô hình và ký tự phân tách"
+"datepicker" = "bảng chọn ngày"
+"datepickerDescription" = "Loại lịch chọn chỉ định ngày hết hạn"
 "sampleRemark" = "Nhận xét mẫu"
 "oldUsername" = "Tên người dùng hiện tại"
 "currentPassword" = "Mật khẩu hiện tại"
diff --git a/web/translation/translate.zh_Hans.toml b/web/translation/translate.zh_Hans.toml
index 1afe7ead..2e6ad3de 100644
--- a/web/translation/translate.zh_Hans.toml
+++ b/web/translation/translate.zh_Hans.toml
@@ -246,6 +246,8 @@
 "pageSize" = "分页大小"
 "pageSizeDesc" = "定义入站表的页面大小。设置 0 表示禁用"
 "remarkModel" = "备注模型和分隔符"
+"datepicker" = "日期选择器"
+"datepickerDescription" = "选择器日历类型指定到期日期"
 "sampleRemark" = "备注示例"
 "oldUsername" = "原用户名"
 "currentPassword" = "原密码"