|
|
@@ -72,6 +72,26 @@
|
|
|
</el-option>
|
|
|
</el-select> -->
|
|
|
</el-form-item>
|
|
|
+ <el-form-item label="查看链接" prop="name" v-if="detail.subjectChange">
|
|
|
+ <div class="viewlink">
|
|
|
+ <el-tooltip class="item" effect="dark" :content="copyLink" placement="top">
|
|
|
+ <span class="link">{{copyLink}}</span>
|
|
|
+ </el-tooltip>
|
|
|
+ <el-popover
|
|
|
+ placement="top"
|
|
|
+ width="220"
|
|
|
+ trigger="click">
|
|
|
+ <div class="left-code">
|
|
|
+ <div id="qrcode"
|
|
|
+ class="qrcode code"
|
|
|
+ ref="qrCodeUrl"></div>
|
|
|
+ <p class="code-url"
|
|
|
+ v-if="copyLink">{{ copyLink }} <el-link @click="copyUrl(copyLink)" class="linkbtn" type="primary">复制</el-link></p>
|
|
|
+ </div>
|
|
|
+ <el-button type="primary" class="btn" slot="reference" @click="onCreateQRCode">二维码</el-button>
|
|
|
+ </el-popover>
|
|
|
+ </div>
|
|
|
+ </el-form-item>
|
|
|
<el-form-item label="支付差价" prop="name">
|
|
|
<span style="color: red;" v-if="!detail.subjectChange">{{ spread | moneyFormat }}元</span>
|
|
|
<span style="color: red;" v-else>{{ editSpread | moneyFormat }}元</span>
|
|
|
@@ -101,6 +121,8 @@
|
|
|
</div>
|
|
|
</template>
|
|
|
<script>
|
|
|
+import QRCode from 'qrcodejs2'
|
|
|
+import copy from 'copy-to-clipboard'
|
|
|
import { getStudentOriginal, getSubjectGoodsAndInfo, subjectChangeAdd, subjectChangeCancel, getChangeInfo } from '@/api/buildTeam'
|
|
|
import accessories from './accessories'
|
|
|
|
|
|
@@ -220,6 +242,12 @@ export default {
|
|
|
},
|
|
|
},
|
|
|
computed: {
|
|
|
+ copyLink() {
|
|
|
+ if (this.detail.subjectChange) {
|
|
|
+ return location.origin + '/#/change-voice?id=' + this.detail.subjectChange.id
|
|
|
+ }
|
|
|
+ return ''
|
|
|
+ },
|
|
|
filterVoiceList() {
|
|
|
return this.voiceList.filter(item => item.subjectId !== this.detail.actualSubjectId)
|
|
|
},
|
|
|
@@ -268,6 +296,10 @@ export default {
|
|
|
}
|
|
|
},
|
|
|
methods: {
|
|
|
+ copyUrl(url) {
|
|
|
+ copy(url)
|
|
|
+ this.$message.success('复制成功')
|
|
|
+ },
|
|
|
fetchDetail() {
|
|
|
const setRes = res => {
|
|
|
const { data } = res
|
|
|
@@ -340,6 +372,20 @@ export default {
|
|
|
}
|
|
|
return Math.floor(_num * 100) / 100
|
|
|
},
|
|
|
+ onCreateQRCode () {
|
|
|
+ setTimeout(() => {
|
|
|
+ document.getElementById('qrcode').innerHTML = '';
|
|
|
+ this.qrcode = new QRCode('qrcode', {
|
|
|
+ width: 200,
|
|
|
+ height: 200,
|
|
|
+ colorDark: '#000000',
|
|
|
+ colorLight: '#ffffff',
|
|
|
+ correctLevel: QRCode.CorrectLevel.H
|
|
|
+ })
|
|
|
+ this.qrcode.makeCode(this.copyLink)
|
|
|
+ this.codeUrl = this.copyLink
|
|
|
+ }, 500)
|
|
|
+ },
|
|
|
submit() {
|
|
|
this.$refs['form'].validate((valid) => {
|
|
|
if (valid) {
|
|
|
@@ -392,5 +438,29 @@ export default {
|
|
|
}
|
|
|
</script>
|
|
|
<style lang="less" scoped>
|
|
|
-
|
|
|
+ .viewlink{
|
|
|
+ display: flex;
|
|
|
+ .link{
|
|
|
+ flex: 1;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ display: block;
|
|
|
+ white-space: nowrap;
|
|
|
+ }
|
|
|
+ .btn{
|
|
|
+ width: 100px;
|
|
|
+ margin-left: 20px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .left-code{
|
|
|
+ height: 255px;
|
|
|
+ .code-url{
|
|
|
+ margin-top: 10px;
|
|
|
+ .linkbtn{
|
|
|
+ margin-top: 0;
|
|
|
+ margin-bottom: 0;
|
|
|
+ font-size: 12px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
</style>
|
wolyshaw