ম্যাজেন্টো 2 - ডেটটাইম ইউআই উপাদানটি কীভাবে যুক্ত করবেন

Question

নতুন পৃষ্ঠা যুক্ত করার সময় আমি সিএমএস পৃষ্ঠা বিভাগে ডেটটাইম হিসাবে নতুন ক্ষেত্র যুক্ত করতে চাই, আমি খুঁজে পেয়েছি যে ম্যাজেন্টো এটির জন্য ইউআই কম্পোনেন্ট ব্যবহার করছে, তাই খনন করার পরে আমি নীচের কোড ব্যবহার করে তারিখের ক্ষেত্রটি যুক্ত করতে সক্ষম হয়েছি কিন্তু তারিখের সময় ক্ষেত্রটি যুক্ত করতে সক্ষম নই। এতে কেউ সাহায্য করতে পারে?

তারিখ ক্ষেত্র যুক্ত করার জন্য কোড:

<field name="start_date">
    <argument name="data" xsi:type="array">
        <item name="config" xsi:type="array">
            <item name="dataType" xsi:type="string">string</item>
            <item name="label" xsi:type="string" translate="true">Go Live Start Date</item>
            <item name="formElement" xsi:type="string">date</item>
            <item name="source" xsi:type="string">page</item>
            <item name="sortOrder" xsi:type="number">21</item>
            <item name="dataScope" xsi:type="string">start_date</item>
            <item name="validation" xsi:type="array">
                <item name="required-entry" xsi:type="boolean">true</item>
            </item>
        </item>
    </argument>
</field>

ফাইলটি অর্জনের জন্য আমাদের ওভাররাইড করতে হবে:

vendor/magento/module-cms/view/adminhtml/ui_component/cms_block_form.xml

Comments

@ সিভাকুমার আমার উত্তর আপনাকে সাহায্য করেছে কিনা?

— সিয়ারে উখুলেবাউ

হ্যাঁ @ সিয়ারে উচুখলেবাউ, এটি প্রচুর সাহায্য করেছে।

— MagentoDev

ম্যাজেন্টো 2

— তেজা ভগবান কোলপাড়ার

@ তেজাবাগাবনকলেপাড়া 4 মাস আগে জিজ্ঞাসিত প্রশ্নটির নকল হিসাবে আপনি 9 মাস আগে জিজ্ঞাসিত প্রশ্নটিকে কেন চিহ্নিত করেন ?!

— সিয়ারে উখুলেবাউ

Answer 1

ডেটটাইম চয়নকারী যুক্ত করতে আপনার পরবর্তী নির্দেশিকাটি এক্সএমএল ফাইলের মধ্যে ব্যবহার করা উচিত:

<field name="start_date">
    <argument name="data" xsi:type="array">
        <item name="config" xsi:type="array">
            <item name="dataType" xsi:type="string">string</item>
            <item name="label" xsi:type="string" translate="true">Go Live Start Date</item>
            <item name="formElement" xsi:type="string">date</item>
            <item name="source" xsi:type="string">page</item>
            <item name="sortOrder" xsi:type="number">21</item>
            <item name="dataScope" xsi:type="string">start_date</item>
            <item name="validation" xsi:type="array">
                <item name="required-entry" xsi:type="boolean">true</item>
            </item>
            <item name="options" xsi:type="array">
                <item name="dateFormat" xsi:type="string">yyyy-MM-dd</item>
                <item name="timeFormat" xsi:type="string">HH:mm:ss</item>
                <item name="showsTime" xsi:type="boolean">true</item>
            </item>
        </item>
    </argument>
</field>

গুরুত্বপূর্ণ জিনিস showsTimeবিকল্প হয়।

ফলাফলটি এর মতো দেখতে হবে:

আপনি যদি ইউআই উপাদানটি ডিবাগ করতে চান - ব্রাউজার কনসোলের ভিতরে এই কমান্ডটি ব্যবহার করুন (আপনার পৃষ্ঠায়):

require('uiRegistry').get('index = start_date')

এটি dateসমস্ত প্রাথমিক বিকল্প এবং সমস্ত সম্ভাব্য ফাংশন সহ আপনার উপাদানটি ফেরত দেয়:

আপনি যখন উপাদানটি নির্ধারণ করবেন তখন (এক্সএমএলের অভ্যন্তরে) আপনি সেগুলি ব্যবহার করতে পারেন।

