Revert "enhance_hijri_datepicker"
This commit is contained in:
parent
7e83267a81
commit
c32adf39ba
|
|
@ -1,151 +0,0 @@
|
|||
# Web Hijri Datepicker - Enhanced Version 2.2.0
|
||||
|
||||
## 🌟 التحديثات الجديدة
|
||||
|
||||
### ✨ المميزات المحسنة:
|
||||
- **مكتبة محدثة**: ترقية إلى jQuery Calendars v2.2.0
|
||||
- **تصميم حديث**: واجهة مستخدم محسنة تتماشى مع Odoo
|
||||
- **أداء أفضل**: تحسينات في السرعة والاستجابة
|
||||
- **دعم RTL محسن**: دعم أفضل للغة العربية
|
||||
- **UX محسن**: تجربة مستخدم أكثر سلاسة
|
||||
|
||||
### 🎨 التصميم الجديد:
|
||||
- شكل عصري ومتجاوب
|
||||
- ألوان متناسقة مع Odoo
|
||||
- تأثيرات بصرية ناعمة
|
||||
- أيقونات وأزرار محسنة
|
||||
- انتقالات سلسة
|
||||
|
||||
### 🚀 التحسينات التقنية:
|
||||
- معالجة أخطاء محسنة
|
||||
- أداء أفضل للذاكرة
|
||||
- تكامل أفضل مع Odoo
|
||||
- دعم التحقق من البيانات
|
||||
- تحسين الأمان
|
||||
|
||||
## 📦 المتطلبات
|
||||
|
||||
- Odoo 14.0+
|
||||
- jQuery 3.0+
|
||||
- متصفح حديث (Chrome 60+, Firefox 55+, Safari 10+)
|
||||
|
||||
## 🔧 التثبيت
|
||||
|
||||
1. تثبيت الموديول عبر Odoo Apps
|
||||
2. إعادة تشغيل الخدمة (اختياري للأداء الأمثل)
|
||||
3. تحديث assets إذا لزم الأمر
|
||||
|
||||
## 📱 الاستخدام
|
||||
|
||||
سيظهر حقل التاريخ الهجري تلقائياً أسفل كل حقل تاريخ ميلادي في النظام.
|
||||
|
||||
### المميزات:
|
||||
- **تحويل تلقائي**: بين التاريخ الميلادي والهجري
|
||||
- **مزامنة فورية**: تحديث الحقلين معاً
|
||||
- **واجهة بديهية**: سهلة الاستخدام
|
||||
- **دعم كامل للعربية**: أرقام وأسماء الشهور بالعربية
|
||||
|
||||
## 🌍 اللغات المدعومة
|
||||
|
||||
- العربية (افتراضي)
|
||||
- الإنجليزية
|
||||
- الفارسية
|
||||
|
||||
## 🎯 الميزات الرئيسية
|
||||
|
||||
### ✅ للمستخدمين:
|
||||
- واجهة بديهية وسهلة
|
||||
- تحويل فوري بين التقاويم
|
||||
- عرض واضح للتواريخ
|
||||
- دعم شامل للعربية
|
||||
|
||||
### ✅ للمطورين:
|
||||
- كود نظيف ومنظم
|
||||
- API مرن للتخصيص
|
||||
- تكامل سلس مع Odoo
|
||||
- موثق بالكامل
|
||||
|
||||
## 🔄 التحديثات من الإصدار السابق
|
||||
|
||||
### 🆕 جديد في v2.2.0:
|
||||
1. **مكتبة jQuery Calendars محدثة**
|
||||
2. **تصميم UI/UX جديد كلياً**
|
||||
3. **أداء محسن بنسبة 40%**
|
||||
4. **معالجة أخطاء متقدمة**
|
||||
5. **دعم RTL محسن**
|
||||
6. **تكامل أفضل مع النظام**
|
||||
|
||||
### 🐛 الإصلاحات:
|
||||
- حل مشكلة التداخل في العرض
|
||||
- تحسين الاستجابة على الأجهزة المحمولة
|
||||
- إصلاح مشكلة عرض التواريخ الهجرية
|
||||
- تحسين الأداء في النماذج الكبيرة
|
||||
|
||||
## ⚡ الأداء
|
||||
|
||||
- **سرعة التحميل**: محسنة بنسبة 40%
|
||||
- **استهلاك الذاكرة**: مخفض بنسبة 25%
|
||||
- **الاستجابة**: أسرع بـ 60%
|
||||
- **التوافق**: أفضل مع جميع المتصفحات
|
||||
|
||||
## 🛠️ التخصيص
|
||||
|
||||
يمكن تخصيص المظهر والسلوك عبر:
|
||||
|
||||
### CSS Variables:
|
||||
```css
|
||||
:root {
|
||||
--hijri-primary-color: #6c5ce7;
|
||||
--hijri-secondary-color: #74b9ff;
|
||||
--hijri-border-radius: 8px;
|
||||
--hijri-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
|
||||
}
|
||||
```
|
||||
|
||||
### JavaScript Options:
|
||||
```javascript
|
||||
// إعدادات مخصصة
|
||||
$.calendarsPicker.setDefaults({
|
||||
showSpeed: 'fast',
|
||||
showAnim: 'slideDown',
|
||||
yearRange: 'c-50:c+50'
|
||||
});
|
||||
```
|
||||
|
||||
## 📞 الدعم
|
||||
|
||||
للدعم الفني أو الاستفسارات:
|
||||
- 📧 Email: support@example.com
|
||||
- 📱 WhatsApp: +966xxxxxxxxx
|
||||
- 🌐 Website: www.example.com
|
||||
|
||||
## 📄 الرخصة
|
||||
|
||||
هذا الموديول مرخص تحت رخصة MIT.
|
||||
|
||||
## 🤝 المساهمة
|
||||
|
||||
نرحب بمساهماتكم لتطوير الموديول:
|
||||
1. Fork المشروع
|
||||
2. أنشئ branch جديد للميزة
|
||||
3. Commit التغييرات
|
||||
4. Push إلى Branch
|
||||
5. أنشئ Pull Request
|
||||
|
||||
## 📈 خارطة الطريق
|
||||
|
||||
### 🔮 القادم في الإصدارات القادمة:
|
||||
- دعم المزيد من التقاويم
|
||||
- تكامل مع الموبايل app
|
||||
- ميزات AI للتحويل الذكي
|
||||
- تحسينات الأداء المستمرة
|
||||
|
||||
---
|
||||
|
||||
## 🏆 شكر خاص
|
||||
|
||||
شكراً لـ Keith Wood على مكتبة jQuery Calendars الرائعة.
|
||||
|
||||
**النسخة الحالية**: 2.2.0
|
||||
**تاريخ التحديث**: أغسطس 2025
|
||||
**الحالة**: ✅ مستقر ومجرب
|
||||
|
|
@ -1,100 +1,15 @@
|
|||
# -*- coding: utf-8 -*-
|
||||
|
||||
{
|
||||
'name': 'Web Hijri Datepicker Enhanced',
|
||||
'version': '2.2.0',
|
||||
'category': 'Web/Tools',
|
||||
'summary': 'Modern Hijri Calendar Integration with Enhanced UI/UX',
|
||||
'description': """
|
||||
Enhanced Web Hijri Datepicker v2.2.0
|
||||
=====================================
|
||||
|
||||
🌟 **Major Update with Modern Design and Performance Improvements**
|
||||
|
||||
**New Features:**
|
||||
• Updated jQuery Calendars library to v2.2.0
|
||||
• Modern, responsive UI design matching Odoo's aesthetics
|
||||
• Enhanced Arabic/RTL language support
|
||||
• Improved performance and memory optimization
|
||||
• Better error handling and validation
|
||||
• Smooth animations and transitions
|
||||
• Mobile-friendly responsive design
|
||||
|
||||
**Key Improvements:**
|
||||
• 40% faster loading times
|
||||
• 25% reduced memory usage
|
||||
• 60% better responsiveness
|
||||
• Enhanced integration with Odoo forms
|
||||
• Improved accessibility features
|
||||
• Better cross-browser compatibility
|
||||
|
||||
**Features:**
|
||||
• Automatic conversion between Gregorian and Hijri dates
|
||||
• Real-time synchronization of both calendars
|
||||
• Beautiful modern popup calendar interface
|
||||
• Full Arabic language support with proper RTL
|
||||
• Clear placeholders and intuitive user experience
|
||||
• Seamless integration with all Odoo date fields
|
||||
|
||||
**Technical Specs:**
|
||||
• Compatible with Odoo 14.0+
|
||||
• Supports multiple Islamic calendar variants
|
||||
• Responsive design for all screen sizes
|
||||
• Modern CSS3 with smooth animations
|
||||
• Enhanced JavaScript with error handling
|
||||
• Optimized for production environments
|
||||
|
||||
This module automatically adds Hijri date picker functionality below every standard date field in Odoo, providing users with an intuitive way to work with Islamic calendar dates.
|
||||
""",
|
||||
'author': 'Your Company',
|
||||
'website': 'https://www.yourcompany.com',
|
||||
'license': 'LGPL-3',
|
||||
'name': 'Web Hijri',
|
||||
'category' : 'Odex25-base',
|
||||
'version': '1.0',
|
||||
'description': """Enable Web Hijri Datepicker in Odoo""",
|
||||
'depends': ['web'],
|
||||
'data': [
|
||||
'views/web_hijri_template.xml'
|
||||
],
|
||||
'assets': {
|
||||
'web.assets_backend': [
|
||||
'web_hijri_datepicker/static/src/scss/hijri_modern.css',
|
||||
'web_hijri_datepicker/static/src/scss/web_hijri_date.scss',
|
||||
'web_hijri_datepicker/static/lib/jquery.calendars.package-2.2.0/jquery.plugin.js',
|
||||
'web_hijri_datepicker/static/lib/jquery.calendars.package-2.2.0/jquery.calendars.js',
|
||||
'web_hijri_datepicker/static/lib/jquery.calendars.package-2.2.0/jquery.calendars.all.js',
|
||||
'web_hijri_datepicker/static/lib/jquery.calendars.package-2.2.0/jquery.calendars.plus.js',
|
||||
'web_hijri_datepicker/static/lib/jquery.calendars.package-2.2.0/jquery.calendars.picker.js',
|
||||
'web_hijri_datepicker/static/lib/jquery.calendars.package-2.2.0/jquery.calendars.islamic.js',
|
||||
'web_hijri_datepicker/static/lib/jquery.calendars.package-2.2.0/jquery.calendars.islamic-ar.js',
|
||||
'web_hijri_datepicker/static/lib/jquery.calendars.package-2.2.0/jquery.calendars.islamic-fa.js',
|
||||
'web_hijri_datepicker/static/lib/jquery.timeentry.package-2.0.1/jquery.timeentry.css',
|
||||
'web_hijri_datepicker/static/lib/jquery.timeentry.package-2.0.1/jquery.plugin.js',
|
||||
'web_hijri_datepicker/static/lib/jquery.timeentry.package-2.0.1/jquery.timeentry.js',
|
||||
'web_hijri_datepicker/static/lib/jquery.timeentry.package-2.0.1/jquery.timeentry-ar.js',
|
||||
'web_hijri_datepicker/static/src/js/web_hijri_date.js',
|
||||
],
|
||||
},
|
||||
'qweb': [
|
||||
"static/src/xml/web_hijri_date.xml"
|
||||
],
|
||||
'images': [
|
||||
'static/description/banner.png',
|
||||
'static/description/icon.png',
|
||||
],
|
||||
'data': ['views/web_hijri_template.xml'],
|
||||
'qweb': ["static/src/xml/web_hijri_date.xml"],
|
||||
'installable': True,
|
||||
'auto_install': False,
|
||||
'application': True,
|
||||
'bootstrap': True,
|
||||
'pre_init_hook': False,
|
||||
'post_init_hook': False,
|
||||
'uninstall_hook': False,
|
||||
'external_dependencies': {
|
||||
'python': [],
|
||||
'bin': [],
|
||||
},
|
||||
'maintainers': ['Your Name'],
|
||||
'support': 'support@yourcompany.com',
|
||||
'price': 0,
|
||||
'currency': 'USD',
|
||||
'live_test_url': 'https://demo.yourcompany.com',
|
||||
'demo': [],
|
||||
'test': [],
|
||||
}
|
||||
'application': True,
|
||||
}
|
||||
|
|
|
|||
|
|
@ -7,7 +7,6 @@ odoo.define('web_hijri_datepicker.datepicker', function (require) {
|
|||
var FieldDate = require('web.basic_fields').FieldDate;
|
||||
var _t = core._t;
|
||||
|
||||
// Enhanced Hijri month names with better Arabic support
|
||||
var hijriMonths = {
|
||||
"Muharram": "مُحَرَّم",
|
||||
"Safar": "صَفَر",
|
||||
|
|
@ -23,11 +22,10 @@ odoo.define('web_hijri_datepicker.datepicker', function (require) {
|
|||
"Dhu al-Hijjah": "ذُوالْحِجَّة"
|
||||
}
|
||||
|
||||
// Enhanced number conversion for better Arabic display
|
||||
String.prototype.fromDigits = function () {
|
||||
var arabicDigits = ['۰', '۱', '۲', '۳', '٤', '۵', '٦', '۷', '۸', '۹'];
|
||||
return this.replace(/[0-9]/g, function (digit) {
|
||||
return arabicDigits[+digit];
|
||||
var id = ['۰', '۱', '۲', '۳', '٤', '۵', '٦', '۷', '۸', '۹'];
|
||||
return this.replace(/[0-9]/g, function (w) {
|
||||
return id[+w]
|
||||
});
|
||||
}
|
||||
|
||||
|
|
@ -36,180 +34,81 @@ odoo.define('web_hijri_datepicker.datepicker', function (require) {
|
|||
var self = this;
|
||||
this.$input = this.$('input.o_datepicker_input');
|
||||
this.$input_hijri = this.$('input.o_hijri');
|
||||
|
||||
// Enhanced click handler with better UX
|
||||
this.$input_hijri.click(function (e) {
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
self.$input_hijri.calendarsPicker('show');
|
||||
});
|
||||
|
||||
// Modern configuration with enhanced features
|
||||
this.$input_hijri.calendarsPicker({
|
||||
calendar: $.calendars.instance('islamic', this.options.locale || 'ar'),
|
||||
calendar: $.calendars.instance('islamic', this.options.locale),
|
||||
dateFormat: 'M d, yyyy',
|
||||
showAnim: 'slideDown', // Modern animation
|
||||
showSpeed: 'fast',
|
||||
showOnFocus: false,
|
||||
closeOnDateSelect: true, // Better UX - close after selection
|
||||
yearRange: 'c-100:c+50', // Extended year range
|
||||
changeMonth: true,
|
||||
changeYear: true,
|
||||
showOtherMonths: true,
|
||||
selectOtherMonths: true,
|
||||
localNumbers: true, // Enable Arabic numerals
|
||||
renderer: this._getModernRenderer(),
|
||||
closeOnDateSelect: false,
|
||||
onSelect: this._convertDateToHijri.bind(this),
|
||||
onShow: function() {
|
||||
// Add modern CSS class for styling
|
||||
$('.calendars-popup').addClass('hijri-modern-popup');
|
||||
}
|
||||
});
|
||||
|
||||
this.__libInput++;
|
||||
this.$el.datetimepicker(this.options);
|
||||
this.__libInput--;
|
||||
this._setReadonly(false);
|
||||
},
|
||||
|
||||
/**
|
||||
* Get modern renderer configuration for better styling
|
||||
*/
|
||||
_getModernRenderer: function() {
|
||||
return $.extend({}, $.calendarsPicker.defaultRenderer, {
|
||||
picker: '<div class="calendars">{months}</div>',
|
||||
monthRow: '<div class="calendars-month-row">{months}</div>',
|
||||
month: '<div class="calendars-month">' +
|
||||
'<div class="calendars-month-header">' +
|
||||
'<button type="button" class="calendars-nav calendars-prev" title="{prevText}">{prevText}</button>' +
|
||||
'<div class="calendars-month-year">{monthHeader}</div>' +
|
||||
'<button type="button" class="calendars-nav calendars-next" title="{nextText}">{nextText}</button>' +
|
||||
'</div>' +
|
||||
'<table><thead>{weekHeader}</thead><tbody>{weeks}</tbody></table>' +
|
||||
'</div>',
|
||||
weekHeader: '<tr>{days}</tr>',
|
||||
dayHeader: '<th>{day}</th>',
|
||||
week: '<tr>{days}</tr>',
|
||||
day: '<td>{day}</td>',
|
||||
monthSelector: '.calendars-month',
|
||||
daySelector: 'td',
|
||||
rtlClass: 'calendars-rtl',
|
||||
multiClass: 'calendars-multi',
|
||||
defaultClass: '',
|
||||
selectedClass: 'calendars-selected',
|
||||
highlightedClass: 'calendars-highlight',
|
||||
todayClass: 'calendars-today',
|
||||
otherMonthClass: 'calendars-other-month',
|
||||
weekendClass: 'calendars-weekend',
|
||||
commandClass: 'calendars-cmd calendars-cmd-',
|
||||
commandButtonClass: '',
|
||||
commandLinkClass: '',
|
||||
disabledClass: 'calendars-disabled'
|
||||
});
|
||||
},
|
||||
|
||||
_convertGregorianToHijri: function (date) {
|
||||
var year, month, day, jd, formatted_date;
|
||||
var calendar = $.calendars.instance('islamic');
|
||||
|
||||
if (date && !_.isUndefined(date)) {
|
||||
date = moment(date).locale('en');
|
||||
month = parseInt(date.format('M'));
|
||||
day = parseInt(date.format('D'));
|
||||
year = parseInt(date.format('YYYY'));
|
||||
|
||||
jd = $.calendars.instance('gregorian').toJD(year, month, day);
|
||||
formatted_date = calendar.fromJD(jd);
|
||||
|
||||
var hijriMonth = calendar.formatDate('MM', formatted_date);
|
||||
var hijriDate = calendar.formatDate('d, yyyy', formatted_date);
|
||||
|
||||
// Enhanced Arabic localization
|
||||
if (this.options.locale === 'ar' || !this.options.locale) {
|
||||
hijriDate = hijriDate.fromDigits();
|
||||
// Find Arabic month name
|
||||
var arabicMonth = _.find(hijriMonths, function (value, key) {
|
||||
return key === hijriMonth;
|
||||
var month = calendar.formatDate('MM', formatted_date);
|
||||
var date = calendar.formatDate('d, yyyy', formatted_date);
|
||||
if (this.options.locale == 'ar') {
|
||||
date = date.fromDigits();
|
||||
month = _.find(hijriMonths, function (value, key) {
|
||||
if (key === month) {
|
||||
return value;
|
||||
}
|
||||
});
|
||||
hijriMonth = arabicMonth || hijriMonth;
|
||||
}
|
||||
|
||||
return _.str.sprintf("%s %s", hijriMonth, hijriDate);
|
||||
return _.str.sprintf("%s %s", month, date);
|
||||
}
|
||||
},
|
||||
|
||||
_convertDateToHijri: function (date) {
|
||||
if (!date || date.length === 0) {
|
||||
return false;
|
||||
}
|
||||
|
||||
// Prevent event bubbling for better UX
|
||||
$(document).off('click.calendars').on('click.calendars', '.calendars a', function (e) {
|
||||
$(document).on('click', '.calendars a', function (e) {
|
||||
e.preventDefault();
|
||||
e.stopImmediatePropagation();
|
||||
return false;
|
||||
});
|
||||
|
||||
try {
|
||||
var selectedDate = date[0];
|
||||
var jd = $.calendars.instance('islamic').toJD(
|
||||
parseInt(selectedDate.year()),
|
||||
parseInt(selectedDate.month()),
|
||||
parseInt(selectedDate.day())
|
||||
);
|
||||
|
||||
var gregorianDate = $.calendars.instance('gregorian').fromJD(jd);
|
||||
var dateValue = moment(time.str_to_date(gregorianDate)).add(1, 'days');
|
||||
|
||||
this.setValue(this._parseClient(dateValue));
|
||||
this.trigger("datetime_changed");
|
||||
|
||||
// Hide the popup after selection for better UX
|
||||
this.$input_hijri.calendarsPicker('hide');
|
||||
|
||||
} catch (error) {
|
||||
console.warn('Hijri date conversion error:', error);
|
||||
}
|
||||
},
|
||||
var jd = $.calendars.instance('islamic').toJD(parseInt(date[0].year()), parseInt(date[0].month()), parseInt(date[0].day()));
|
||||
var formatted_date = $.calendars.instance('gregorian').fromJD(jd);
|
||||
var date_value = moment(time.str_to_date(formatted_date)).add(1, 'days');
|
||||
this.setValue(this._parseClient(date_value));
|
||||
this.trigger("datetime_changed");
|
||||
|
||||
},
|
||||
_parseDate: function (v) {
|
||||
return v.clone().locale('en').format('YYYY-MM-DD');
|
||||
},
|
||||
|
||||
setValue: function (value) {
|
||||
this._super.apply(this, arguments);
|
||||
var parsed_date = value ? this._parseDate(value) : null;
|
||||
var hijri_value = parsed_date ? this._convertGregorianToHijri(parsed_date) : null;
|
||||
|
||||
// Enhanced placeholder handling
|
||||
if (hijri_value) {
|
||||
this.$input_hijri.val(hijri_value).removeClass('o_input_placeholder');
|
||||
} else {
|
||||
this.$input_hijri.val('').addClass('o_input_placeholder');
|
||||
}
|
||||
this.$input_hijri.val(hijri_value);
|
||||
},
|
||||
|
||||
destroy: function () {
|
||||
// Clean up event handlers
|
||||
$(document).off('click.calendars');
|
||||
|
||||
if (this.$input_hijri && this.$input_hijri.hasClass('hasCalendarsPicker')) {
|
||||
this.$input_hijri.calendarsPicker('destroy');
|
||||
}
|
||||
|
||||
if (this.$el) {
|
||||
this.__libInput++;
|
||||
this.$el.datetimepicker('destroy');
|
||||
this.__libInput--;
|
||||
}
|
||||
},
|
||||
|
||||
_onInputClicked: function (e) {
|
||||
if (e && e.target && !$(e.target).hasClass('o_hijri')) {
|
||||
if (e && e.target && ! $(e.target).hasClass('o_hijri')){
|
||||
return this._super();
|
||||
}
|
||||
},
|
||||
|
||||
_formatClients: function (v) {
|
||||
return field_utils.format[this.type_of_date](v, null, {timezone: true});
|
||||
},
|
||||
|
|
@ -219,66 +118,31 @@ odoo.define('web_hijri_datepicker.datepicker', function (require) {
|
|||
_renderReadonly: function () {
|
||||
var self = this;
|
||||
this._super.apply(this, arguments);
|
||||
|
||||
if (this.value) {
|
||||
window.dv = this.value;
|
||||
this.datewidget = this._makeDatePicker();
|
||||
var $container = $('<div/>');
|
||||
|
||||
// Gregorian date
|
||||
var gregorianValue = this.value ? this.datewidget._formatClients(this.value) : '';
|
||||
var $gregorianDiv = $('<div>', {
|
||||
class: this.$el.attr('class') + ' o_gregorian_date',
|
||||
text: gregorianValue,
|
||||
});
|
||||
|
||||
// Hijri date with enhanced styling
|
||||
var $div = $('<div/>');
|
||||
var value = this.value ? this.datewidget._formatClients(this.value) : '';
|
||||
var parsed_date = this.value ? this.datewidget._parseDate(this.value) : '';
|
||||
var hijri_value = parsed_date ? this.datewidget._convertGregorianToHijri(parsed_date) : '';
|
||||
|
||||
if (hijri_value) {
|
||||
var $hijriDiv = $('<div>', {
|
||||
class: this.$el.attr('class') + ' o_hijri_date mt-1',
|
||||
style: 'font-size: 12px; color: #28a745; font-weight: 500;'
|
||||
});
|
||||
|
||||
$hijriDiv.html('<span style="color: #6c757d;">التاريخ الهجري:</span> ' + hijri_value);
|
||||
$container.append($gregorianDiv).append($hijriDiv);
|
||||
} else {
|
||||
$container.append($gregorianDiv);
|
||||
}
|
||||
// Gregorian Date
|
||||
$('<div>', {
|
||||
class: this.$el.attr('class'),
|
||||
text: value,
|
||||
}).appendTo($div);
|
||||
|
||||
// Hijri Date with simple display
|
||||
$('<div>', {
|
||||
class: this.$el.attr('class') + ' mt-1',
|
||||
text: hijri_value ? 'التاريخ الهجري: ' + hijri_value : '',
|
||||
style: 'font-size: 12px; color: #6c757d;'
|
||||
}).appendTo($div);
|
||||
|
||||
this.datewidget.appendTo('<div>').then(function () {
|
||||
self._replaceElement($container);
|
||||
self._replaceElement($div);
|
||||
});
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
// Enhanced integration with Odoo's form validation
|
||||
if ($.validator) {
|
||||
$.validator.addMethod('hijriDate', function(value, element) {
|
||||
if (!value) return true;
|
||||
|
||||
try {
|
||||
var calendar = $.calendars.instance('islamic');
|
||||
var parsedDate = calendar.parseDate('M d, yyyy', value);
|
||||
return parsedDate && calendar.isValid(parsedDate.year(), parsedDate.month(), parsedDate.day());
|
||||
} catch (e) {
|
||||
return false;
|
||||
}
|
||||
}, 'الرجاء إدخال تاريخ هجري صحيح');
|
||||
}
|
||||
|
||||
// Global configuration for better performance
|
||||
if ($.calendarsPicker) {
|
||||
$.calendarsPicker.setDefaults({
|
||||
showSpeed: 'fast',
|
||||
showAnim: 'slideDown',
|
||||
changeMonth: true,
|
||||
changeYear: true,
|
||||
localNumbers: true,
|
||||
yearRange: 'c-100:c+50'
|
||||
});
|
||||
}
|
||||
|
||||
})
|
||||
});
|
||||
|
|
|
|||
|
|
@ -1,265 +0,0 @@
|
|||
/*
|
||||
* Modern Hijri Datepicker CSS
|
||||
* Designed to integrate seamlessly with Odoo's UI
|
||||
* Version: 2.2.0 Compatible
|
||||
*/
|
||||
|
||||
/* ==================== MODERN HIJRI DATEPICKER ==================== */
|
||||
|
||||
.calendars-popup {
|
||||
z-index: 10000 !important;
|
||||
position: absolute !important;
|
||||
border: 1px solid #e0e0e0;
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
|
||||
background: #ffffff;
|
||||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
|
||||
font-size: 13px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
/* Main calendar container */
|
||||
.calendars {
|
||||
min-width: 280px;
|
||||
padding: 0;
|
||||
background: #ffffff;
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
/* Calendar header */
|
||||
.calendars-month-header {
|
||||
background: linear-gradient(135deg, #6c5ce7, #74b9ff);
|
||||
color: white;
|
||||
padding: 12px 16px;
|
||||
display: flex !important;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
font-weight: 600;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.calendars-month-header .calendars-month-year {
|
||||
font-size: 16px;
|
||||
font-weight: 700;
|
||||
flex: 1;
|
||||
text-align: center;
|
||||
color: white;
|
||||
}
|
||||
|
||||
/* Navigation buttons */
|
||||
.calendars-nav {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: white;
|
||||
padding: 8px 12px;
|
||||
border-radius: 6px;
|
||||
cursor: pointer;
|
||||
font-size: 16px;
|
||||
transition: all 0.2s ease;
|
||||
margin: 0 4px;
|
||||
}
|
||||
|
||||
.calendars-nav:hover {
|
||||
background: rgba(255, 255, 255, 0.2);
|
||||
transform: scale(1.1);
|
||||
}
|
||||
|
||||
/* Week header */
|
||||
.calendars thead {
|
||||
background: #f8f9fa;
|
||||
border-bottom: 1px solid #e9ecef;
|
||||
}
|
||||
|
||||
.calendars thead th {
|
||||
padding: 12px 8px;
|
||||
font-weight: 600;
|
||||
color: #6c757d;
|
||||
font-size: 12px;
|
||||
text-align: center;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.5px;
|
||||
}
|
||||
|
||||
/* Calendar days */
|
||||
.calendars td {
|
||||
position: relative;
|
||||
padding: 0;
|
||||
border: none;
|
||||
background: white;
|
||||
}
|
||||
|
||||
.calendars td a,
|
||||
.calendars td span {
|
||||
display: block;
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
line-height: 36px;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
color: #495057;
|
||||
border-radius: 6px;
|
||||
margin: 2px;
|
||||
transition: all 0.2s ease;
|
||||
font-weight: 500;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
/* Selectable dates */
|
||||
.calendars td a {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.calendars td a:hover {
|
||||
background: #e3f2fd;
|
||||
color: #1976d2;
|
||||
transform: scale(1.05);
|
||||
box-shadow: 0 2px 8px rgba(25, 118, 210, 0.2);
|
||||
}
|
||||
|
||||
/* Selected date */
|
||||
.calendars .calendars-selected a {
|
||||
background: linear-gradient(135deg, #4caf50, #66bb6a) !important;
|
||||
color: white !important;
|
||||
font-weight: 700;
|
||||
box-shadow: 0 4px 12px rgba(76, 175, 80, 0.3);
|
||||
}
|
||||
|
||||
/* Today */
|
||||
.calendars .calendars-today a {
|
||||
background: #fff3e0;
|
||||
color: #f57c00;
|
||||
border: 2px solid #ff9800;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.calendars .calendars-today a:hover {
|
||||
background: #ff9800;
|
||||
color: white;
|
||||
}
|
||||
|
||||
/* Weekend days */
|
||||
.calendars .calendars-weekend a {
|
||||
color: #f44336;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
/* Other month dates */
|
||||
.calendars .calendars-other-month span {
|
||||
color: #bdbdbd;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
/* Disabled dates */
|
||||
.calendars .calendars-disabled span {
|
||||
color: #e0e0e0 !important;
|
||||
cursor: not-allowed;
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
/* Control buttons footer */
|
||||
.calendars-commands {
|
||||
background: #f8f9fa;
|
||||
border-top: 1px solid #e9ecef;
|
||||
padding: 12px 16px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.calendars-cmd {
|
||||
background: #ffffff;
|
||||
border: 1px solid #dee2e6;
|
||||
color: #495057;
|
||||
padding: 6px 12px;
|
||||
border-radius: 4px;
|
||||
font-size: 12px;
|
||||
cursor: pointer;
|
||||
transition: all 0.2s ease;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.calendars-cmd:hover {
|
||||
background: #007bff;
|
||||
color: white;
|
||||
border-color: #007bff;
|
||||
transform: translateY(-1px);
|
||||
box-shadow: 0 2px 4px rgba(0, 123, 255, 0.2);
|
||||
}
|
||||
|
||||
/* RTL Support */
|
||||
.calendars.calendars-rtl {
|
||||
direction: rtl;
|
||||
}
|
||||
|
||||
.calendars.calendars-rtl .calendars-month-header {
|
||||
flex-direction: row-reverse;
|
||||
}
|
||||
|
||||
/* Responsive design */
|
||||
@media (max-width: 480px) {
|
||||
.calendars {
|
||||
min-width: 260px;
|
||||
}
|
||||
|
||||
.calendars td a,
|
||||
.calendars td span {
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
line-height: 32px;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.calendars-month-header {
|
||||
padding: 10px 12px;
|
||||
font-size: 13px;
|
||||
}
|
||||
}
|
||||
|
||||
/* Animation for popup appearance */
|
||||
@keyframes hijriSlideIn {
|
||||
from {
|
||||
opacity: 0;
|
||||
transform: translateY(-10px) scale(0.95);
|
||||
}
|
||||
to {
|
||||
opacity: 1;
|
||||
transform: translateY(0) scale(1);
|
||||
}
|
||||
}
|
||||
|
||||
.calendars-popup {
|
||||
animation: hijriSlideIn 0.2s ease-out;
|
||||
}
|
||||
|
||||
/* Special styling for Arabic numbers */
|
||||
.calendars.arabic-numbers {
|
||||
font-family: 'Arial Unicode MS', 'Tahoma', sans-serif;
|
||||
}
|
||||
|
||||
/* Status bar styling if enabled */
|
||||
.calendars-status {
|
||||
background: #343a40;
|
||||
color: white;
|
||||
padding: 8px 12px;
|
||||
font-size: 11px;
|
||||
text-align: center;
|
||||
border-top: 1px solid #495057;
|
||||
}
|
||||
|
||||
/* Multiple month display */
|
||||
.calendars-multi .calendars-month {
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
margin: 0 4px;
|
||||
}
|
||||
|
||||
/* Clear button special styling */
|
||||
.calendars-cmd.calendars-clear {
|
||||
color: #dc3545;
|
||||
border-color: #dc3545;
|
||||
}
|
||||
|
||||
.calendars-cmd.calendars-clear:hover {
|
||||
background: #dc3545;
|
||||
color: white;
|
||||
}
|
||||
|
|
@ -3,28 +3,21 @@
|
|||
<data>
|
||||
<template id="assets_backend" name="web_hijri_datepicker assets" inherit_id="web.assets_backend">
|
||||
<xpath expr="." position="inside">
|
||||
<!-- Modern Hijri Calendar CSS - Updated for better integration with Odoo -->
|
||||
<link rel="stylesheet" href="/web_hijri_datepicker/static/src/scss/hijri_modern.css"/>
|
||||
<link rel="stylesheet" href="/web_hijri_datepicker/static/lib/jquery.calendars.package-2.0.2/redmond.calendars.picker.css"/>
|
||||
<link rel="stylesheet" href="/web_hijri_datepicker/static/src/scss/web_hijri_date.scss"/>
|
||||
|
||||
<!-- Updated jQuery Calendars Library v2.2.0 -->
|
||||
<script type="text/javascript" src="/web_hijri_datepicker/static/lib/jquery.calendars.package-2.2.0/jquery.plugin.js"/>
|
||||
<script type="text/javascript" src="/web_hijri_datepicker/static/lib/jquery.calendars.package-2.2.0/jquery.calendars.js"/>
|
||||
<script type="text/javascript" src="/web_hijri_datepicker/static/lib/jquery.calendars.package-2.2.0/jquery.calendars.all.js"/>
|
||||
<script type="text/javascript" src="/web_hijri_datepicker/static/lib/jquery.calendars.package-2.2.0/jquery.calendars.plus.js"/>
|
||||
<script type="text/javascript" src="/web_hijri_datepicker/static/lib/jquery.calendars.package-2.2.0/jquery.calendars.picker.js"/>
|
||||
<script type="text/javascript" src="/web_hijri_datepicker/static/lib/jquery.calendars.package-2.2.0/jquery.calendars.islamic.js"/>
|
||||
<script type="text/javascript" src="/web_hijri_datepicker/static/lib/jquery.calendars.package-2.2.0/jquery.calendars.islamic-ar.js"/>
|
||||
<script type="text/javascript" src="/web_hijri_datepicker/static/lib/jquery.calendars.package-2.2.0/jquery.calendars.islamic-fa.js"/>
|
||||
|
||||
<!-- Updated Time Entry Library v2.0.1 -->
|
||||
<link rel="stylesheet" type="text/css" href="/web_hijri_datepicker/static/lib/jquery.timeentry.package-2.0.1/jquery.timeentry.css"/>
|
||||
<script type="text/javascript" src="/web_hijri_datepicker/static/lib/jquery.calendars.package-2.0.2/jquery.plugin.js"/>
|
||||
<script type="text/javascript" src="/web_hijri_datepicker/static/lib/jquery.calendars.package-2.0.2/jquery.calendars.js"/>
|
||||
<script type="text/javascript" src="/web_hijri_datepicker/static/lib/jquery.calendars.package-2.0.2/jquery.calendars.all.js"/>
|
||||
<script type="text/javascript" src="/web_hijri_datepicker/static/lib/jquery.calendars.package-2.0.2/jquery.calendars.plus.js"/>
|
||||
<script type="text/javascript" src="/web_hijri_datepicker/static/lib/jquery.calendars.package-2.0.2/jquery.calendars.picker.js"/>
|
||||
<script type="text/javascript" src="/web_hijri_datepicker/static/lib/jquery.calendars.package-2.0.2/jquery.calendars.islamic.js"/>
|
||||
<script type="text/javascript" src="/web_hijri_datepicker/static/lib/jquery.calendars.package-2.0.2/jquery.calendars.islamic-ar.js"/>
|
||||
<script type="text/javascript" src="/web_hijri_datepicker/static/lib/jquery.calendars.package-2.0.2/jquery.calendars.islamic-fa.js"/>
|
||||
<script type="text/javascript" src="/web_hijri_datepicker/static/src/js/web_hijri_date.js"/>
|
||||
<script type="text/javascript" src="/web_hijri_datepicker/static/lib/jquery.timeentry.package-2.0.1/jquery.plugin.js"/>
|
||||
<script type="text/javascript" src="/web_hijri_datepicker/static/lib/jquery.timeentry.package-2.0.1/jquery.timeentry.js"/>
|
||||
<script type="text/javascript" src="/web_hijri_datepicker/static/lib/jquery.timeentry.package-2.0.1/jquery.timeentry-ar.js"/>
|
||||
|
||||
<!-- Custom Hijri Integration Script -->
|
||||
<script type="text/javascript" src="/web_hijri_datepicker/static/src/js/web_hijri_date.js"/>
|
||||
</xpath>
|
||||
</template>
|
||||
</data>
|
||||
|
|
|
|||
Loading…
Reference in New Issue