README

基于 Vue2 的 Yii2 框架页面评估（调查）模块。

语言: 英文, 俄语

流畅视图

静态视图（嵌入页面）

安装

只需运行

composer require onmotion/yii2-page-assessments

或添加

"onmotion/yii2-page-assessments": "*"

到您的 composer.json 文件的 require 部分中。

应用迁移

php yii migrate --migrationPath=@vendor/onmotion/yii2-page-assessments/migrations

使用方法

您必须在您的配置中添加

'modules' => [
    //...
    'assessments' => [
        'class' => 'onmotion\assessments\Module',
    ],
    //...
],

然后您可以在页面的任何位置使用小部件

示例

echo \onmotion\assessments\widget\AssessmentWidget::widget([
    'fluent' => false, // static or fluent view
   // 'timeout' => 1500 // timeout bafore appearance.
    'questions' => [
        'Is this page helpful?', // simple question
        [
            'title' => 'What do you think about it?',
            'maxValue' => 6, 
          //  'allowComment' => true // allow optional comment
            'allowComment' => [1, 2, 3], // allow comment only if value is 1, 2 or 3.
          //  'model' => (new SomeActiveRecordModel),
          //  'repeat' => true, // whether to force repeat the question
          //  'afterVoteText' => [  // show comment after got a vote (string || array)
          //                    1 => 'It\'s ok! 👌',
          //                    2 => 'Could be better 😎',
          //                    3 => 'So so...',
          //                    4 => 'Very good!',
          //                    5 => 'Perfect!',
          //                ]
        ]
    ]
]);

选项

事件

assessment.show - 当评估项出现时。

assessment.end - 当所有问题都完成时。

document.addEventListener('assessment.show', function (e) {
    console.log(e.detail);
}, false);

您可以随意更改图标，例如

echo \onmotion\assessments\widget\AssessmentWidget::widget([
            'fluent' => true,
            'questions' => $questions,
            'icons' => [
                    1 => '<span class="assessment-icon"><span class="assessment-icon__angry"></span></span>',
                    2 => '<span class="assessment-icon"><span class="assessment-icon__sad"></span></span>',
                    3 => '<span class="assessment-icon"><span class="assessment-icon__thinking"></span></span>',
                    4 => '<span class="assessment-icon"><span class="assessment-icon__happy"></span></span>',
                    5 => '<span class="assessment-icon"><span class="assessment-icon__in-love"></span></span>',
            ]
        ]);