অতিরিক্ত তথ্য হিসাবে:

date(এছাড়াও dateTime) উপাদান এখানে পাওয়া যেতে পারে:

app/code/Magento/Ui/view/base/web/js/form/element/date.js

স্থির ফাইলগুলিতে:

pub/static/adminhtml/Magento/backend/en_US/Magento_Ui/js/form/element/date.js

তারিখ-উপাদান শ্রেণীর (অবজেক্ট) পদ্ধতি রয়েছে prepareDateTimeFormats, যেখানে গুরুত্বপূর্ণ বিকল্পটি showsTimeপরীক্ষা করা হয়:

/**
 * Prepares and converts all date/time formats to be compatible
 * with moment.js library.
 */
prepareDateTimeFormats: function () {
    this.pickerDateTimeFormat = this.options.dateFormat;

    if (this.options.showsTime) {
        this.pickerDateTimeFormat += ' ' + this.options.timeFormat;
    }

    this.pickerDateTimeFormat = utils.normalizeDate(this.pickerDateTimeFormat);

    if (this.dateFormat) {
        this.inputDateFormat = this.dateFormat;
    }

    this.inputDateFormat = utils.normalizeDate(this.inputDateFormat);
    this.outputDateFormat = utils.normalizeDate(this.outputDateFormat);

    this.validationParams.dateFormat = this.outputDateFormat;
}

Comments

আমি যদি কেবল সময় বাছাইকারীকে দেখাতে চাই তবে কী হবে? @ সিয়ারে

— রোনাক চৌহান

@ রোনাকচাউহান আপনার আরও একটি কাস্টম উপাদান দরকার কারণ DateTimeউপাদানটি সর্বদা তারিখ দেয়।

— সিয়ারে উখুলেবাউ

কিন্তু কিভাবে যে কি?

— রোনাক চৌহান

@ রোনাকচাউহান আপনার বিমূর্ত ইউআই-উপাদানটি প্রসারিত করা উচিত এবং এর মতো কিছু ব্যবহার করা উচিত.timepicker()

— সিয়ারে উখখলেবাউ

নিজে নিজেই সমাধান খুঁজে আপনার উত্তর টি ভুল timeFormat , আমরা পরিবর্তনের প্রয়োজন hh:mm:ssথেকে HH:mm:ss, UI 'তে Componet অন্যথায় 03:00:00 PMওঠে হবে 03:00:00 AM, 12 ঘন্টা অভাব এবং আপনি যা করতে পারেন প্রধানমন্ত্রীর সময় সংরক্ষণ করা ডাটাবেস সারণিতে।

— কী শ্যাং

Answer 2

আমি আশা করি এই উত্তরটি আপনি কী মিস করছেন সে সম্পর্কে কিছু ধারণা দেয়

আমি পিএইচপি এর মাধ্যমে তারিখের সময় ক্ষেত্রের ইউআই উপাদান যুক্ত করেছি (এটি ভাল কাজ করে)

$fieldset->addField(
        'event_date',
        'date',
        [
            'name' => 'event_date',
            'label' => __('Date'),
            'title' => __('Date'),
            'required' => true,
            'date_format' => 'yyyy-MM-dd',
            'time_format' => 'hh:mm:ss'
        ]
);

আপনার XML ফাইল সব মান ব্যতীত উপস্থিত তুলনা DATE_FORMAT এবং time_format যাতে আপনি আপনার XML ফাইল উভয় মান সেট করার চেষ্টা করতে পারেন

আরও বিশদের জন্য দয়া করে এই সম্পূর্ণ উত্স কোডটি দেখুন

Comments

আপনি কি "বিক্রেতা / ম্যাজেন্টো / মডিউল-সিমিএস / ভিউ / অ্যাডমিনটিটিএমএল / ইউআই_কম্পোনেন্ট / সিএমএস_ব্লক_ফর্ম.এক্সএমএল" ফাইলটির মধ্য দিয়ে যেতে পারেন এবং কীভাবে আমি উপরের কোডটি সংহত করতে পারি তা আমাকে জানতে দিন।

— ম্যাজেন্টোদেভ

আমি কীভাবে sourceআমার কাস্টম নামে পরিবর্তন করতে পারি? এখানে কি প্রয়োজনীয়তা আছে?

— ভাসিলি বুড়ালাকু