CocosPlugin/cc-inspector-chrome
1
0
Fork 0
mirror of https://github.com/tidys/cc-inspector-chrome synced 2025-10-28 06:45:24 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

改造成ts

Browse Source
This commit is contained in:
xuyanfeng
2021-04-01 17:47:56 +08:00
parent fafe320805
commit 38c74e44d6
15 changed files with 6470 additions and 5692 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
CocosCreatorInspector/src/popup/index.js → CocosCreatorInspector/src/popup/index.ts
View File

@@ -1,10 +1,10 @@
import Vue from 'vue';
import index from './index.vue';
import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'
Vue.use(ElementUI);
import index from './index.vue';
new Vue({
el: '#app',
render: h => h(index)

132
CocosCreatorInspector/src/popup/index.vue
View File

@@ -1,7 +1,7 @@
<template>
<div style="width: auto;">
<div id="popup">
<div style="display: flex;flex-direction: row;align-items: center;">
<h3>{{title}}</h3>
<h3 v-show="false"> title </h3>
<div style="flex: 1"></div>
<el-button size="mini" @click="onClickOptions">设置</el-button>
<el-button size="mini" @click="onMsgToBg">To-Bg</el-button>
@@ -21,79 +21,97 @@
<span style="font-size: 14px;float: left;text-align: center;line-height: 30px;color: #6d6d6d;">联系方式:</span>
<div style="height: 100%;float: right;margin-right: 10px;">
<a href="https://github.com/tidys/CocosCreatorPlugins/tree/master/CocosCreatorInspector" target="_blank">
<img src="./res/github.png" style="height: 100%;">
<img v-show="false" src="./res/github.png" style="height: 100%;">
</a>
</div>
<div style="height: 100%;float: right;margin-right: 10px;">
<a href="https://jq.qq.com/?_wv=1027&k=5SdPdy2" target="_blank">
<img src="./res/qq.png" style="height: 100%;">
<img v-show="false" src="./res/qq.png" style="height: 100%;">
</a>
</div>
<div style="height: 100%;float: right;margin-right: 10px;">
<a href="http://forum.cocos.com/t/chrome-creator/55669" target="_blank">
<img src="./res/tiezi.png" style="height: 100%;">
<img v-show="false" src="./res/tiezi.png" style="height: 100%;">
</a>
</div>
</div>
</div>
</template>
<script>
import Vue from 'vue'
import 'vue-awesome/icons/flag'
import 'vue-awesome/icons'
import Icon from 'vue-awesome/components/Icon'
<script lang="ts">
import Vue from 'vue'
import 'vue-awesome/icons/flag'
import 'vue-awesome/icons'
import Icon from 'vue-awesome/components/Icon'
import {Component} from 'vue-property-decorator'
import chrome from 'chrome'
import {Button} from 'element-ui'
Vue.component('icon', Icon);
export default {
data() {
return {
title: "cc-inspector",
isShowMoneyPng: true,
}
},
created() {
this._initLongConn();
},
methods: {
onBtnClickGitHub() {
console.log("onBtnClickGitHub");
},
onClickOptions() {
chrome.tabs.create({url: 'pages/options.html'})
},
_initLongConn() {
if (!this.longConn) {
console.log("[popup] 初始化长连接");
this.longConn = chrome.runtime.connect({name: "popup"});
this.longConn.onMessage.addListener(function (data, sender) {
this._onLongConnMsg(data, sender);
}.bind(this))
}
},
_onLongConnMsg(data, sender) {
console.log(this.title);
},
onMsgToBg() {
// 因为webpack的原因,这种方式可能拿不到里面的function, var
// chrome.extension.getBackgroundPage();
// 发送消息到background.js
chrome.runtime.sendMessage('content msg', function (data) {
console.log(data);
});
},
onSendMsg() {
if (this.longConn) {
this.longConn.postMessage({send: "hello"});
}
},
},
@Component({
components: {
Icon,
Button,
}
})
export default class Index extends Vue {
longConn: chrome.runtime.Port = false
// data() {
// return {
// title: "cc-inspector",
// isShowMoneyPng: true,
// }
// }
//
// created() {
// this._initLongConn();
// }
//
// onBtnClickGitHub() {
// console.log("onBtnClickGitHub");
// }
//
// onClickOptions() {
// chrome.tabs.create({url: 'pages/options.html'})
// }
//
// _initLongConn() {
// if (!this.longConn) {
// console.log("[popup] 初始化长连接");
// this.longConn = chrome.runtime.connect({name: "popup"});
// this.longConn.onMessage.addListener(function (data, sender) {
// this._onLongConnMsg(data, sender);
// }.bind(this))
// }
// }
//
// _onLongConnMsg(data, sender) {
// // console.log(this.title);
// }
//
// onMsgToBg() {
// // 因为webpack的原因,这种方式可能拿不到里面的function, var
// // chrome.extension.getBackgroundPage();
//
// // 发送消息到background.js
// chrome.runtime.sendMessage('content msg', function (data) {
// console.log(data);
// });
// }
//
// onSendMsg() {
// if (this.longConn) {
// this.longConn.postMessage({send: "hello"});
// //@import "../index.less";
// //#popup{
// // width: auto;
// //}
// }
// }
}
</script>
<style scoped>
<style scoped lang="less">
</style>