1 | <template>
|
2 | <footer class="page-edit">
|
3 | <div
|
4 | v-if="editLink"
|
5 | class="edit-link"
|
6 | >
|
7 | <a
|
8 | :href="editLink"
|
9 | target="_blank"
|
10 | rel="noopener noreferrer"
|
11 | >{{ editLinkText }}</a>
|
12 | <OutboundLink />
|
13 | </div>
|
14 |
|
15 | <div
|
16 | v-if="lastUpdated"
|
17 | class="last-updated"
|
18 | >
|
19 | <span class="prefix">{{ lastUpdatedText }}:</span>
|
20 | <span class="time">{{ lastUpdated }}</span>
|
21 | </div>
|
22 | </footer>
|
23 | </template>
|
24 |
|
25 | <script>
|
26 | import isNil from 'lodash/isNil'
|
27 | import { endingSlashRE, outboundRE } from '../util'
|
28 |
|
29 | export default {
|
30 | name: 'PageEdit',
|
31 |
|
32 | computed: {
|
33 | lastUpdated () {
|
34 | return this.$page.lastUpdated
|
35 | },
|
36 |
|
37 | lastUpdatedText () {
|
38 | if (typeof this.$themeLocaleConfig.lastUpdated === 'string') {
|
39 | return this.$themeLocaleConfig.lastUpdated
|
40 | }
|
41 | if (typeof this.$site.themeConfig.lastUpdated === 'string') {
|
42 | return this.$site.themeConfig.lastUpdated
|
43 | }
|
44 | return 'Last Updated'
|
45 | },
|
46 |
|
47 | editLink () {
|
48 | const showEditLink = isNil(this.$page.frontmatter.editLink)
|
49 | ? this.$site.themeConfig.editLinks
|
50 | : this.$page.frontmatter.editLink
|
51 |
|
52 | const {
|
53 | repo,
|
54 | docsDir = '',
|
55 | docsBranch = 'master',
|
56 | docsRepo = repo
|
57 | } = this.$site.themeConfig
|
58 |
|
59 | if (showEditLink && docsRepo && this.$page.relativePath) {
|
60 | return this.createEditLink(
|
61 | repo,
|
62 | docsRepo,
|
63 | docsDir,
|
64 | docsBranch,
|
65 | this.$page.relativePath
|
66 | )
|
67 | }
|
68 | return null
|
69 | },
|
70 |
|
71 | editLinkText () {
|
72 | return (
|
73 | this.$themeLocaleConfig.editLinkText
|
74 | || this.$site.themeConfig.editLinkText
|
75 | || `Edit this page`
|
76 | )
|
77 | }
|
78 | },
|
79 |
|
80 | methods: {
|
81 | createEditLink (repo, docsRepo, docsDir, docsBranch, path) {
|
82 | const bitbucket = /bitbucket.org/
|
83 | if (bitbucket.test(docsRepo)) {
|
84 | const base = docsRepo
|
85 | return (
|
86 | base.replace(endingSlashRE, '')
|
87 | + `/src`
|
88 | + `/${docsBranch}/`
|
89 | + (docsDir ? docsDir.replace(endingSlashRE, '') + '/' : '')
|
90 | + path
|
91 | + `?mode=edit&spa=0&at=${docsBranch}&fileviewer=file-view-default`
|
92 | )
|
93 | }
|
94 |
|
95 | const gitlab = /gitlab.com/
|
96 | if (gitlab.test(docsRepo)) {
|
97 | const base = docsRepo
|
98 | return (
|
99 | base.replace(endingSlashRE, '')
|
100 | + `/-/edit`
|
101 | + `/${docsBranch}/`
|
102 | + (docsDir ? docsDir.replace(endingSlashRE, '') + '/' : '')
|
103 | + path
|
104 | )
|
105 | }
|
106 |
|
107 | const base = outboundRE.test(docsRepo)
|
108 | ? docsRepo
|
109 | : `https://github.com/${docsRepo}`
|
110 | return (
|
111 | base.replace(endingSlashRE, '')
|
112 | + '/edit'
|
113 | + `/${docsBranch}/`
|
114 | + (docsDir ? docsDir.replace(endingSlashRE, '') + '/' : '')
|
115 | + path
|
116 | )
|
117 | }
|
118 | }
|
119 | }
|
120 | </script>
|
121 |
|
122 | <style lang="stylus">
|
123 | @require '../styles/wrapper.styl'
|
124 |
|
125 | .page-edit
|
126 | @extend $wrapper
|
127 | padding-top 1rem
|
128 | padding-bottom 1rem
|
129 | overflow auto
|
130 |
|
131 | .edit-link
|
132 | display inline-block
|
133 | a
|
134 | color lighten($textColor, 25%)
|
135 | margin-right 0.25rem
|
136 | .last-updated
|
137 | float right
|
138 | font-size 0.9em
|
139 | .prefix
|
140 | font-weight 500
|
141 | color lighten($textColor, 25%)
|
142 | .time
|
143 | font-weight 400
|
144 | color #767676
|
145 |
|
146 | @media (max-width: $MQMobile)
|
147 | .page-edit
|
148 | .edit-link
|
149 | margin-bottom 0.5rem
|
150 | .last-updated
|
151 | font-size 0.8em
|
152 | float none
|
153 | text-align left
|
154 |
|
155 | </style>
|