// ==UserScript==
// @name         油猴中文网的自动回复
// @namespace    http://tampermonkey.net/
// @version      0.2
// @description  针对油猴中文网的自动回复，自动回复的内容大家可以在脚本数组里面自行添加。
// @author       xiaofeiwu
// @match        https://bbs.tampermonkey.net.cn/*
// @icon         https://www.google.com/s2/favicons?domain=tampermonkey.net.cn
// @require      https://cdn.jsdelivr.net/npm/vue@next
// @grant        unsafeWindow
// @run-at document-start
// @grant        GM_addStyle
// @license MIT
// ==/UserScript==


unsafeWindow.Vue = Vue;
window.onload=()=>{
let text=`<div id="app">
       <button @click="replay" class="replayBtn">自动回复</button>
       <div v-for="(item,index) in  content" :key="index" class="default" @click="getContent">{{item}}</div>
    </div>`

var el=document.createElement('div')
el.innerHTML=text;
var divPosition = document.querySelector('.kmstt'); //搜寻元素
divPosition.insertAdjacentHTML('afterend',`${text}`);
document.body.append(el)
      const App = {
        data() {
          return {
            content: ["ggnb666!!!","你是我的心你是我的肝你是我生命四分之三"],
            selectContent:"山东曹县牛皮666我的宝贝",
          };
        },
        methods: {
            // 这里注意一下this的指向,注意一下就行。最好直接把里面写成箭头函数
            // onload是回调函数，指向的应该是关于xhr的东西
            replay:()=>{
                document.querySelector('#fastpostmessage').value = "山东曹县牛皮666我的宝贝";
                document.querySelector('#fastpostrefresh').checked = true
                document.querySelector('#fastpostsubmit').click()
            },
            getContent:(e)=>{
                console.log(this)
               console.log(this.selectContent)
               e.target.className = "active";
                this.selectContent = e.target.innerText;
                console.log(this.selectContent)
                document.querySelector('#fastpostmessage').value = this.selectContent;
                document.querySelector('#fastpostrefresh').checked = true
                document.querySelector('#fastpostsubmit').click()
            }
        }
      };
      const app = Vue.createApp(App);
      app.mount("#app");
}

GM_addStyle(`
  #app {
     margin-top: 10px;
  }
  .replayBtn {
     background: #ff8838;
   }
  .default {
     background-color: white;
   }

   .active {
     background-color: #ff8838;
    }


`)