مرحبًا ![]()
بدأت اليوم في تطبيق جامعي للمشكلات في منتدانا، وأود مشاركة مكون السمة البسيط للغاية الذي أنشأته.
في النهاية، سيظهر بهذا الشكل.
ما الذي تحتاجه
- جامع مشكلات Jira
- بعض المعرفة بـ JavaScript
الحصول على معرف جامع المشكلات
لكي يعمل الجامع، نحتاج إلى معرفه (ID).
انتقل إلى جامع المشكلات الذي تختاره واستخرج معلمة collectorId من عنوان URL
https://tosdr.atlassian.net/secure/ViewCollector!default.jspa?projectKey=BE&collectorId=176cb88e
في حالتي، هو 176cb88e
أنشئ مكون سمة جديدًا
واستخدم الكود التالي في قسم \u003c/head\u003e
استبدل المفاتيح التالية بقيمها
- MY_COLLECTOR_ID -\u003e
176cb88e - REPLACE_ME_AJAX -\u003e مصدر السكربت من قسم “تضمين جامع المشكلات هذا” -\u003e “تضمين في JavaScript” الخاص بجامع مشكلات Jira الخاص بك
- MY_PROJECT_KEY -\u003e بمفتاح مشروع جامع المشكلات الخاص بك، إذا كنت تنوي إدراج عدة جامعات للمشكلات.
\u003cscript type="text/discourse-plugin" version="0.8"\u003e
api.decorateCooked(() =\u003e {
window.ATL_JQ_PAGE_PROPS = $.extend(window.ATL_JQ_PAGE_PROPS, {
'MY_COLLECTOR_ID': {
"triggerFunction": function(showCollectorDialog) {
jQuery(document).on('click', "[data-wrap='jira-bug-MY_PROJECT_KEY'] \u003e p", function(e) {
e.preventDefault();
showCollectorDialog();
});
}
}
});
});
\u003c/script\u003e
\u003cscript\u003e
$(document).ready(function() {
jQuery.ajax({
url: "REPLACE_ME_AJAX",
type: "get",
cache: true,
dataType: "script"
});
});
\u003c/script\u003e
لقد أنشأت زرين CSS فقط لاحتياجاتي، فلا تتردد في إضافة المزيد
[data-wrap*="jira-bug-"] {
p {
border-radius: 2em;
\tbox-sizing: border-box;
\tdisplay: inline-flex;
\talign-items: center;
\tjustify-content: center;
\tmargin: 0;
\tpadding: 0.53em 0.8em;
\tborder: none;
\tfont-weight: normal;
\tmargin: 1px;
\tfont-size: var(--font-0);
\tline-height: normal;
\tcolor: var(--primary-low);
\tbackground: var(--danger);
\tcursor: pointer;
\ttransition: all 0.25s;
}
p:hover {
\tcolor: #000;
\tbackground: #fff;
\tborder-color: #0060df;
}
}
[data-wrap*="jira-feature"] {
p {
border-radius: 2em;
\tbox-sizing: border-box;
\tdisplay: inline-flex;
\talign-items: center;
\tjustify-content: center;
\tmargin: 0;
\tpadding: 0.53em 0.8em;
\tborder: none;
\tmargin: 1px;
\tfont-weight: normal;
\tfont-size: var(--font-0);
\tline-height: normal;
\tcolor: var(--secondary-low);
\tbackground: var(--success-medium);
\tcursor: pointer;
\ttransition: all 0.25s;
}
p:hover {
\tcolor: #000;
\tbackground: #fff;
\tborder-color: #0060df;
}
}
الآن، الانتقال إلى تضمين جامع المشكلات في المنشورات:
[wrap=jira-bug-MY_PROJECT_KEY]
:bug: الإبلاغ عن خلل
[/wrap]
[wrap=jira-feature-MY_PROJECT_KEY]
:bulb: اقتراح ميزة
[/wrap]
هذا كل شيء! الآن أصبح لديك جامع مشكلات يعمل كزر في منشورك!

