{"remainingRequest":"/Users/shuguang/Desktop/毕设/CodeMaster/CodeMaster/node_modules/vue-loader/lib/index.js??vue-loader-options!/Users/shuguang/Desktop/毕设/CodeMaster/CodeMaster/src/components/edit/tinymce.vue?vue&type=style&index=0&id=7065ee9a&scoped=true&lang=css","dependencies":[{"path":"/Users/shuguang/Desktop/毕设/CodeMaster/CodeMaster/src/components/edit/tinymce.vue","mtime":1742646402768},{"path":"/Users/shuguang/Desktop/毕设/CodeMaster/CodeMaster/node_modules/css-loader/dist/cjs.js","mtime":1743264596127},{"path":"/Users/shuguang/Desktop/毕设/CodeMaster/CodeMaster/node_modules/vue-loader/lib/loaders/stylePostLoader.js","mtime":1743264597030},{"path":"/Users/shuguang/Desktop/毕设/CodeMaster/CodeMaster/node_modules/postcss-loader/src/index.js","mtime":1743264596321},{"path":"/Users/shuguang/Desktop/毕设/CodeMaster/CodeMaster/node_modules/cache-loader/dist/cjs.js","mtime":1743264595665},{"path":"/Users/shuguang/Desktop/毕设/CodeMaster/CodeMaster/node_modules/vue-loader/lib/index.js","mtime":1743264596512}],"contextDependencies":[],"result":[{"type":"Buffer","data":"base64:Ci50aW55bWNlLWVkaXRvcnsKCWRpc3BsYXk6IGZsZXg7CglmbGV4LWRpcmVjdGlvbjogY29sdW1uOwoJanVzdGlmeS1jb250ZW50OiBjZW50ZXI7CglhbGlnbi1pdGVtczogY2VudGVyOwp9Cg=="},{"version":3,"sources":["tinymce.vue"],"names":[],"mappings":";AAwQA;AACA;AACA;AACA;AACA;AACA","file":"tinymce.vue","sourceRoot":"src/components/edit","sourcesContent":["<template>\n\t<div class=\"tinymce-editor\">\n\t\t<a-input v-model=\"ArticleTitle\" placeholder=\"请输入文字标题\" />\n\t\t<a-textarea\n      v-model=\"briefContent\"\n      placeholder=\"请输入文章简介\"\n      :auto-size=\"{ minRows: 2, maxRows: 5 }\"\n    />\n\t<a-form-item style=\"width: 100%\" label=\"选择比赛与类型:\">\n  <a-select\n    v-model=\"competitionId\"\n    style=\"width: 100%\"\n    :options=\"grades\"\n    allowClear\n    :placeholder=\"请选择相关比赛\"\n  />\n\t<a-select\n    v-model=\"articleType\"\n    style=\"width: 100%\"\n    :options=\"message\"\n    allowClear\n    :placeholder=\"选择类型\"\n  />\n</a-form-item>\n\n\n\n    \n\t\t<Editor\n\t\t\t\t\t\t\t:id=\"tinymceId\"\n\t\t\t\t\t\t\t:init=\"init\"\n\t\t\t\t\t\t\t:disabled=\"disabled\"\n\t\t\t\t\t\t\tv-model=\"myValue\"\n\t\t\t\t\t\t\t@onClick=\"onClick\"\n\t\t\t></Editor>\n\t\t\t<a-button type=\"primary\" @click=\"SendTinymce\">发布文章</a-button>\n\t</div>\n</template>\n<script>\n  import {message} from \"@/utils/const\";\nimport {createArticle,AllCompetition,SendSMS,SendEmail,AllArticle} from \"@/api\"\nimport tinymce from 'tinymce/tinymce' //tinymce默认hidden，不引入不显示\nimport Editor from '@tinymce/tinymce-vue'//编辑器引入\nimport 'tinymce/themes/silver/theme'//编辑器主题\nimport 'tinymce/icons/default'  //引入编辑器图标icon，不引入则不显示对应图标\n// 引入编辑器插件（基本免费插件都在这儿了）\nimport 'tinymce/plugins/advlist'  //高级列表\nimport 'tinymce/plugins/autolink'  //自动链接\nimport 'tinymce/plugins/link'  //超链接\nimport 'tinymce/plugins/image'  //插入编辑图片\nimport 'tinymce/plugins/lists' //列表插件\nimport 'tinymce/plugins/charmap'  //特殊字符\nimport 'tinymce/plugins/media' //插入编辑媒体\nimport 'tinymce/plugins/wordcount'// 字数统计\n//   import Cookies from \"js-cookie\";\n\nconst fonts = [\n\t\"宋体=宋体\",\n\t\"微软雅黑=微软雅黑\",\n\t\"新宋体=新宋体\",\n\t\"黑体=黑体\",\n\t\"楷体=楷体\",\n\t\"隶书=隶书\",\n\t\"Courier New=courier new,courier\",\n\t\"AkrutiKndPadmini=Akpdmi-n\",\n\t\"Andale Mono=andale mono,times\",\n\t\"Arial=arial,helvetica,sans-serif\",\n\t\"Arial Black=arial black,avant garde\",\n\t\"Book Antiqua=book antiqua,palatino\",\n\t\"Comic Sans MS=comic sans ms,sans-serif\",\n\t\"Courier New=courier new,courier\",\n\t\"Georgia=georgia,palatino\",\n\t\"Helvetica=helvetica\",\n\t\"Impact=impact,chicago\",\n\t\"Symbol=symbol\",\n\t\"Tahoma=tahoma,arial,helvetica,sans-serif\",\n\t\"Terminal=terminal,monaco\",\n\t\"Times New Roman=times new roman,times\",\n\t\"Trebuchet MS=trebuchet ms,geneva\",\n\t\"Verdana=verdana,geneva\",\n\t\"Webdings=webdings\",\n\t\"Wingdings=wingdings,zapf dingbats\"\n];\nexport default {\n\tcomponents: {\n\t\tEditor\n\t},\n\tprops: {\n\t\t//内容\n\t\tvalue: {\n\t\t\ttype: String,\n\t\t\tdefault: ''\n\t\t},\n\t\t//是否禁用\n\t\tdisabled: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false\n\t\t},\n\t\t// 用于区分单个tinymce\n\t tinymceId: {\n\t\ttype: String,\n\t\tdefault: \"tinymce\"\n\t},\n\t\t//插件\n\t\tplugins: {\n\t\t\ttype: [String, Array],\n\t\t\tdefault: 'advlist autolink link image lists charmap  media wordcount'\n\t\t},\n\t\t//工具栏\n\t\ttoolbar: {\n\t\t\ttype: [String, Array],\n\t\t\tdefault: 'undo redo |  formatselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | lists image media table'\n\t\t}\n\t},\n\tdata() {\n\t\treturn {\n\t\t\tmessage,\n\t\t\t//初始化配置\n\t\t\tgrades:[],\n\t\t\tmyValue :this.value,\n\t\t\tArticleTitle:\"\",\n\t\t\tcompetitionId:\"\",\n\t\t\tarticleType:\"\",\n\t\t\tbriefContent:\"\",\n\t\t\tinit: {\n\t\t\t\tselector: '#' + this.tinymceId,\n\t\t\t\tlanguage_url: '@/components/edit/zh_CN.js',//汉化路径是自定义的，一般放在public或static里面\n\t\t\t\tlanguage: 'zh_CN',\n\t\t\t\tskin_url: '/tinymce/skins/ui/oxide',//皮肤\n\t\t\t\tplugins: this.plugins,//插件\n\t\t\t\t//工具栏\n\t\t\t\ttoolbar: this.toolbar,\n\t\t\t\ttoolbar_location: '/',\n\t\t\t\tfontsize_formats: '12px 14px 16px 18px 20px 22px 24px 28px 32px 36px 48px 56px 72px',  //字体大小\n\t\t\t\tfont_formats: fonts.join(\";\"),\n\t\t\t\tcontent_style: \"p {margin: 0px; border:0px ; padding: 0px}\",  // 设置p的行间距\n\t\t\t\twidth: \"100%\",\n\t\t\t\t// height: 500,//高度\n\t\t\t\tplaceholder: '在这里输入文字',\n\n\t\t\t\tbranding: false,//隐藏右下角技术支持\n\t\t\t\t//图片上传\n\t\t\t},\n\t\t\tArticleId:\"\",\n\t\t\tArticle:{},\n\t\t}\n\t},\n\twatch: {\n\t\t//监听内容变化\n\t\tvalue(newValue) {\n\t\t\tthis.myValue = (newValue == null ? '' : newValue)\n\t\t},\n\t\tmyValue (newValue) {\n\t\t\tif(this.triggerChange){\n\t\t\t\tthis.$emit('change', newValue)\n\t\t\t}else{\n\t\t\t\tthis.$emit('input', newValue)\n\t\t\t}\n\t\t}\n\t},\n\tmounted () {\n\t\ttinymce.init({})\n\t\t// console.log(this.toolbar,'======')\n\t\tthis.GetAritle()\n\t\tAllCompetition().then(response => {\n  // 获取竞赛数据\n  const competitions = response.data;\n\n  // 转换数据为适合select选项的格式\n  const selectOptions = competitions.map(competition => ({\n    label: competition.competitionName,\n    value: competition.competitionId\n  }));\n  // 将转换后的数据存储在Vue实例中，以便在模板中使用\n  this.grades = selectOptions;\n}).catch(error => {\n  console.error(error);\n});\n\n\t},\n\tmethods: {\n\t\tGetAritle(){\n\t\t\tconsole.log(this.ArticleId)\n\t\t\tif(this.ArticleId!=''||null){\n\t\t\t\tAllArticle().then((res) =>{\n\t\t\t\tres.data.forEach(item=>{\n\t\t\t\t\tconsole.log(item)\n\t\t\t\t\tif(item.articleId==this.ArticleId){\n\t\t\t\t\t\tconsole.log(item)\n\t\t\t\t\tthis.competitionId=item.competitionId\n          this.ArticleTitle = item.articleTitle,\n\t\t\t\t\tthis.myValue=item.articleContent,\n\t\t\t\t\tthis.articleType=item.articleType,\n\t\t\t\t\tthis.briefContent=item.briefContent\n\t\t\t\t\t}\n\t\t\t\t})\n\t\t\t\t})\n\t\t\t}\n\t\t},\n\t\tonClick(e) {\n\t\t\tthis.$emit('onClick', e, tinymce)\n\t\t},\n\t\t//可以添加一些自己的自定义事件，如清空内容\n\t\tclear() {\n\t\t\tthis.myValue = ''\n\t\t},\n\t\tSendTinymce() {\n  const data = {\n    userId: this.$store.state.user.userId,\n\t\tbriefContent:this.briefContent,\n    competitionId: this.competitionId,\n    articleType: this.articleType,\n    articleTitle: this.ArticleTitle,\n    articleContent: this.myValue\n  };\n\n  createArticle(data)\n    .then(res => {\n      if (res.code == 200) {\n        this.$message.success('发送成功');\n\t\t\t\tthis.articleId=res.data\n        if (this.articleType == '公告') {\n\t\t\t\t\t// 询问是否进行短信和邮件通知\n\t\t\t\t\tthis.$modal.confirm({\n        title: `确认发送短信与邮件通知用户?`,\n        onOk: () => {\n\t\t\t\t\tlet data={\n\t\t\t\t\t\tcompetitionId:this.competitionId,\n\t\t\t\t\t\tarticleId:this.articleId\n\t\t\t\t\t}\n\t\t\t\t\tthis.$api.SendEmail(data).then(() => {\n\t\t\t\t\t\tthis.$api.SendSMS(data).then(() => {\n\t\t\t\t\t\t\tthis.$message.success('短信邮件提醒成功!');\n\t\t\t\t\t\t})\n        }).catch(e => {\n          this.$message.error(e.msg || '发送失败!');\n          throw e;\n        })\n\t\t\t\t}\n      });\n        }\n      } else {\n        throw new Error(\"发布失败\");\n      }\n    })\n    .then(notificationData => {\n      if (notificationData) {\n        return SendEmail(notificationData)\n          .then(() => SendSMS(notificationData))\n          .then(() => {\n            this.$message.success(\"短信提醒与邮件提醒成功\");\n          });\n      }\n    })\n    .catch(error => {\n      console.error(error);\n      this.$notify.error({ title: '错误', message: error.message });\n    });\n}\n\n\t}\n}\n</script>\n<style scoped>\n.tinymce-editor{\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: center;\n\talign-items: center;\n}\n</style>\n"]}]}